Skip to content

Commit fc9c8e4

Browse files
committed
Din And raat
1 parent 09c413e commit fc9c8e4

File tree

24 files changed

+485
-188
lines changed

24 files changed

+485
-188
lines changed

assets/css/home.css

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
body {
2-
background-color: #e5e9f4;
2+
background-color: var(--bg-primary);
33
padding: 2rem;
44
overflow-x: hidden;
55
font-family: Inter, system-ui, -apple-system, sans-serif;
6-
color: #1f2937
6+
color: var(--text-primary)
77
}
88

99
.page-header {
@@ -24,13 +24,13 @@ body {
2424
.page-header h3 {
2525
font-size: 2rem;
2626
font-weight: 500;
27-
color: #1f2937
27+
color: var(--text-primary)
2828
}
2929

3030
.page-header h4 {
3131
font-size: 1rem;
3232
font-weight: 400;
33-
color: #4b5563;
33+
color: var(--text-tertiary);
3434
margin-top: .25rem
3535
}
3636

@@ -44,7 +44,7 @@ body {
4444
font-family: Inter, sans-serif;
4545
font-size: 1.1rem;
4646
font-weight: 600;
47-
color: #374151;
47+
color: var(--text-secondary);
4848
text-align: left;
4949
margin-bottom: 2rem;
5050
text-transform: uppercase;
@@ -67,25 +67,25 @@ a.neumorphic-button {
6767
aspect-ratio: 1/1;
6868
border: none;
6969
border-radius: .8rem;
70-
color: #334155;
71-
background: #e5e9f4;
72-
--shadow-light: hsl(0 0% 100% / .6);
73-
--shadow-dark: hsl(225 15% 70% / .9);
70+
color: var(--button-text);
71+
background: var(--button-bg);
72+
--shadow-light: var(--shadow-light-alt);
73+
--shadow-dark: var(--shadow-dark-alt);
7474
box-shadow: -.3rem -.3rem .6rem var(--shadow-light), .3rem .3rem .6rem var(--shadow-dark);
7575
transition: transform .2s, box-shadow .2s;
7676
outline: 0
7777
}
7878

7979
a.neumorphic-button:focus-visible,
8080
a.neumorphic-button:hover {
81-
color: #1d4ed8;
81+
color: var(--button-text-hover);
8282
transform: translateY(-4px);
8383
box-shadow: -.4rem -.4rem .8rem var(--shadow-light), .4rem .4rem .8rem var(--shadow-dark), inset 0 0 0 transparent, inset 0 0 0 transparent
8484
}
8585

8686
a.neumorphic-button.active,
8787
a.neumorphic-button:active {
88-
color: #1d4ed8;
88+
color: var(--button-text-hover);
8989
transform: translateY(0);
9090
box-shadow: inset .2rem .2rem .4rem var(--shadow-dark), inset -.2rem -.2rem .4rem var(--shadow-light)
9191
}

layouts/404.html

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@
2121
<meta name="theme-color" content="#28966a">
2222
<title>Code fried</title>
2323
<link rel="stylesheet" href="/css/internal.css">
24+
<link rel="stylesheet" href="/css/theme.css">
2425
<style>
2526
* {
2627
transition: all 0.6s;
@@ -31,9 +32,9 @@
3132
}
3233

3334
body {
34-
background-color: #e5e9f4;
35+
background-color: var(--bg-primary);
3536
font-family: 'Courier New', Courier, monospace;
36-
color: #000000;
37+
color: var(--text-primary);
3738
margin: 0;
3839
}
3940

@@ -58,7 +59,7 @@
5859

5960
@keyframes type {
6061
from {
61-
box-shadow: inset -3px 0px 0px #000000;
62+
box-shadow: inset -3px 0px 0px var(--text-primary);
6263
}
6364

6465
to {
@@ -75,5 +76,6 @@ <h4>Nothing to COOK🔥here! </h4>
7576
</div>
7677
</div>
7778
{{ partial "footer.html" . }}
79+
<script src="/js/theme.js"></script>
7880
</body>
7981
</html>

layouts/_default/single.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,5 +18,6 @@ <h1>{{ .Title | default "CodeFryDev" }}</h1>
1818
{{ .Content }}
1919
</main>
2020
{{ partial "footer.html" . }}
21+
<script src="/js/theme.js"></script>
2122
</body>
2223
</html>

layouts/about/about.html

Lines changed: 43 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -23,32 +23,32 @@
2323
.about-header h1 {
2424
font-size: 3rem;
2525
font-weight: 700;
26-
color: #1f2937;
26+
color: var(--text-primary);
2727
margin: 1rem 0 0.75rem 0;
2828
letter-spacing: -0.5px;
2929
}
3030

3131
.about-header .tagline {
3232
font-size: 1.25rem;
33-
color: #6b7280;
33+
color: var(--text-tertiary);
3434
margin: 0;
3535
font-weight: 400;
3636
}
3737

3838
.about-intro {
39-
background: #e5e9f4;
39+
background: var(--bg-primary);
4040
padding: 3rem;
4141
border-radius: 24px;
4242
margin-bottom: 4rem;
4343
box-shadow:
44-
inset 8px 8px 16px #d1d5db,
45-
inset -8px -8px 16px #ffffff;
44+
inset 8px 8px 16px var(--shadow-dark),
45+
inset -8px -8px 16px var(--shadow-light);
4646
}
4747

4848
.about-intro p {
4949
font-size: 1.15rem;
5050
line-height: 1.9;
51-
color: #374151;
51+
color: var(--text-secondary);
5252
margin: 0;
5353
text-align: center;
5454
max-width: 900px;
@@ -63,14 +63,14 @@
6363
}
6464

6565
.stat-card {
66-
background: #e5e9f4;
66+
background: var(--bg-primary);
6767
padding: 2.5rem 2rem;
6868
border-radius: 20px;
6969
text-align: center;
7070
transition: all 0.3s ease;
7171
box-shadow:
72-
8px 8px 16px #d1d5db,
73-
-8px -8px 16px #ffffff;
72+
8px 8px 16px var(--shadow-dark),
73+
-8px -8px 16px var(--shadow-light);
7474
position: relative;
7575
overflow: hidden;
7676
}
@@ -82,8 +82,8 @@
8282
left: -50%;
8383
width: 200%;
8484
height: 200%;
85-
background: radial-gradient(circle, rgba(102, 126, 234, 0.1) 0%, transparent 70%);
86-
opacity: 0;
85+
background: radial-gradient(circle, var(--accent-color) 0%, transparent 70%);
86+
opacity: 0.1;
8787
transition: opacity 0.3s ease;
8888
}
8989

@@ -94,14 +94,14 @@
9494
.stat-card:hover {
9595
transform: translateY(-4px) scale(1.02);
9696
box-shadow:
97-
12px 12px 24px #d1d5db,
98-
-12px -12px 24px #ffffff;
97+
12px 12px 24px var(--shadow-dark),
98+
-12px -12px 24px var(--shadow-light);
9999
}
100100

101101
.stat-number {
102102
font-size: 3rem;
103103
font-weight: 800;
104-
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
104+
background: linear-gradient(135deg, var(--accent-color) 0%, var(--accent-hover) 100%);
105105
-webkit-background-clip: text;
106106
-webkit-text-fill-color: transparent;
107107
background-clip: text;
@@ -111,7 +111,7 @@
111111

112112
.stat-label {
113113
font-size: 0.95rem;
114-
color: #6b7280;
114+
color: var(--text-tertiary);
115115
text-transform: uppercase;
116116
letter-spacing: 1px;
117117
font-weight: 600;
@@ -124,7 +124,7 @@
124124
.section-title {
125125
font-size: 1.75rem;
126126
font-weight: 700;
127-
color: #1f2937;
127+
color: var(--text-primary);
128128
margin-bottom: 2.5rem;
129129
text-align: center;
130130
text-transform: uppercase;
@@ -141,7 +141,7 @@
141141
transform: translateX(-50%);
142142
width: 60px;
143143
height: 3px;
144-
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
144+
background: linear-gradient(135deg, var(--accent-color) 0%, var(--accent-hover) 100%);
145145
border-radius: 2px;
146146
}
147147

@@ -152,20 +152,20 @@
152152
}
153153

154154
.about-card {
155-
background: #e5e9f4;
155+
background: var(--bg-primary);
156156
padding: 2.5rem;
157157
border-radius: 24px;
158158
cursor: pointer;
159159
transition: all 0.3s ease;
160160
text-decoration: none;
161-
color: #1f2937;
161+
color: var(--text-primary);
162162
display: flex;
163163
flex-direction: column;
164164
position: relative;
165165
overflow: hidden;
166166
box-shadow:
167-
8px 8px 16px #d1d5db,
168-
-8px -8px 16px #ffffff;
167+
8px 8px 16px var(--shadow-dark),
168+
-8px -8px 16px var(--shadow-light);
169169
}
170170

171171
.about-card::before {
@@ -175,7 +175,7 @@
175175
left: 0;
176176
right: 0;
177177
height: 4px;
178-
background: linear-gradient(90deg, var(--accent-color, #667eea), var(--accent-color, #764ba2));
178+
background: linear-gradient(90deg, var(--accent-color), var(--accent-hover));
179179
transform: scaleX(0);
180180
transition: transform 0.3s ease;
181181
}
@@ -187,40 +187,40 @@
187187
.about-card:hover {
188188
transform: translateY(-6px);
189189
box-shadow:
190-
16px 16px 32px #d1d5db,
191-
-16px -16px 32px #ffffff;
190+
16px 16px 32px var(--shadow-dark),
191+
-16px -16px 32px var(--shadow-light);
192192
}
193193

194194
.about-card:active {
195195
transform: translateY(-2px);
196196
box-shadow:
197-
inset 4px 4px 8px #d1d5db,
198-
inset -4px -4px 8px #ffffff;
197+
inset 4px 4px 8px var(--shadow-dark),
198+
inset -4px -4px 8px var(--shadow-light);
199199
}
200200

201201
.card-icon {
202202
width: 64px;
203203
height: 64px;
204-
background: #fff;
204+
background: var(--bg-tertiary);
205205
border-radius: 16px;
206206
display: flex;
207207
align-items: center;
208208
justify-content: center;
209209
margin: 0 auto 1.75rem auto;
210210
box-shadow:
211-
4px 4px 8px #d1d5db,
212-
-4px -4px 8px #ffffff;
211+
4px 4px 8px var(--shadow-dark),
212+
-4px -4px 8px var(--shadow-light);
213213
font-size: 1.75rem;
214-
color: var(--accent-color, #667eea);
214+
color: var(--accent-color);
215215
transition: all 0.3s ease;
216216
flex-shrink: 0;
217217
}
218218

219219
.about-card:hover .card-icon {
220220
transform: scale(1.1) rotate(5deg);
221221
box-shadow:
222-
6px 6px 12px #d1d5db,
223-
-6px -6px 12px #ffffff;
222+
6px 6px 12px var(--shadow-dark),
223+
-6px -6px 12px var(--shadow-light);
224224
}
225225

226226
.about-card {
@@ -231,14 +231,14 @@
231231
.card-title {
232232
font-size: 1.35rem;
233233
font-weight: 700;
234-
color: #1f2937;
234+
color: var(--text-primary);
235235
margin: 0 0 1rem 0;
236236
line-height: 1.3;
237237
}
238238

239239
.card-content {
240240
font-size: 1rem;
241-
color: #6b7280;
241+
color: var(--text-tertiary);
242242
line-height: 1.7;
243243
margin: 0;
244244
}
@@ -254,21 +254,21 @@
254254
}
255255

256256
.feature-item {
257-
background: #e5e9f4;
257+
background: var(--bg-primary);
258258
padding: 2.5rem 2rem;
259259
border-radius: 20px;
260260
text-align: center;
261261
transition: all 0.3s ease;
262262
box-shadow:
263-
8px 8px 16px #d1d5db,
264-
-8px -8px 16px #ffffff;
263+
8px 8px 16px var(--shadow-dark),
264+
-8px -8px 16px var(--shadow-light);
265265
}
266266

267267
.feature-item:hover {
268268
transform: translateY(-4px);
269269
box-shadow:
270-
12px 12px 24px #d1d5db,
271-
-12px -12px 24px #ffffff;
270+
12px 12px 24px var(--shadow-dark),
271+
-12px -12px 24px var(--shadow-light);
272272
}
273273

274274
.feature-icon {
@@ -284,13 +284,13 @@
284284
.feature-title {
285285
font-size: 1.1rem;
286286
font-weight: 600;
287-
color: #1f2937;
287+
color: var(--text-primary);
288288
margin: 0 0 0.5rem 0;
289289
}
290290

291291
.feature-desc {
292292
font-size: 0.95rem;
293-
color: #6b7280;
293+
color: var(--text-tertiary);
294294
line-height: 1.6;
295295
margin: 0;
296296
}
@@ -341,7 +341,7 @@
341341
</style>
342342
{{ partial "aboutseo.html" . }}
343343
</head>
344-
<body style="background-color: #e5e9f4;">
344+
<body>
345345
{{ partial "skip-link.html" . }}
346346
<main id="main-content" role="main">
347347
<div class="MainButtonParent">
@@ -459,5 +459,6 @@ <h3 class="card-title">{{ .title }}</h3>
459459
</main>
460460
{{ partial "footer.html" . }}
461461
<script src="/js/feedback.js"></script>
462+
<script src="/js/theme.js"></script>
462463
</body>
463464
</html>

0 commit comments

Comments
 (0)