Front End Work
- Home Page - Custom Site Styles & Mud Theme Adjustments
This commit is contained in:
daniel-c-harvey
@@ -15,7 +15,7 @@
|
||||
Disabled="!IsLoaded"/>
|
||||
}
|
||||
</MudStack>
|
||||
<MudText Typo="Typo.body2" Class="font-monospace" Style="min-width: 120px">
|
||||
<MudText Typo="Typo.body2" Class="font-monospace deepdrft-audio-time">
|
||||
@FormatTime(CurrentTime) / @FormatTime(Duration)
|
||||
</MudText>
|
||||
</MudStack>
|
||||
@@ -27,17 +27,17 @@
|
||||
Value="@CurrentTime"
|
||||
ValueChanged="@OnSeek"
|
||||
Disabled="!IsLoaded"
|
||||
Style="flex: 1; margin-right: 8px;"/>
|
||||
Class="deepdrft-audio-slider-seek"/>
|
||||
|
||||
<div style="display: flex; align-items: center; width: 140px;">
|
||||
<MudIcon Icon="@GetVolumeIcon()" Style="margin-right: 4px;"/>
|
||||
<div class="deepdrft-audio-controls">
|
||||
<MudIcon Icon="@GetVolumeIcon()" Class="deepdrft-audio-volume-icon"/>
|
||||
<MudSlider T="double"
|
||||
Min="0"
|
||||
Max="1"
|
||||
Step="0.01"
|
||||
Value="@Volume"
|
||||
ValueChanged="@OnVolumeChange"
|
||||
Style="flex: 1;"/>
|
||||
Class="deepdrft-audio-slider"/>
|
||||
</div>
|
||||
</MudStack>
|
||||
@if (!string.IsNullOrEmpty(ErrorMessage))
|
||||
|
||||
@@ -1,42 +1,35 @@
|
||||
<MudCard Style="width: 250px; height: 250px; position: relative; overflow: hidden;"
|
||||
<MudCard Class="deepdrft-track-card-container"
|
||||
Elevation="4">
|
||||
|
||||
@if (!string.IsNullOrEmpty(TrackModel?.ImagePath))
|
||||
{
|
||||
<div style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;
|
||||
background-image: url('@TrackModel.ImagePath');
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
filter: brightness(0.7);">
|
||||
<div class="deepdrft-track-card-bg" style="background-image: url('@TrackModel.ImagePath');">
|
||||
</div>
|
||||
}
|
||||
else
|
||||
{
|
||||
<MudPaper Style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;"
|
||||
Class="mud-theme-secondary"
|
||||
<MudPaper Class="deepdrft-track-card-fallback mud-theme-secondary"
|
||||
Elevation="0">
|
||||
</MudPaper>
|
||||
}
|
||||
|
||||
<MudCardContent Style="position: relative; z-index: 1; height: 100%; display: flex; flex-direction: column; justify-content: space-between; padding: 16px;">
|
||||
<MudCardContent Class="deepdrft-track-card-content">
|
||||
|
||||
<div>
|
||||
<div class="deepdrft-track-info-top">
|
||||
<MudText Typo="Typo.h6"
|
||||
Color="Color.Surface"
|
||||
Style="margin-bottom: 4px;"
|
||||
Class="text-truncate">
|
||||
Class="text-truncate mb-1">
|
||||
@TrackModel?.TrackName
|
||||
</MudText>
|
||||
|
||||
<MudText Typo="Typo.subtitle1"
|
||||
Color="Color.Surface"
|
||||
Style="margin-bottom: 8px;"
|
||||
Class="text-truncate">
|
||||
Class="text-truncate mb-2">
|
||||
@TrackModel?.Artist
|
||||
</MudText>
|
||||
</div>
|
||||
|
||||
<div Style="margin: 8px 0;">
|
||||
<div class="deepdrft-track-info-middle">
|
||||
@if (!string.IsNullOrEmpty(TrackModel?.Album))
|
||||
{
|
||||
<MudText Typo="Typo.caption"
|
||||
@@ -52,13 +45,13 @@
|
||||
Size="Size.Small"
|
||||
Variant="Variant.Filled"
|
||||
Color="Color.Primary"
|
||||
Style="opacity: 0.9; margin-top: 4px;">
|
||||
Class="deepdrft-genre-chip">
|
||||
@TrackModel.Genre
|
||||
</MudChip>
|
||||
}
|
||||
</div>
|
||||
|
||||
<div Style="display: flex; justify-content: space-between; align-items: center;">
|
||||
<div class="deepdrft-track-info-bottom">
|
||||
@if (TrackModel?.ReleaseDate.HasValue == true)
|
||||
{
|
||||
<MudText Typo="Typo.caption"
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
@foreach (var track in Tracks)
|
||||
{
|
||||
<MudItem xs="12" sm="6" md="4" lg="2" xl="2">
|
||||
<div Style="display: flex; justify-content: center;">
|
||||
<div class="deepdrft-track-gallery-item-center">
|
||||
<TrackCard TrackModel="@track" IsPlaying="@(track.Id == SelectedTrack?.Id)" OnPlay="@HandlePlayClick"/>
|
||||
</div>
|
||||
</MudItem>
|
||||
|
||||
@@ -74,10 +74,10 @@
|
||||
|
||||
private readonly PaletteLight _lightPalette = new()
|
||||
{
|
||||
Primary = "#9370DB", // MediumPurple - stronger but still pastel
|
||||
Secondary = "#F4A460", // SandyBrown - warm pastel orange
|
||||
Tertiary = "#FF1493", // DeepPink - vibrant accent (kept neon)
|
||||
Info = "#8A2BE2", // BlueViolet - stronger purple info
|
||||
Primary = "#8A2BE2", // BlueViolet - main DeepDrft purple
|
||||
Secondary = "#FF1493", // DeepPink - main DeepDrft pink
|
||||
Tertiary = "#4B0082", // Indigo - DeepDrft deep purple
|
||||
Info = "#9370DB", // MediumPurple - DeepDrft accent purple
|
||||
Success = "#98FB98", // PaleGreen - soft success
|
||||
Warning = "#FFEAA7", // Light peach - soft warning
|
||||
Error = "#FFB6C1", // LightPink - soft error
|
||||
@@ -86,35 +86,35 @@
|
||||
Surface = "#FFFAF0", // FloralWhite - creamy surface
|
||||
Background = "#FAF0E6", // Linen - warm cream background
|
||||
AppbarText = "#2F2F2F", // Dark text on light appbar
|
||||
AppbarBackground = "rgba(211,180,221,0.90)", // Translucent plum - more presence
|
||||
DrawerBackground = "#D3B4DD", // Plum drawer - stronger presence
|
||||
AppbarBackground = "rgba(138,43,226,0.85)", // Translucent DeepDrft primary
|
||||
DrawerBackground = "rgba(138,43,226,0.1)", // Very light DeepDrft primary
|
||||
TextPrimary = "#2F2F2F", // Dark primary text
|
||||
TextSecondary = "#6B6B6B", // Medium gray secondary text
|
||||
GrayLight = "#E6E6FA", // Lavender - light purple-tinted gray
|
||||
GrayLighter = "#F8F8FF", // GhostWhite - very light purple-tinted
|
||||
GrayDefault = "#BC8F8F", // RosyBrown - warm gray
|
||||
GrayDark = "#8B4513", // SaddleBrown - warm dark gray
|
||||
Divider = "#E6E6FA", // Lavender - soft purple divider lines
|
||||
TableLines = "#E6E6FA", // Lavender - soft table lines
|
||||
GrayLight = "rgba(138,43,226,0.1)", // Light DeepDrft tint
|
||||
GrayLighter = "rgba(138,43,226,0.05)", // Very light DeepDrft tint
|
||||
GrayDefault = "rgba(138,43,226,0.2)", // Medium DeepDrft tint
|
||||
GrayDark = "rgba(138,43,226,0.4)", // Darker DeepDrft tint
|
||||
Divider = "rgba(138,43,226,0.15)", // Soft DeepDrft divider lines
|
||||
TableLines = "rgba(138,43,226,0.15)", // Soft DeepDrft table lines
|
||||
};
|
||||
|
||||
private readonly PaletteDark _darkPalette = new()
|
||||
{
|
||||
Primary = "#FF69B4", // HotPink - softer magenta for dark mode
|
||||
Secondary = "#4B0082", // Indigo - deep purple from logo
|
||||
Tertiary = "#8A2BE2", // BlueViolet - purple accent instead of blue
|
||||
Info = "#9370DB", // MediumPurple - purple info instead of blue
|
||||
Primary = "#FF1493", // DeepPink - main DeepDrft pink for dark mode
|
||||
Secondary = "#8A2BE2", // BlueViolet - main DeepDrft purple
|
||||
Tertiary = "#9370DB", // MediumPurple - DeepDrft accent
|
||||
Info = "#4B0082", // Indigo - DeepDrft deep purple
|
||||
Success = "#00FF7F", // SpringGreen - bright success
|
||||
Warning = "#FFD700", // Gold - warning color
|
||||
Error = "#FF6347", // Tomato - error color
|
||||
Black = "#000000", // Pure black
|
||||
White = "#FFFFFF", // Pure white
|
||||
Surface = "#2D1B4E", // Dark purple - surface with purple tint
|
||||
Background = "#0D0D0D", // Near black - very dark background
|
||||
Surface = "rgba(75,0,130,0.2)", // Dark DeepDrft indigo tint
|
||||
Background = "#0A0A0A", // Very dark background
|
||||
BackgroundGray = "#1A1A1A", // Very dark gray
|
||||
AppbarText = "#FFFFFF", // White text on dark appbar
|
||||
AppbarBackground = "rgba(45,27,78,0.95)", // Translucent dark purple
|
||||
DrawerBackground = "#2D1B4E", // Dark purple drawer
|
||||
AppbarBackground = "rgba(75,0,130,0.95)", // Translucent DeepDrft indigo
|
||||
DrawerBackground = "rgba(75,0,130,0.15)", // Dark DeepDrft indigo tint
|
||||
DrawerIcon = "#E0E0E0", // Light gray icons
|
||||
DrawerText = "#E0E0E0", // Light gray drawer text
|
||||
ActionDefault = "#BDBDBD", // Light gray for actions
|
||||
@@ -123,13 +123,13 @@
|
||||
TextPrimary = "#FFFFFF", // White primary text
|
||||
TextSecondary = "#E0E0E0", // Light gray secondary text
|
||||
TextDisabled = "#757575", // Disabled text
|
||||
GrayLight = "#424242", // Light gray in dark mode
|
||||
GrayLighter = "#2F2F2F", // Lighter gray in dark mode
|
||||
GrayDefault = "#757575", // Default gray
|
||||
GrayDark = "#BDBDBD", // Dark gray (inverted for dark mode)
|
||||
Divider = "#424242", // Medium gray divider lines
|
||||
LinesDefault = "#424242", // Default lines
|
||||
TableLines = "#424242", // Table lines
|
||||
GrayLight = "rgba(255,20,147,0.15)", // Light DeepDrft pink tint
|
||||
GrayLighter = "rgba(255,20,147,0.08)", // Lighter DeepDrft pink tint
|
||||
GrayDefault = "rgba(255,20,147,0.25)", // Default DeepDrft pink tint
|
||||
GrayDark = "rgba(255,20,147,0.4)", // Darker DeepDrft pink tint
|
||||
Divider = "rgba(255,20,147,0.2)", // DeepDrft pink divider lines
|
||||
LinesDefault = "rgba(255,20,147,0.2)", // DeepDrft pink lines
|
||||
TableLines = "rgba(255,20,147,0.2)", // DeepDrft pink table lines
|
||||
OverlayLight = "rgba(0,0,0,0.7)", // Dark overlay
|
||||
OverlayDark = "rgba(255,255,255,0.1)", // Light overlay for dark mode
|
||||
};
|
||||
|
||||
@@ -1,8 +1,7 @@
|
||||
@using DeepDrftWeb.Client.Controls
|
||||
|
||||
<AppNavLink Href="" Match="NavLinkMatch.All" Icon="@Icons.Material.Filled.Home">Home</AppNavLink>
|
||||
<AppNavLink Href="/tracks" Match="NavLinkMatch.Prefix" Icon="@Icons.Material.Filled.BrowseGallery">Track Gallery</AppNavLink>
|
||||
<AppNavLink Href="/audio-example" Match="NavLinkMatch.Prefix" Icon="@Icons.Material.Filled.LibraryMusic">Audio Test</AppNavLink>
|
||||
<AppNavLink Href="/tracks" Match="NavLinkMatch.Prefix" Icon="@Icons.Material.Filled.LibraryMusic">Track Gallery</AppNavLink>
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -1,4 +1,225 @@
|
||||
@page "/"
|
||||
|
||||
<PageTitle>Deep Drft Home</PageTitle>
|
||||
<PageTitle>DeepDrft - Electronic Music Collective</PageTitle>
|
||||
|
||||
<MudContainer MaxWidth="MaxWidth.ExtraLarge" Class="pa-0">
|
||||
|
||||
@* Hero Section *@
|
||||
<MudPaper Elevation="0" Class="pa-8 mb-6 text-center deepdrft-gradient-hero deepdrft-hero-container">
|
||||
|
||||
<MudGrid Justify="Justify.Center" AlignItems="Center">
|
||||
<MudItem xs="12" md="8">
|
||||
<MudText Typo="Typo.h1" Color="Color.Surface"
|
||||
Class="mb-4 deepdrft-text-hero">
|
||||
DEEPDRFT
|
||||
</MudText>
|
||||
|
||||
<MudText Typo="Typo.h4" Color="Color.Surface"
|
||||
Class="mb-6 deepdrft-text-subtitle">
|
||||
ELECTRONIC MUSIC COLLECTIVE
|
||||
</MudText>
|
||||
|
||||
<MudText Typo="Typo.h6" Color="Color.Surface"
|
||||
Class="mb-8 deepdrft-text-description deepdrft-hero-text-container">
|
||||
Live electronic music from Charleston, SC featuring house, techno, trance, and IDM crafted with synthesizers and grooveboxes
|
||||
</MudText>
|
||||
|
||||
<MudButton Variant="Variant.Filled"
|
||||
Color="Color.Surface"
|
||||
Size="Size.Large"
|
||||
Class="mr-4 mb-2 deepdrft-button-primary">
|
||||
<MudIcon Icon="@Icons.Material.Filled.PlayArrow" Class="mr-2" />
|
||||
START STREAMING
|
||||
</MudButton>
|
||||
|
||||
<MudButton Variant="Variant.Outlined"
|
||||
Color="Color.Surface"
|
||||
Size="Size.Large"
|
||||
Class="mb-2 deepdrft-button-outlined">
|
||||
<MudIcon Icon="@Icons.Material.Filled.LibraryMusic" Class="mr-2" />
|
||||
BROWSE TRACKS
|
||||
</MudButton>
|
||||
</MudItem>
|
||||
</MudGrid>
|
||||
</MudPaper>
|
||||
|
||||
@* About Section *@
|
||||
<MudGrid Class="mb-8" Spacing="6">
|
||||
<MudItem xs="12" md="6">
|
||||
<MudPaper Elevation="4" Class="pa-6 deepdrft-gradient-soft-primary deepdrft-border-left-primary deepdrft-about-card">
|
||||
<MudText Typo="Typo.h4" Color="Color.Primary" Class="mb-4 deepdrft-text-bold">
|
||||
<MudIcon Icon="@Icons.Material.Filled.Group" Class="mr-2" />
|
||||
The Collective
|
||||
</MudText>
|
||||
<MudText Typo="Typo.body1" Class="mb-4 deepdrft-text-readable">
|
||||
DeepDrft is a two-member electronic music collective based in Charleston, South Carolina.
|
||||
We create immersive soundscapes that blend the energy of underground club culture with
|
||||
the precision of live electronic performance.
|
||||
</MudText>
|
||||
<MudText Typo="Typo.body1" Class="deepdrft-text-readable">
|
||||
Using an arsenal of synthesizers, drum machines, and grooveboxes, we craft dynamic live
|
||||
performances that span house, techno, trance, and intelligent dance music (IDM).
|
||||
Every session is a journey through sound and rhythm.
|
||||
</MudText>
|
||||
</MudPaper>
|
||||
</MudItem>
|
||||
|
||||
<MudItem xs="12" md="6">
|
||||
<MudPaper Elevation="4" Class="pa-6 deepdrft-gradient-soft-secondary deepdrft-border-left-secondary deepdrft-about-card">
|
||||
<MudText Typo="Typo.h4" Color="Color.Secondary" Class="mb-4 deepdrft-text-bold">
|
||||
<MudIcon Icon="@Icons.Material.Filled.MusicNote" Class="mr-2" />
|
||||
Our Sound
|
||||
</MudText>
|
||||
<MudChipSet T="string" Class="mb-4">
|
||||
<MudChip Color="Color.Primary" Class="deepdrft-chip-spacing">House</MudChip>
|
||||
<MudChip Color="Color.Secondary" Class="deepdrft-chip-spacing">Techno</MudChip>
|
||||
<MudChip Color="Color.Tertiary" Class="deepdrft-chip-spacing">Trance</MudChip>
|
||||
<MudChip Color="Color.Info" Class="deepdrft-chip-spacing">IDM</MudChip>
|
||||
<MudChip Color="Color.Primary" Variant="Variant.Outlined" Class="deepdrft-chip-spacing">Progressive</MudChip>
|
||||
<MudChip Color="Color.Secondary" Variant="Variant.Outlined" Class="deepdrft-chip-spacing">Ambient</MudChip>
|
||||
</MudChipSet>
|
||||
<MudText Typo="Typo.body1" Class="deepdrft-text-readable">
|
||||
From deep, driving basslines to ethereal atmospheric textures, our music explores the
|
||||
full spectrum of electronic expression. We believe in the power of live performance
|
||||
to create unique, unrepeatable moments that connect artist and audience through rhythm and melody.
|
||||
</MudText>
|
||||
</MudPaper>
|
||||
</MudItem>
|
||||
</MudGrid>
|
||||
|
||||
@* Features Section *@
|
||||
<MudPaper Elevation="2" Class="pa-8 mb-8 deepdrft-gradient-features">
|
||||
<MudText Typo="Typo.h3" Align="Align.Center" Color="Color.Primary" Class="mb-8 deepdrft-text-bold">
|
||||
Experience DeepDrft
|
||||
</MudText>
|
||||
|
||||
<MudGrid Spacing="6">
|
||||
<MudItem xs="12" sm="6" md="3">
|
||||
<MudCard Elevation="8" Class="pa-4 deepdrft-feature-card deepdrft-feature-icon-container deepdrft-card-purple-tint">
|
||||
<MudIcon Icon="@Icons.Material.Filled.Headphones"
|
||||
Size="Size.Large"
|
||||
Color="Color.Primary"
|
||||
Class="mb-3 deepdrft-icon-large" />
|
||||
<MudText Typo="Typo.h6" Color="Color.Primary" Class="mb-2 deepdrft-text-bold">
|
||||
High-Quality Streaming
|
||||
</MudText>
|
||||
<MudText Typo="Typo.body2">
|
||||
Crystal-clear audio streaming with lossless quality for the best listening experience
|
||||
</MudText>
|
||||
</MudCard>
|
||||
</MudItem>
|
||||
|
||||
<MudItem xs="12" sm="6" md="3">
|
||||
<MudCard Elevation="8" Class="pa-4 deepdrft-feature-card deepdrft-feature-icon-container deepdrft-card-pink-tint">
|
||||
<MudIcon Icon="@Icons.Material.Filled.LiveTv"
|
||||
Size="Size.Large"
|
||||
Color="Color.Tertiary"
|
||||
Class="mb-3 deepdrft-icon-large" />
|
||||
<MudText Typo="Typo.h6" Color="Color.Tertiary" Class="mb-2 deepdrft-text-bold">
|
||||
Live Sessions
|
||||
</MudText>
|
||||
<MudText Typo="Typo.body2">
|
||||
Join us for live streaming sessions and experience electronic music as it's created
|
||||
</MudText>
|
||||
</MudCard>
|
||||
</MudItem>
|
||||
|
||||
<MudItem xs="12" sm="6" md="3">
|
||||
<MudCard Elevation="8" Class="pa-4 deepdrft-feature-card deepdrft-feature-icon-container deepdrft-card-indigo-tint">
|
||||
<MudIcon Icon="@Icons.Material.Filled.VideoLibrary"
|
||||
Size="Size.Large"
|
||||
Color="Color.Secondary"
|
||||
Class="mb-3 deepdrft-icon-large" />
|
||||
<MudText Typo="Typo.h6" Color="Color.Secondary" Class="mb-2 deepdrft-text-bold">
|
||||
Video Content
|
||||
</MudText>
|
||||
<MudText Typo="Typo.body2">
|
||||
Watch behind-the-scenes content and live performance videos (coming soon)
|
||||
</MudText>
|
||||
</MudCard>
|
||||
</MudItem>
|
||||
|
||||
<MudItem xs="12" sm="6" md="3">
|
||||
<MudCard Elevation="8" Class="pa-4 deepdrft-feature-card deepdrft-feature-icon-container deepdrft-card-lavender-tint">
|
||||
<MudIcon Icon="@Icons.Material.Filled.Archive"
|
||||
Size="Size.Large"
|
||||
Color="Color.Info"
|
||||
Class="mb-3 deepdrft-icon-large" />
|
||||
<MudText Typo="Typo.h6" Color="Color.Info" Class="mb-2 deepdrft-text-bold">
|
||||
Growing Archive
|
||||
</MudText>
|
||||
<MudText Typo="Typo.body2">
|
||||
Explore our expanding collection of tracks, mixes, and live recordings
|
||||
</MudText>
|
||||
</MudCard>
|
||||
</MudItem>
|
||||
</MudGrid>
|
||||
</MudPaper>
|
||||
|
||||
@* Location & Connect Section *@
|
||||
<MudGrid Class="mb-8" Spacing="6">
|
||||
<MudItem xs="12" md="6">
|
||||
<MudPaper Elevation="4" Class="pa-6 deepdrft-gradient-soft-accent deepdrft-border-top-primary">
|
||||
<MudText Typo="Typo.h4" Color="Color.Primary" Class="mb-4 deepdrft-text-bold">
|
||||
<MudIcon Icon="@Icons.Material.Filled.LocationOn" Class="mr-2" />
|
||||
Charleston, SC
|
||||
</MudText>
|
||||
<MudText Typo="Typo.body1" Class="mb-4 deepdrft-text-readable">
|
||||
Based in the vibrant music scene of Charleston, South Carolina, DeepDrft draws inspiration
|
||||
from both the city's rich cultural heritage and the cutting-edge sounds of global electronic music.
|
||||
</MudText>
|
||||
<MudText Typo="Typo.body1" Class="deepdrft-text-readable">
|
||||
The Holy City's unique blend of tradition and innovation provides the perfect backdrop
|
||||
for our electronic explorations, where historic charm meets futuristic beats.
|
||||
</MudText>
|
||||
</MudPaper>
|
||||
</MudItem>
|
||||
|
||||
<MudItem xs="12" md="6">
|
||||
<MudPaper Elevation="4" Class="pa-6 deepdrft-gradient-soft-tertiary deepdrft-border-top-secondary">
|
||||
<MudText Typo="Typo.h4" Color="Color.Tertiary" Class="mb-4 deepdrft-text-bold">
|
||||
<MudIcon Icon="@Icons.Material.Filled.ConnectWithoutContact" Class="mr-2" />
|
||||
Connect With Us
|
||||
</MudText>
|
||||
<MudText Typo="Typo.body1" Class="mb-4 deepdrft-text-readable">
|
||||
Stay connected with DeepDrft for the latest releases, live session announcements,
|
||||
and updates from our studio in Charleston.
|
||||
</MudText>
|
||||
<MudButtonGroup Variant="Variant.Outlined" Class="mb-2">
|
||||
<MudButton StartIcon="@Icons.Material.Filled.Email" Color="Color.Primary">
|
||||
Newsletter
|
||||
</MudButton>
|
||||
<MudButton StartIcon="@Icons.Material.Filled.Notifications" Color="Color.Tertiary">
|
||||
Live Alerts
|
||||
</MudButton>
|
||||
</MudButtonGroup>
|
||||
</MudPaper>
|
||||
</MudItem>
|
||||
</MudGrid>
|
||||
|
||||
@* Call to Action *@
|
||||
<MudPaper Elevation="8" Class="pa-8 deepdrft-gradient-primary deepdrft-cta-container">
|
||||
<MudText Typo="Typo.h3" Color="Color.Surface" Class="mb-4 deepdrft-text-bold">
|
||||
Ready to Dive Deep?
|
||||
</MudText>
|
||||
<MudText Typo="Typo.h6" Color="Color.Surface" Class="mb-6 deepdrft-text-description">
|
||||
Immerse yourself in the electronic soundscapes of DeepDrft
|
||||
</MudText>
|
||||
<MudButtonGroup Size="Size.Large" Class="deepdrft-cta-buttons">
|
||||
<MudButton Variant="Variant.Filled"
|
||||
Color="Color.Surface"
|
||||
Class="deepdrft-button-primary deepdrft-button-spaced">
|
||||
<MudIcon Icon="@Icons.Material.Filled.PlayCircle" Class="mr-2" />
|
||||
EXPLORE MUSIC
|
||||
</MudButton>
|
||||
<MudButton Variant="Variant.Outlined"
|
||||
Color="Color.Surface"
|
||||
Class="deepdrft-button-outlined deepdrft-button-spaced">
|
||||
<MudIcon Icon="@Icons.Material.Filled.Schedule" Class="mr-2" />
|
||||
LIVE SCHEDULE
|
||||
</MudButton>
|
||||
</MudButtonGroup>
|
||||
</MudPaper>
|
||||
|
||||
</MudContainer>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user