JS music player that resembles a sony walkman from 2008
doqmeat.com/notebook/F2U/preview/walkman
html-template
minor changes
+14
-4
+5
-2
index.html
+5
-2
index.html
···
67
67
68
68
<!-- credit and resources -->
69
69
<!-- you can remove this -->
70
-
<p><a href="https://github.com/doqmeat/js-walkman-mp3-player">github repo</a> for info. <a href="https://vgen.co/doqmeat/product/js-walkman-mp3-player/6c9efad3-53ae-462e-8b70-5cc67b933a05" target="_blank">vgen shop</a> for easy download.</p>
71
-
<p>built using sayantanm19's <a href="https://github.com/sayantanm19/js-music-player" target="_blank">js-music-player</a>, <a href="https://www.nerdfonts.com/" target="_blank">nerdfonts</a>, <a href="https://manos.malihu.gr/style-my-tooltips-jquery-plugin/" target="_blank">Style-my-tooltips jQuery plugin</a>.</p>
70
+
<div id="text">
71
+
<p>coded by <a href="https://doqmeat.com">doqmeat</a> / <a href="https://tangled.org/doqmeat.com/js-walkman-mp3-player">source code</a> for info / <a href="https://vgen.co/doqmeat/product/js-walkman-mp3-player/6c9efad3-53ae-462e-8b70-5cc67b933a05" target="_blank">download</a></p>
72
+
<p>credits: built using sayantanm19's <a href="https://github.com/sayantanm19/js-music-player" target="_blank">js-music-player</a>, <a href="https://www.nerdfonts.com/" target="_blank">nerdfonts</a>, <a href="https://manos.malihu.gr/style-my-tooltips-jquery-plugin/" target="_blank">Style-my-tooltips jQuery plugin</a>.</p>
73
+
</div>
72
74
75
+
<!-- javascript file source -->
73
76
<script src="main.js"></script>
74
77
</body>
75
78
+9
-2
style.css
+9
-2
style.css
···
3
3
box-sizing: border-box;
4
4
position: relative;
5
5
font-family: arial, nerdfont;
6
+
display: block;
6
7
padding-top: 1px;
7
8
background: rgb(232, 84, 84);
8
9
border-top: 1px;
9
10
border-right: 0px;
10
-
margin-left: 50px;
11
+
margin: 20px auto;
11
12
color: rgb(153, 57, 57);
12
13
font-size: 21px;
13
14
line-height: 31px;
···
334
335
rgb(239, 161, 161) 0%,
335
336
rgba(255, 227, 179, 1) 100%
336
337
);
337
-
margin: 50px;
338
+
max-width: 400px;
339
+
margin: auto;
338
340
height: 100vh;
339
341
font-size: 18px;
340
342
a {
341
343
color: rgb(68, 68, 186);
344
+
}
345
+
#text {
346
+
background: rgb(255, 255, 255);
347
+
border-radius: 10px;
348
+
padding: 10px;
342
349
}
343
350
}