UI/GroundLootPanel.razor

A UI Razor component for displaying a ground loot item. It finds a parent Loot component, shows the item's FullName and formatted MonetaryValue with a currency glyph, and provides a build hash for change detection; includes component CSS for layout and animations.

Reflection
@using System
@using Sandbox
@using Sandbox.UI
@namespace BrickJam.UI
@inherits PanelComponent

<root>
	@if ( Loot.IsValid() )
	{
		<div class="container">
			<span>@Loot.FullName</span>
			<div class="row">
				<span class="currency">$</span><span>@($"{Loot.MonetaryValue:n0}")</span>
			</div>
		</div>
	}
</root>

@code {
	private Loot loot;
	private Loot Loot => loot ??= GetComponentInParent<Loot>();

	protected override int BuildHash() => HashCode.Combine( Loot?.FullName, Loot?.MonetaryValue ?? 0 );
}

<style>
	GroundLootPanel {
		transition: transform 0.5s ease-in-out;
		justify-content: center;
		align-items: center;
		width: 100%;
		height: 100%;

		.container {
			padding: 10px;
			padding-right: 30px;
			padding-left: 30px;
			font-size: 32px;
			align-items: center;
			font-family: "alagard";
			flex-direction: column;
			color: white;
			text-shadow: 3px 3px 0px black;
			background: linear-gradient(to left, rgba(black, 0) 0%, rgba(black, 0.5) 20%, rgba(black, 0.5) 80%, rgba(black, 0) 100%);

			.currency {
				padding-right: 4px;
				font-size: 22px;
				top: 5px;
				color: rgba(50, 205, 50, 1);
			}
		}

		&:outro {
			transform: scale(0);
		}

		&:intro {
			transform: scale(0);
		}
	}
</style>