Commit 10610af823778d691f4bb1a37154d5976c0c2ae9
Pre-calculate fractional rem sizes
It's easy enough to work backwards to these fractions.Grey Nicholson committed on 5/11/2022, 10:08:51 PM
Parent: d005ba78d21d97453f6120eac2c49aadbf312a2b
Files changed
static/style/tarazed.css | changed |
static/style/tarazed.css | |||
---|---|---|---|
@@ -169,10 +169,10 @@ | |||
169 | 169 … | } | |
170 | 170 … | .entry main footer section .tags li { | |
171 | 171 … | display: inline-block; | |
172 | 172 … | margin: 0; | |
173 | - margin-left: calc(12rem / 16); | ||
174 | - margin-right: calc(12rem / 16); | ||
173 … | + margin-left: 0.75rem; | ||
174 … | + margin-right: 0.75rem; | ||
175 | 175 … | } | |
176 | 176 … | ||
177 | 177 … | /* Elements */ | |
178 | 178 … | ||
@@ -196,21 +196,21 @@ | |||
196 | 196 … | :visited, | |
197 | 197 … | nav :link strong, | |
198 | 198 … | nav :visited strong { | |
199 | 199 … | text-decoration: underline; | |
200 | - text-decoration-thickness: max(1px, calc(1rem / 16)); | ||
200 … | + text-decoration-thickness: max(1px, 0.0625rem); | ||
201 | 201 … | } | |
202 | 202 … | ||
203 | 203 … | :link:hover, | |
204 | 204 … | :visited:hover, | |
205 | 205 … | nav :link:hover strong, | |
206 | 206 … | nav :visited:hover strong { | |
207 | - text-decoration-thickness: max(2px, calc(2rem / 16)); | ||
207 … | + text-decoration-thickness: max(2px, 0.125rem); | ||
208 | 208 … | } | |
209 | 209 … | ||
210 | 210 … | :link:focus, | |
211 | 211 … | :visited:focus { | |
212 | - outline: max(2px, calc(2rem / 16)) solid; | ||
212 … | + outline: max(2px, 0.125rem) solid; | ||
213 | 213 … | } | |
214 | 214 … | ||
215 | 215 … | :link:active, | |
216 | 216 … | :visited:active { | |
@@ -233,10 +233,10 @@ | |||
233 | 233 … | margin-bottom: 1.5rem; | |
234 | 234 … | max-width: min(30rem, 67.5vw); | |
235 | 235 … | margin-left: auto; | |
236 | 236 … | margin-right: auto; | |
237 | - border-left: max(2px, calc(2rem / 16)) solid var(--foreground-color); | ||
238 | - padding-left: calc(1rem - max(2px, calc(2rem / 16))); | ||
237 … | + border-left: max(2px, 0.125rem) solid var(--foreground-color); | ||
238 … | + padding-left: calc(1rem - max(2px, 0.125rem)); | ||
239 | 239 … | } | |
240 | 240 … | ||
241 | 241 … | figure { | |
242 | 242 … | margin-top: 1.5rem; | |
@@ -293,10 +293,10 @@ | |||
293 | 293 … | margin: 0; | |
294 | 294 … | border: 0; | |
295 | 295 … | padding: 0; | |
296 | 296 … | height: 1.5rem; | |
297 | - padding-top: calc(11rem / 16); | ||
298 | - padding-bottom: calc(11rem / 16); | ||
297 … | + padding-top: 0.6875rem; | ||
298 … | + padding-bottom: 0.6875rem; | ||
299 | 299 … | background-clip: content-box; | |
300 | 300 … | background-color: var(--primary-color); | |
301 | 301 … | margin-left: auto; | |
302 | 302 … | margin-right: auto; | |
@@ -317,14 +317,14 @@ | |||
317 | 317 … | margin-right: auto; | |
318 | 318 … | } | |
319 | 319 … | a img, | |
320 | 320 … | a object { | |
321 | - outline: max(1px, calc(1rem / 16)) solid; | ||
322 | - outline-offset: max(2px, calc(2rem / 16)); | ||
321 … | + outline: max(1px, 0.0625rem) solid; | ||
322 … | + outline-offset: max(2px, 0.125rem); | ||
323 | 323 … | } | |
324 | 324 … | a img:hover, | |
325 | 325 … | a object:hover { | |
326 | - outline: max(2px, calc(2rem / 16)) solid; | ||
326 … | + outline: max(2px, 0.125rem) solid; | ||
327 | 327 … | } | |
328 | 328 … | ||
329 | 329 … | nav { | |
330 | 330 … | margin-top: 1.5rem; | |
@@ -365,9 +365,9 @@ | |||
365 | 365 … | nav a, | |
366 | 366 … | nav a > *, | |
367 | 367 … | nav a > * > * { | |
368 | 368 … | display: block; | |
369 | - outline-offset: max(2px, calc(2rem / 16)); | ||
369 … | + outline-offset: max(2px, 0.125rem); | ||
370 | 370 … | } | |
371 | 371 … | nav a * { | |
372 | 372 … | width: max-content; | |
373 | 373 … | } |
Built with git-ssb-web