Skip to content

Commit 714795d

Browse files
ThatSINEWAVEThatSINEWAVE
committed
Update styles.css
1 parent 22c8646 commit 714795d

File tree

1 file changed

+121
-122
lines changed

1 file changed

+121
-122
lines changed

‎styles.css

Lines changed: 121 additions & 122 deletions
Original file line numberDiff line numberDiff line change
@@ -1,200 +1,199 @@
11
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600&display=swap');
22

33
* {
4-
margin: 0;
5-
padding: 0;
6-
box-sizing: border-box;
4+
margin: 0;
5+
padding: 0;
6+
box-sizing: border-box;
77
}
88

99
body {
10-
font-family: Arial, sans-serif;
11-
line-height: 1.6;
12-
background-image: url('images/background.png');
13-
background-size: cover;
14-
background-repeat: no-repeat;
15-
background-position: center;
16-
background-attachment: fixed;
17-
min-height: 100vh;
18-
display: flex;
19-
flex-direction: column;
20-
color: #ddd;
10+
font-family: Arial, sans-serif;
11+
line-height: 1.6;
12+
background-image: url('images/background.png');
13+
background-size: cover;
14+
background-repeat: no-repeat;
15+
background-position: center;
16+
background-attachment: fixed;
17+
min-height: 100vh;
18+
display: flex;
19+
flex-direction: column;
20+
color: #ddd;
2121
}
2222

2323
header {
24-
background-color: rgba(30, 31, 34, 0.8);
25-
color: #fff;
26-
padding: 1rem;
27-
display: flex;
28-
justify-content: space-between;
29-
align-items: center;
30-
position: sticky;
31-
box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
32-
top: 0;
33-
z-index: 1;
34-
backdrop-filter: blur(10px);
35-
-webkit-backdrop-filter: blur(10px);
24+
background-color: rgba(30, 31, 34, 0.8);
25+
color: #fff;
26+
padding: 1rem;
27+
display: flex;
28+
justify-content: space-between;
29+
align-items: center;
30+
position: sticky;
31+
box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
32+
top: 0;
33+
z-index: 1;
34+
backdrop-filter: blur(10px);
35+
-webkit-backdrop-filter: blur(10px);
3636
}
3737

3838
.header-buttons {
39-
display: flex;
40-
gap: 10px;
39+
display: flex;
40+
gap: 10px;
4141
}
4242

4343
.header-buttons a {
44-
background-color: #950101;
45-
color: #fff;
46-
display: flex;
47-
align-items: center;
48-
gap: 5px;
49-
padding: 8px 12px;
50-
border-radius: 5px;
51-
font-weight: 600;
52-
cursor: pointer;
53-
transition: background-color 0.3s ease;
54-
text-decoration: none;
44+
background-color: #950101;
45+
color: #fff;
46+
display: flex;
47+
align-items: center;
48+
gap: 5px;
49+
padding: 8px 12px;
50+
border-radius: 5px;
51+
font-weight: 600;
52+
cursor: pointer;
53+
transition: background-color 0.3s ease;
54+
text-decoration: none;
5555
}
5656

5757
.header-buttons a:hover {
58-
background-color: #620000;
58+
background-color: #620000;
5959
}
6060

6161
main {
62-
flex: 1;
63-
display: flex;
64-
justify-content: center;
65-
align-items: center;
62+
flex: 1;
63+
display: flex;
64+
justify-content: center;
65+
align-items: center;
6666
}
6767

6868
.container {
69-
background-color: rgba(30, 31, 34, 0.9);
70-
padding: 2rem;
71-
border-radius: 10px;
72-
box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
73-
max-width: 500px;
74-
width: 100%;
75-
text-align: center;
76-
backdrop-filter: blur(10px);
77-
-webkit-backdrop-filter: blur(10px);
69+
background-color: rgba(30, 31, 34, 0.9);
70+
padding: 2rem;
71+
border-radius: 10px;
72+
box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
73+
max-width: 500px;
74+
width: 100%;
75+
text-align: center;
76+
backdrop-filter: blur(10px);
77+
-webkit-backdrop-filter: blur(10px);
7878
}
7979

8080
label {
81-
display: inline-block;
82-
margin-bottom: 0.5rem;
83-
font-weight: bold;
84-
color: #ddd;
81+
display: inline-block;
82+
margin-bottom: 0.5rem;
83+
font-weight: bold;
84+
color: #ddd;
8585
}
8686

8787
input[type="number"] {
88-
padding: 0.5rem;
89-
border: 1px solid #ccc;
90-
background-color: #3c3c3c;
91-
border-radius: 3px;
92-
margin-left: 0.5rem;
93-
margin-bottom: 1rem;
94-
border: none;
95-
color: #ddd;
88+
padding: 0.5rem;
89+
border: 1px solid #ccc;
90+
background-color: #3c3c3c;
91+
border-radius: 3px;
92+
margin-left: 0.5rem;
93+
margin-bottom: 1rem;
94+
border: none;
95+
color: #ddd;
9696
}
9797

9898
input[type="checkbox"] {
99-
margin-right: 0.5rem;
100-
vertical-align: middle;
101-
accent-color: #950101;
99+
margin-right: 0.5rem;
100+
vertical-align: middle;
101+
accent-color: #950101;
102102
}
103103

104104
.input-group {
105-
display: flex;
106-
align-items: center;
107-
margin-bottom: 10px;
105+
display: flex;
106+
align-items: center;
107+
margin-bottom: 10px;
108108
}
109109

110110
.input-group label {
111-
margin-right: 10px;
112-
flex: 0 0 auto;
111+
margin-right: 10px;
112+
flex: 0 0 auto;
113113
}
114114

115115
.input-group input {
116-
flex: 1;
116+
flex: 1;
117117
}
118118

119119
button {
120-
background-color: #950101;
121-
color: #fff;
122-
border: none;
123-
padding: 0.5rem 1rem;
124-
border-radius: 3px;
125-
cursor: pointer;
126-
margin: 0.5rem 0;
127-
transition: background-color 0.3s ease;
120+
background-color: #950101;
121+
color: #fff;
122+
border: none;
123+
padding: 0.5rem 1rem;
124+
border-radius: 3px;
125+
cursor: pointer;
126+
margin: 0.5rem 0;
127+
transition: background-color 0.3s ease;
128128
}
129129

130130
button:hover {
131-
background-color: #620000;
131+
background-color: #620000;
132132
}
133133

134134
#output {
135-
margin-top: 1rem;
136-
text-align: center;
135+
margin-top: 1rem;
136+
text-align: center;
137137
}
138138

139139
#output textarea {
140-
width: 100%;
141-
height: 150px;
142-
padding: 0.5rem;
143-
font-size: 1rem;
144-
border: none;
145-
border-radius: 5px;
146-
background-color: rgba(255, 255, 255, 0.1);
147-
color: #ddd;
148-
resize: none;
149-
backdrop-filter: blur(10px);
150-
-webkit-backdrop-filter: blur(10px);
151-
box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
140+
width: 100%;
141+
height: 150px;
142+
padding: 0.5rem;
143+
font-size: 1rem;
144+
border: none;
145+
border-radius: 5px;
146+
background-color: rgba(255, 255, 255, 0.1);
147+
color: #ddd;
148+
resize: none;
149+
backdrop-filter: blur(10px);
150+
-webkit-backdrop-filter: blur(10px);
151+
box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
152152
}
153153

154154
#output textarea:focus {
155-
outline: none;
156-
box-shadow: 0 0 10px rgba(149, 1, 1, 0.5);
155+
outline: none;
156+
box-shadow: 0 0 10px rgba(149, 1, 1, 0.5);
157157
}
158158

159159
#output p {
160-
margin-bottom: 0.5rem;
161-
color: #ddd;
162-
font-weight: bold;
160+
margin-bottom: 0.5rem;
161+
color: #ddd;
162+
font-weight: bold;
163163
}
164164

165165
#output textarea::-webkit-scrollbar {
166-
width: 8px;
166+
width: 8px;
167167
}
168168

169169
#output textarea::-webkit-scrollbar-track {
170-
background-color: rgba(0, 0, 0, 0.1);
171-
border-radius: 4px;
170+
background-color: rgba(0, 0, 0, 0.1);
171+
border-radius: 4px;
172172
}
173173

174174
#output textarea::-webkit-scrollbar-thumb {
175-
background-color: rgba(149, 1, 1, 0.5);
176-
border-radius: 4px;
175+
background-color: rgba(149, 1, 1, 0.5);
176+
border-radius: 4px;
177177
}
178178

179179
#output textarea::-webkit-scrollbar-thumb:hover {
180-
background-color: rgba(149, 1, 1, 0.7);
180+
background-color: rgba(149, 1, 1, 0.7);
181181
}
182182

183183
footer {
184-
background-color: rgba(30, 31, 34, 0.8);
185-
color: #fff;
186-
padding: 1rem;
187-
text-align: center;
188-
position: sticky;
189-
bottom: 0;
190-
backdrop-filter: blur(10px);
191-
box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
192-
-webkit-backdrop-filter: blur(10px);
184+
background-color: rgba(30, 31, 34, 0.8);
185+
color: #fff;
186+
padding: 1rem;
187+
text-align: center;
188+
position: sticky;
189+
bottom: 0;
190+
backdrop-filter: blur(10px);
191+
box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
192+
-webkit-backdrop-filter: blur(10px);
193193
}
194194

195195
.footer-content {
196-
display: center;
197-
justify-content: space-between;
198-
align-items: center;
199-
}
200-
196+
display: center;
197+
justify-content: space-between;
198+
align-items: center;
199+
}

0 commit comments

Comments
 (0)