diff options
author | Indrajith K L | 2022-11-26 04:19:24 +0530 |
---|---|---|
committer | Indrajith K L | 2022-11-26 04:19:24 +0530 |
commit | 832d1a4363f6dd99bef2bc9a61f2b58a6e76c4a4 (patch) | |
tree | d5a4f7cbb472b622019341a353a2a0fbbaeb3c5b /index.html | |
parent | d6987de7b8947d5df5fe7896797bdec8ea337d70 (diff) | |
download | retrowave-player-832d1a4363f6dd99bef2bc9a61f2b58a6e76c4a4.tar.gz retrowave-player-832d1a4363f6dd99bef2bc9a61f2b58a6e76c4a4.tar.bz2 retrowave-player-832d1a4363f6dd99bef2bc9a61f2b58a6e76c4a4.zip |
Cosmetic Changes
History Upload implementation
Diffstat (limited to 'index.html')
-rw-r--r-- | index.html | 25 |
1 files changed, 15 insertions, 10 deletions
@@ -8,17 +8,21 @@ <title>Retrowave Player</title> <script src="https://cdnjs.cloudflare.com/ajax/libs/howler/2.2.3/howler.min.js"></script> <link rel="stylesheet" href="hg.css"> - <link rel="icon" href="/favicon.ico"> - <link rel="icon" type="image/svg+xml" href="/favicon.svg"></link> + <link rel="icon" href="/favicon.ico"> + <link rel="icon" type="image/svg+xml" href="/favicon.svg"> </head> <body> - <dialog id="dialog"> - <p>Welcome to Retrowave Player</p> - <form method="dialog"> - <button id="initButton">OK</button> - </form> - </dialog> + <div class="modal" id="intro-modal"> + <div class="modal-bg modal-exit"></div> + <div class="modal-container"> + <h3 class="text-center">Welcome to Retrowave Player</h3> + <p class="mt-5">Here are the controls:</p> + <h4 class="mt-5">Play/Pause - Space/Click/Touch</h4> + <p class="mt-5">(You can download the music history of your current browser by clicking the history link on the player)</p> + <button class="modal-close modal-exit" id="initButton">X</button> + </div> + </div> <div id="app"> <div class="music-player" style="background-image: url("http://retrowave.ru/artwork/ffd65c85c036971075677e76e6b250eef4c6ef2e.jpg"); background-position: 50% 50%; background-repeat: no-repeat;"> @@ -29,10 +33,11 @@ </div> <div class="gradient-overlay"></div> <div class="color-overlay"></div> - <div id="history">history</div> - <div id="info">info</div> + <div id="history" class="no-pause">history</div> + <div id="upload-info" class="no-pause" title="Upload a playlist (downloaded from history)">Upload</div> </div> </div> + <input id="file-upload" type="file" style="visibility:hidden" accept="application/json"/> <script src="player.js"></script> </body> |