1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
|
/*
Copyright (C) 2024-2026 memdmp
This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by Affero, Inc., at version 1.
This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the Affero General Public License for more details.
You should have received a copy of the Affero General Public License along with this program. If not, see <https://spdx.org/licenses/AGPL-1.0-only>.
*/
@import 'tailwindcss';
@theme {
--font-sans:
InterVariable, Inter, "Noto Sans",
ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
"Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
--font-bios:
'Ac437 IBM EGA 8x14', 'Hack', 'Courier New', 'Courier', 'monospace';
--font-grub:
'Px437 DOS/V re. JPN12', 'Ac437 IBM EGA 8x14', 'Hack', 'Courier New',
'Courier', 'monospace';
--font-mono:
'PxPlus IBM EGA 8x14', 'Hack', 'Courier New', 'Courier', 'monospace';
--font-genericmono:
'JetBrainsMono NF', 'Jetbrains Mono', 'JetBrains Mono', monospace;
}
@utility internal-header-active {
&:not(:is(p)) {
@apply text-white/95;
}
&::after {
@apply -ml-3 bg-gray-200/50;
}
}
#postmd {
@apply font-sans;
h1 {
@apply first:font-bios first:text-5xl text-4xl mb-1.5 mt-2;
}
h2 {
@apply my-1.5 text-2xl;
}
h3 {
@apply my-1 text-xl;
}
h4 {
@apply my-1 text-lg;
}
h1,h2,h3,h4,h5,h6,p {
@apply relative text-white/90 hover:text-white;
&::after {
content: "";
@apply absolute top-[20%] left-0 h-[60%] w-0.5 -ml-4 rounded-full transition-all;
}
&:is(p)::after {
@apply bg-gray-200/5;
}
&:not(:is(p))::after {
@apply bg-gray-200/15;
}
&:hover::after {
@apply -ml-3 bg-gray-200/75;
}
}
h1 {
&:not(:hover):has(~*:hover):not(:has(~h1~*:hover)) {
@apply internal-header-active;
}
}
h2 {
&:not(:hover):has(~*:hover):not(:has(~h1~*:hover,~h2~*:hover)) {
@apply internal-header-active;
}
}
h3 {
&:not(:hover):has(~*:hover):not(:has(~h1~*:hover,~h2~*:hover,~h3~*:hover)) {
@apply internal-header-active;
}
}
h4 {
&:not(:hover):has(~*:hover):not(:has(~h1~*:hover,~h2~*:hover,~h3~*:hover,~h4~*:hover)) {
@apply internal-header-active;
}
}
h5,h6,p {
&:not(:hover):has(~*:hover):not(:has(~h1~*:hover,~h2~*:hover,~h3~*:hover,~h4~*:hover,~h5~*:hover)) {
@apply internal-header-active;
}
}
p::after {
@apply h-[90%] top-[5%];
}
p {
@apply my-1;
}
}
/*
The default border color has changed to `currentColor` in Tailwind CSS v4,
so we've added these compatibility styles to make sure everything still
looks the same as it did with Tailwind CSS v3.
If we ever want to remove these styles, we need to add an explicit border
color utility to any element that depends on these defaults.
*/
@layer base {
*,
::after,
::before,
::backdrop,
::file-selector-button {
border-color: var(--color-gray-200, currentColor);
}
}
|
