this repo has no description
seth.computer
1@import "normalize.css";
2@import "rose-pine-media.css";
3
4@font-face {
5 font-family: "Lato";
6 src: local("Lato"), url("/fonts/Lato-Regular.ttf");
7 font-weight: regular;
8}
9
10@font-face {
11 font-family: "Lato";
12 src: local("Lato"), url("/fonts/Lato-Bold.ttf");
13 font-weight: bold;
14}
15
16@font-face {
17 font-family: "Source Serif Pro";
18 src: local("Source Serif Pro"), url("/fonts/SourceSerifPro-Regular.ttf");
19 font-weight: normal;
20 font-style: normal;
21}
22
23@font-face {
24 font-family: "Source Serif Pro";
25 src: local("Source Serif Pro"), url("/fonts/SourceSerifPro-Bold.ttf");
26 font-weight: bold;
27 font-style: normal;
28}
29
30@font-face {
31 font-family: "Source Serif Pro";
32 src: local("Source Serif Pro"), url("/fonts/SourceSerifPro-Italic.ttf");
33 font-weight: normal;
34 font-style: italic;
35}
36
37@font-face {
38 font-family: "Source Serif Pro";
39 src: local("Source Serif Pro"), url("/fonts/SourceSerifPro-BoldItalic.ttf");
40 font-weight: bold;
41 font-style: italic;
42}
43
44:root {
45 --color-bg: var(--rp-base);
46 --color-fg: var(--rp-text);
47 --color-link: var(--rp-iris);
48 --color-link-hover: var(--rp-rose);
49 --color-heading: var(--rp-text);
50 --color-border: var(--rp-muted);
51 --color-muted: var(--rp-subtle);
52 --color-highlight: var(--rp-highlight-low);
53}
54
55ul.post-list {
56 padding-left: 0;
57 list-style: none;
58}
59
60ul.post-list li {
61 margin-bottom: 6px;
62}
63
64ul.post-list li a {
65 text-decoration: none;
66}
67
68ul.post-list li em {
69 color: var(--color-border);
70}
71
72ul.post-list li .subtext::before {
73 content: " — ";
74 font-size: 0.8em;
75 color: var(--color-border);
76}
77
78@media (max-width: 600px) {
79 ul.post-list li .subtext::before {
80 content: "";
81 }
82
83 ul.post-list li .subtext {
84 display: block;
85 }
86}
87
88body {
89 background-color: var(--color-bg);
90 color: var(--color-fg);
91 font-family: Lato, "Source Sans Pro", sans;
92 font-size: 18px;
93 line-height: 1.5em;
94 margin: 0px auto 0px auto;
95 padding: 0 15px;
96 max-width: 700px;
97}
98
99#content article .body {
100 font-family: "Source Serif Pro", sans;
101}
102
103a,
104a:visited {
105 color: var(--color-link);
106 text-decoration: none;
107}
108
109a:hover,
110a:focus {
111 color: var(--color-link-hover);
112}
113
114div#header {
115 border-bottom: 1px solid var(--color-border);
116 margin-bottom: 30px;
117 padding: 12px 0px 12px 0px;
118 display: flex;
119}
120
121div#logo,
122div#navigation {
123 flex-grow: 1;
124}
125
126div#logo a {
127 float: left;
128 font-size: 18px;
129 text-decoration: none;
130}
131
132div#header div#logo a,
133div#header div#logo a:visited {
134 color: var(--color-muted);
135}
136
137div#header a,
138div#header a:visited {
139 color: var(--color-link);
140}
141
142div#header a:active,
143div#header a:hover {
144 color: var(--color-link-hover);
145}
146
147div#header #navigation {
148 text-align: right;
149}
150
151div#header #navigation ul {
152 list-style: none;
153 margin: 0;
154}
155
156div#header #navigation ul li {
157 display: inline;
158}
159
160div#header #navigation a {
161 font-size: 16px;
162 margin-left: 12px;
163 text-decoration: none;
164 text-transform: lowercase;
165}
166
167#footer {
168 border-top: solid 1px var(--color-border);
169 color: var(--color-muted);
170 font-size: 12px;
171 margin-top: 30px;
172 padding: 12px 0px 12px 0px;
173}
174
175h1,
176h2,
177h3,
178h4,
179h5 {
180 font-family: Lato, sans;
181 font-weight: bold;
182 color: var(--color-heading);
183}
184
185h1 {
186 font-size: 32px;
187}
188
189h2 {
190 font-size: 24px;
191}
192
193div.info {
194 color: var(--color-muted);
195 font-size: 14px;
196 font-style: italic;
197}
198
199body pre {
200 font-size: 0.8em;
201 line-height: 1.5em;
202 background: var(--color-highlight);
203 overflow-x: scroll;
204 padding: 10px 15px;
205}
206
207blockquote {
208 border-left: 10px solid var(--color-border);
209 margin-left: 0;
210 padding-left: 30px;
211 color: var(--color-fg);
212 font-size: 1.1em;
213 line-height: 1.5em;
214}
215
216hr {
217 border: 0;
218 border-bottom: 1px solid var(--color-border);
219}
220
221section.header {
222 margin: 0;
223 font-size: 16px;
224 padding-bottom: 15px;
225 color: var(--color-fg);
226 border-bottom: solid 1px var(--color-muted);
227}
228
229.tag {
230 font-size: 0.8em;
231 display: inline-block;
232 padding-right: 5px;
233 color: var(--color-border);
234 white-space: nowrap;
235}
236
237.tag::before {
238 content: "#";
239 color: var(--color-muted);
240}
241
242.tag a:link,
243.tag a:visited,
244.tag a:active {
245 color: var(--color-muted);
246}
247
248.tag a:hover {
249 color: var(--color-link-hover);
250}
251
252code {
253 color: var(--color-fg);
254 font-size: 0.9em;
255 background: var(--color-highlight);
256 padding: 1px 4px;
257 border-radius: 5px;
258}
259
260a code {
261 text-decoration: underline;
262}
263
264pre code {
265 background-color: transparent;
266}