lightweight, simple, classless CSS framework inspired by new.css
devcss.devins.page
framework
lightweight
css
classless
stylesheet
feat: improvements to header
+15
-18
+15
-18
dev.css
+15
-18
dev.css
···
238
238
margin-top: 0rem;
239
239
margin-bottom: 0rem;
240
240
}
241
+
242
+
header > *:first-child {
243
+
margin-top: 0;
244
+
padding-top: 0;
245
+
}
246
+
247
+
header > *:last-child {
248
+
margin-bottom: 0;
249
+
padding-bottom: 0;
250
+
}
241
251
}
242
252
243
253
@media (min-width: calc((750px + 4rem) + ((250px + 2rem)*2))) {
244
254
header {
245
-
padding: 2rem 2rem;
255
+
padding: 2rem;
246
256
padding-right: 0;
247
257
margin: 0;
248
258
position: fixed;
249
259
top: 0;
250
260
left: calc(50% - ((750px + 4rem) / 2) - (250px + 2rem));
251
261
width: 250px;
262
+
height: 100%;
252
263
}
253
264
254
265
header nav {
255
266
display: flex;
256
267
flex-direction: column;
268
+
border-top: 1px solid var(--dc-bg-3);
269
+
padding-top: 1rem;
270
+
margin-top: 0.5rem;
257
271
}
258
272
259
273
header nav a::before {
260
274
content: "• ";
261
275
color: var(--dc-tx-2);
262
276
}
263
-
264
-
header * {
265
-
padding-top: 0.25rem;
266
-
padding-bottom: 0.25rem;
267
-
margin-top: 0rem;
268
-
margin-bottom: 0rem;
269
-
}
270
277
}
271
278
272
279
header h1,
···
276
283
header h5,
277
284
header h6 {
278
285
border-bottom: 0;
279
-
}
280
-
281
-
header > *:first-child {
282
-
margin-top: 0;
283
-
padding-top: 0;
284
-
}
285
-
286
-
header > *:last-child {
287
-
margin-bottom: 0;
288
-
padding-bottom: 0;
289
286
}
290
287
291
288
a button,