feat: replace home genre cards with Music through Every Medium image section

This commit is contained in:
daniel-c-harvey
2026-06-11 17:55:13 -04:00
parent 38e345ccf7
commit a6e565e445
2 changed files with 91 additions and 47 deletions
+33 -27
View File
@@ -40,47 +40,53 @@
<div class="divider-line"></div>
</div>
@* Sound section *@
@* Medium section *@
<section class="section">
<div class="section-header-grid">
<MudGrid Style="margin-bottom: 5rem;">
<MudItem xs="12" md="4">
<div class="section-label">Genres &amp; Moods</div>
<h2 class="section-title">Every<br /><em>Frequency</em><br />Explored</h2>
<div class="section-label">Format &amp; Medium</div>
<h2 class="section-title">Music through<br /><em>Every</em><br />Medium</h2>
</MudItem>
<MudItem xs="12" md="8">
<p class="section-body">
From the hypnotic pulse of deep house to the fractal complexity of IDM, Deep DRFT refuses to be categorized. We treat genre as a palette &mdash; not a cage. Each session begins as something and ends as something else entirely.
The same hands, three different rooms. A studio cut is built; a live set is risked; a DJ mix is woven. We release in every form the music asks for &mdash; each one a different relationship between the moment and the record of it.
</p>
</MudItem>
</MudGrid>
</div>
<div class="genre-grid">
@* TODO Phase 2.2: wire each genre to /genres/{slug} *@
<div class="genre-card">
<div class="genre-name">House</div>
<div class="genre-count">Foundation</div>
<div class="medium-grid">
@* TODO Phase 3.x: wire each card to its format-filtered browse route once /tracks?format= exists *@
<div class="medium-card">
<div class="medium-image" style="background-image: url('img/dd-studio.jpg');">
<div class="medium-scrim"></div>
</div>
<div class="medium-body">
<div class="medium-type">Studio</div>
<div class="medium-name">Studio Releases</div>
<div class="medium-desc">Composed, layered, and finished &mdash; tracks built to be returned to.</div>
</div>
</div>
<div class="genre-card">
<div class="genre-name">Techno</div>
<div class="genre-count">Architecture</div>
<div class="medium-card">
<div class="medium-image" style="background-image: url('img/dd-live.jpeg');">
<div class="medium-scrim"></div>
</div>
<div class="medium-body">
<div class="medium-type">Live</div>
<div class="medium-name">Live Releases</div>
<div class="medium-desc">Performances caught in the moment, unrepeatable and unedited.</div>
</div>
</div>
<div class="genre-card">
<div class="genre-name">Trance</div>
<div class="genre-count">Ascension</div>
</div>
<div class="genre-card">
<div class="genre-name">IDM</div>
<div class="genre-count">Intelligence</div>
</div>
<div class="genre-card">
<div class="genre-name">Progressive</div>
<div class="genre-count">Journey</div>
</div>
<div class="genre-card">
<div class="genre-name">Ambient</div>
<div class="genre-count">Atmosphere</div>
<div class="medium-card">
<div class="medium-image" style="background-image: url('img/dd-dj.jpeg');">
<div class="medium-scrim"></div>
</div>
<div class="medium-body">
<div class="medium-type">Mix</div>
<div class="medium-name">DJ Mix Releases</div>
<div class="medium-desc">Uninterrupted sets &mdash; one track bleeding into the next, start to finish.</div>
</div>
</div>
</div>
</section>