9876a080d8
- Updated About page - Added El Camino by The Black Keys to the Music page - New site button
77 lines
4.6 KiB
PHP
77 lines
4.6 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Music</title>
|
|
<link href="../../style.css" rel="stylesheet" type="text/css" media="all">
|
|
<style type="text/css">
|
|
#flex-container {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
filter: drop-shadow(3px 3px 6px black);
|
|
}
|
|
#flex-container a {
|
|
--columncount: 2;
|
|
position: relative;
|
|
width: calc(var(--bodywidth) / var(--columncount));
|
|
height: calc(var(--bodywidth) / var(--columncount));
|
|
background-image: var(--img);
|
|
background-size: cover;
|
|
transition-duration: 0.5s;
|
|
overflow: hidden;
|
|
}
|
|
#flex-container a:hover {
|
|
z-index: 50;
|
|
box-shadow: 0 0 12px 2px black;
|
|
transform: scale(1.2);
|
|
color: #df1955;
|
|
}
|
|
#flex-container a span {
|
|
background-color: #000000cc;
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 0;
|
|
right: 0;
|
|
height: 5.2rem;
|
|
padding: 0 2rem;
|
|
display: flex;
|
|
align-items: center;
|
|
transition-duration: 0.5s;
|
|
box-sizing: border-box;
|
|
}
|
|
#flex-container a:hover span {
|
|
bottom: -5.2rem;
|
|
}
|
|
</style>
|
|
<?php include($_SERVER['DOCUMENT_ROOT'] . '/seasonal.php'); ?>
|
|
</head>
|
|
|
|
<body>
|
|
<?php include($_SERVER['DOCUMENT_ROOT'] . '/nav.php'); ?>
|
|
<h1>music</h1>
|
|
<h2 id="caption">Albums I like</h2>
|
|
<div id="flex-container">
|
|
<a style="--img: url(covers/spectrum.png);" target="_blank" href="https://findaeden.bandcamp.com/album/spectrum"><span>findaeden - Spectrum</span></a>
|
|
<a style="--img: url(covers/funeral.png);" target="_blank" href="https://noisemaster.bandcamp.com/album/funeral-ep"><span>Noisemaker - Funeral EP</span></a>
|
|
<a style="--img: url(covers/ultrakill_imperfect_hatred.png);" target="_blank" href="https://heavenpierceher.bandcamp.com/album/ultrakill-imperfect-hatred"><span>Heaven Pierce Her - ULTRAKILL: Imperfect Hatred</span></a>
|
|
<a style="--img: url(covers/el_camino.png);" target="_blank" href="https://theblackkeys.com/?frontpage=true"><span>The Black Keys - El Camino</span></a>
|
|
<a style="--img: url(covers/triangle_unicode.png);" target="_blank" href="https://wearemagonia.bandcamp.com/album/triangle-unicode-lp"><span>We Are Magonia - Triangle Unicode</span></a>
|
|
<a style="--img: url(covers/unstoppable_force.png);" target="_blank" href="https://caliphate.bandcamp.com/album/unstoppable-force"><span>CALIPHATE - Unstoppable Force</span></a>
|
|
<a style="--img: url(covers/walks_of_lung.png);" target="_blank" href="https://patriciataxxon.bandcamp.com/album/walks-of-lung"><span>Patricia Taxxon - Walks of Lung</span></a>
|
|
<a style="--img: url(covers/realign.png);" target="_blank" href="https://vine.bandcamp.com/album/realign"><span>Red Vox - Realign</span></a>
|
|
<a style="--img: url(covers/fucked_up_friends_3.png);" target="_blank" href="https://tobaxxo.bandcamp.com/album/fucked-up-friends-3"><span>TOBACCO - Fucked Up Friends 3</span></a>
|
|
<a style="--img: url(covers/synthicate.png);" target="_blank" href="https://newretrowave.bandcamp.com/album/synthicate"><span>LAZERPUNK - Synthicate</span></a>
|
|
<a style="--img: url(covers/vast.png);" target="_blank" href="https://waterflame.bandcamp.com/album/vast"><span>Waterflame - Vast</span></a>
|
|
<a style="--img: url(covers/tortured_waters.png);" target="_blank" href="https://newretrowave.bandcamp.com/album/tortured-waters"><span>DEADLIFE - Tortured Waters</span></a>
|
|
<a style="--img: url(covers/millenialism.png);" target="_blank" href="https://music.businesscasual.biz/album/millennialism"><span>NYSE - MILLENNIALISM</span></a>
|
|
<a style="--img: url(covers/concrete_and_gold.png);" target="_blank" href="https://www.foofighters.com/"><span>Foo Fighters - Concrete and Gold</span></a>
|
|
<a style="--img: url(covers/revolution_radio.png);" target="_blank" href="https://greenday.com/"><span>Green Day - Revolution Radio</span></a>
|
|
<a style="--img: url(covers/the_last_ninja_2_c64_ost.png);" target="_blank" href="https://www.youtube-nocookie.com/embed/bjbN2RyZXHI"><span>Matt Gray - The Last Ninja 2 (C64) OST</span></a>
|
|
<a style="--img: url(covers/aeon_core.png);" target="_blank" href="https://perctrax.bandcamp.com/album/aeon-core"><span>Scalameriya - Aeon Core</span></a>
|
|
</div>
|
|
<div id="leftsidebg" style="background-image: url(bg.png); --distancefromcenter: -10%;" title="Pictured: Not necessarily the best, but objectively the coolest medium of music storage. Who am I kidding, this just looks cool. The coolest medium of music storage is obviously CDs, on account of the lasers and the ease of making digital backups."></div>
|
|
<br>
|
|
<?php include($_SERVER['DOCUMENT_ROOT'] . '/chromealert.php'); ?>
|
|
</body>
|
|
</html>
|