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