You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
55 lines
2.5 KiB
HTML
55 lines
2.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<link rel="icon" type="image/x-icon" href="https://code.cif.su/CiF/Branding/raw/branch/main/Logos/Radio/CiF-Radio.svg">
|
|
<link rel="stylesheet" href="./style.css">
|
|
<script src="./script.js"></script>
|
|
<title>[ CiF ] Radio</title>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<header>
|
|
<h1 class="slidefadein title"><span class="no-break">[ CiF ] <img src="https://code.cif.su/CiF/Branding/raw/branch/main/Logos/Radio/CiF-Radio.svg"> Radio</span></h1>
|
|
<h2 class="slidefadein"><span class="no-break">The Sound of Socialism</span></h2>
|
|
</header>
|
|
|
|
<div class="card neomorphic">
|
|
<div class="player">
|
|
|
|
<div class="child">
|
|
<div id="cover-container">
|
|
<div class="image-wrapper neomorphic">
|
|
<img id="placeholder-image" alt="Placeholder image">
|
|
<img id="cover-image" alt="Current track cover">
|
|
<img id="temp-image" alt="Temporary cover">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="now-playing neomorphic-i">
|
|
<div class="song-title" id="songTitle">Not Connected</div>
|
|
<div class="artist" id="artist">[ CiF ] Radio</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="child2">
|
|
<div class="volume-knob-container">
|
|
<div class="knob-surround neomorphic">
|
|
<div id="knob" class="knob"></div>
|
|
<span class="min">Min</span>
|
|
<span class="max">Max</span>
|
|
<div id="tickContainer" class="ticks"></div>
|
|
</div>
|
|
<div class="volume-value">Volume: <span id="volumeValue">0%</span></div>
|
|
</div>
|
|
|
|
<div class="stats">
|
|
<p>You're listening together with <span id="listeners">--</span> Comrades</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html> |