UI/Components/Menu/MenuHeroCard.razor

A Razor UI component for the menu hero card. It renders optional background image, fade, subtitle, icon, title and description and exposes string properties for those fields.

File Access
@namespace Sunless.Libraries.UI
@using Sandbox
@using Sandbox.UI
@inherits Panel
@attribute [StyleSheet]

<root class="menu-hero-card">
	@if ( !string.IsNullOrEmpty( Image ) )
	{
		<div class="hero-bg" style="background-image: url(@Image)"></div>
		<div class="hero-fade"></div>
	}
	<div class="hero-body">
		@if ( !string.IsNullOrEmpty( Subtitle ) )
		{
			<div class="hero-sub">@Subtitle</div>
		}
		<div class="hero-title-row">
			@if ( !string.IsNullOrEmpty( Icon ) )
			{
				<Icon Name=@Icon Size=@(IconSize.Large) />
			}
			<div class="hero-title">@Title</div>
		</div>
		@if ( !string.IsNullOrEmpty( Description ) )
		{
			<div class="hero-desc">@Description</div>
		}
	</div>
</root>

@code
{
	public string Title { get; set; }
	public string Subtitle { get; set; }
	public string Description { get; set; }
	public string Image { get; set; }
	public string Icon { get; set; }

	protected override int BuildHash() => HashCode.Combine( Title, Subtitle, Description, Image, Icon );
}