fuzzyworld

hawk / files / public / styles / song.css

song.css

986 B · history · blame

1.currently-playing {
2 display: flex;
3 align-items: start;
4 padding: 0 1em;
5 border: 2px solid black;
6}
7
8.album-image {
9 width: 5rem;
10 height: 5rem;
11 border: 1px solid black;
12}
13
14.song-info {
15 display: flex;
16 flex-direction: column;
17 /* stack children vertically */
18 justify-content: space-between;
19 /* distribute space between song name and artist name */
20 width: 100%;
21}
22
23.found-song {
24 margin: .5em 0;
25 display: flex;
26 align-items: start;
27 padding: 0 1em;
28 border: 2px solid black;
29}
30
31.song-name {
32 font-weight: bold;
33}
34
35.song-album {
36 /* italics */
37 font-style: italic;
38}
39
40.song-artist {}
41
42.material-symbols-outlined {
43 margin: .25em;
44}
45
46.song-progressbar {
47 height: 1rem;
48 border-radius: 2rem;
49 -webkit-appearance: none;
50 -moz-appearance: none;
51 appearance: none;
52 width: 100%;
53}
54
55.song-duration {
56 display: flex;
57 justify-content: space-between;
58}
59
60.song-duration>span {
61 margin: 0 .5em;
62}