added and styled albums section

This commit is contained in:
2025-05-12 21:23:54 +02:00
parent c1f6f029f6
commit 9b0daf8711
2 changed files with 89 additions and 21 deletions

View File

@@ -48,10 +48,10 @@
-->
<aside>
<section class="findme">
<span class="line1">find me</span>
<span class="line1">please also see</span>
<ul>
<li class="line2"><a href="">on <em>bandcamp</em></a></li>
<li class="line3"><a href="">on <em>lorem ipsum</em></a></li>
<li class="line2"><a href="https://git.broken.graphics/explore/repos" target="_blank">my <em>git repos</em></a></li>
<li class="line3"><a href="https://lastfuture.bandcamp.com/" target="_blank">my <em>bandcamp</em></a></li>
</ul>
<span class="line4"><a href="">more places »</a></span>
</section>
@@ -63,22 +63,38 @@
<div class="column">
<section class="box" id="music">
<header class="blurgreen headlineshadow"><h1>electronic <em>music</em><img class="icon" src="img/head-music.png" width="69" height="77" alt></h1></header>
<div class="opaque whitebg">
<h2><span class="halfbubble blurgreen"></span>albums</h2>
<!--<article>
<a href=""><img src="http://dummyimage.com/162/ccc/fff.png" alt="lastfuture - dreamshifter" /></a>
lastfuture
<h1>dreamshifter</h1>
</article>
<article>
<a href=""><img src="http://dummyimage.com/162/ccc/fff.png" alt="lastfuture - reverse kill" /></a>
lastfuture
<h1>reverse kill</h1>
</article>
-->
<div style="height: 200px;"></div>
</div>
<header class="blurgreen headlineshadow"><h1><em>music</em> releases<img class="icon" src="img/head-music.png" width="69" height="77" alt></h1></header>
<article class="opaque whitebg album">
<a href="https://lastfuture.bandcamp.com/track/misinterpreter-2" target="_blank">
<img class="albumcover" src="img/album/lastfuture_-_misinterpreter.jpg" />
<h2>lastfuture <em>misinterpreter</em></h2>
<div class="listenbuy"><em>listen</em> or <em>buy</em> on bandcamp</div>
</a>
</article>
<div class="clearfix"></div>
<article class="opaque whitebg album">
<a href="https://lastfuture.bandcamp.com/album/signal-to-noise" target="_blank">
<img class="albumcover" src="img/album/lastfuture_-_signal_to_noise.jpg" />
<h2>lastfuture <em>signal to noise</em></h2>
<div class="listenbuy"><em>listen</em> or <em>buy</em> on bandcamp</div>
</a>
</article>
<div class="clearfix"></div>
<article class="opaque whitebg album">
<a href="https://lastfuture.bandcamp.com/album/dreamshifter" target="_blank">
<img class="albumcover" src="img/album/lastfuture_-_dreamshifter.jpg" />
<h2>lastfuture <em>dreamshifter</em></h2>
<div class="listenbuy"><em>listen</em> or <em>buy</em> on bandcamp</div>
</a>
</article>
<div class="clearfix"></div>
<article class="opaque whitebg album">
<a href="https://lastfuture.bandcamp.com/album/reverse-kill" target="_blank">
<img class="albumcover" src="img/album/lastfuture_-_reverse_kill.jpg" />
<h2>lastfuture <em>reverse kill</em></h2>
<div class="listenbuy"><em>listen</em> or <em>buy</em> on bandcamp</div>
</a>
</article>
</section>
<section class="box" id="experiment">
@@ -94,7 +110,7 @@
<div class="column">
<section class="box invertedbox" id="recent">
<header class="headlineshadow whitebg"><h1>most recent <em>albums</em></h1></header>
<header class="headlineshadow whitebg"><h1><em>highlighted</em> tracks</h1></header>
<div class="opaque blurgreen">
<h2 class="headlineshadow"><em>track</em></h2>