Fix: audio

S-Guerra · Apr 18, 2024 · 70d8230 · 70d8230
1 parent d0144a3
commit 70d8230
Show file tree

Hide file tree

Showing 4 changed files with 7 additions and 13 deletions.
diff --git a/images/New_Retro_Wave_Sun_Logo.png → assets/logo.png b/images/New_Retro_Wave_Sun_Logo.png → assets/logo.png
diff --git a/assets/music.mp3 b/assets/music.mp3
diff --git a/index.html b/index.html
@@ -1,5 +1,3 @@
-<!-- exemple image: https://images.hdqwalls.com/download/retrowave-ap-3840x2400.jpg -->
-
 <!DOCTYPE html>
 <html>
 
@@ -11,7 +9,7 @@
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link href="https://fonts.googleapis.com/css2?family=VT323&display=swap" rel="stylesheet">
-    <link rel="icon" href=".\images\New_Retro_Wave_Sun_Logo.png" type="image">
+    <link rel="icon" href=".\assets\logo.png" type="image">
 </head>
 
 <body>
@@ -21,11 +19,10 @@
             <h1 id="instruction">Press F11 to view in fullscreen</h1>
         </div>
     </div>
-    <iframe class="spotify absolute" style="border-radius:12px"
-        src="https://open.spotify.com/embed/track/2PZrXkW8QNsJwYdG9lgTmB?utm_source=generator" frameBorder="0"
-        allowfullscreen="" allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture"
-        loading="lazy">
-    </iframe>
+    <audio class="music absolute" controls>
+        <source src=".\assets\music.mp3" type="audio/mpeg">
+        Your browser does not support the audio element.
+    </audio>
     <div class="plain absolute">
         <!-- grid | horizontal -->
         <div class="horizontal-line absolute first"></div>

diff --git a/styles.css b/styles.css
@@ -44,13 +44,10 @@ body {
     animation-fill-mode: forwards;
 }
 
-.spotify {
+.music {
     top: 1.5vh;
     right: 1.5vh;
-    width: 40vh;
-    min-width: 250px;
-    height: 10vh;
-    min-height: 80px;
+    z-index: 2;
 }
 
 .plain {