tiny, simple, classless CSS framework inspired by new.css
devcss.devins.page
devins.page
framework
lightweight
css
classless
stylesheet
chore: prettier
+5
-1
demo.html
+5
-1
demo.html
···
17
17
href="https://cdn.jsdelivr.net/npm/@intergrav/fonts@1/serve/geist-mono.min.css"
18
18
/>
19
19
</head>
20
+
20
21
<body>
21
22
<header>
22
23
<h1>dev.css Demo</h1>
23
24
<nav>
24
-
<a>Home</a> / <a>About</a> / <a>Portfolio</a> / <a>Awesome</a> /
25
+
<a>Home</a>
26
+
<a>About</a>
27
+
<a>Portfolio</a>
28
+
<a>Awesome</a>
25
29
<a>Sauce</a>
26
30
</nav>
27
31
</header>
+8
-8
dev.css
+8
-8
dev.css
···
19
19
--dc-d-tx-1: #ededed;
20
20
--dc-d-tx-2: #a1a1a1;
21
21
--dc-d-bg-1: #000;
22
-
--dc-d-bg-2: #0A0A0A;
23
-
--dc-d-bg-3: #2E2E2E;
22
+
--dc-d-bg-2: #0a0a0a;
23
+
--dc-d-bg-3: #2e2e2e;
24
24
--dc-d-lk-1: #52a8ff;
25
25
--dc-d-lkb-1: #0072f5;
26
26
--dc-d-lkb-2: #0062d1;
···
190
190
padding-right: calc(50vw - 50%);
191
191
}
192
192
193
-
header nav a+a::before {
193
+
header nav a + a::before {
194
194
content: "• ";
195
195
color: var(--dc-tx-2);
196
196
}
···
274
274
border-bottom: 0;
275
275
}
276
276
277
-
header>*:first-child {
277
+
header > *:first-child {
278
278
margin-top: 0;
279
279
padding-top: 0;
280
280
}
281
281
282
-
header>*:last-child {
282
+
header > *:last-child {
283
283
margin-bottom: 0;
284
284
padding-bottom: 0;
285
285
}
···
392
392
margin-bottom: 8px;
393
393
}
394
394
395
-
details[open]>*:first-child {
395
+
details[open] > *:first-child {
396
396
margin-top: 0;
397
397
padding-top: 0;
398
398
}
399
399
400
-
details[open]>*:last-child {
400
+
details[open] > *:last-child {
401
401
margin-bottom: 0;
402
402
padding-bottom: 0;
403
403
}
···
494
494
495
495
img {
496
496
max-width: 100%;
497
-
}
497
+
}