File tree 1 file changed +86
-0
lines changed
1 file changed +86
-0
lines changed Original file line number Diff line number Diff line change
1
+ /* styles.css */
2
+ body {
3
+ font-family : Arial, sans-serif;
4
+ background-color : # 1e1e2f ;
5
+ color : # fff ;
6
+ display : flex;
7
+ justify-content : center;
8
+ align-items : center;
9
+ height : 100vh ;
10
+ margin : 0 ;
11
+ }
12
+
13
+ .music-player {
14
+ text-align : center;
15
+ background : # 29293d ;
16
+ padding : 20px ;
17
+ border-radius : 10px ;
18
+ box-shadow : 0 4px 10px rgba (0 , 0 , 0 , 0.5 );
19
+ width : 300px ;
20
+ }
21
+
22
+ .player h2 {
23
+ font-size : 18px ;
24
+ margin-bottom : 20px ;
25
+ }
26
+
27
+ .controls {
28
+ display : flex;
29
+ justify-content : center;
30
+ gap : 15px ;
31
+ margin-bottom : 15px ;
32
+ }
33
+
34
+ .controls button {
35
+ background : # 3b3b57 ;
36
+ color : white;
37
+ border : none;
38
+ padding : 10px 15px ;
39
+ border-radius : 5px ;
40
+ cursor : pointer;
41
+ font-size : 16px ;
42
+ }
43
+
44
+ .add-song button {
45
+ background : # 3b3b57 ;
46
+ color : white;
47
+ border : none;
48
+ padding : 10px ;
49
+ margin-top : 10px ;
50
+ border-radius : 5px ;
51
+ cursor : pointer;
52
+ }
53
+
54
+ .controls button : hover {
55
+ background : # 50506b ;
56
+ }
57
+
58
+ # volume {
59
+ width : 100% ;
60
+ }
61
+
62
+ .song-list ul {
63
+ list-style : none;
64
+ padding : 0 ;
65
+ margin : 0 ;
66
+ }
67
+
68
+ .song-list li {
69
+ background : # 3b3b57 ;
70
+ padding : 10px ;
71
+ margin : 5px 0 ;
72
+ border-radius : 5px ;
73
+ cursor : pointer;
74
+ }
75
+
76
+ .song-list li : hover {
77
+ background : # 50506b ;
78
+ }
79
+
80
+ .add-song input {
81
+ margin-top : 10px ;
82
+ }
83
+
84
+ .add-song button : hover {
85
+ background : # 50506b ;
86
+ }
You can’t perform that action at this time.
0 commit comments