diff options
| author | Max Charrier <max@puffer.fish> | 2025-04-20 17:44:20 +0200 |
|---|---|---|
| committer | Max Charrier <max@puffer.fish> | 2025-04-20 17:44:20 +0200 |
| commit | 9f89b3198d8309c2bf77784c8c783d76f2c94794 (patch) | |
| tree | d2c85015984e09e9a97b9efd3ec738db35c060b7 | |
| parent | dac9f7d96d443fd9e54ebc0244528ecc66626a97 (diff) | |
Implement System Font Stack
More information: https://systemfontstack.com/
CSS variables are very usefull to avoid long list of fonts each time.
Also, it's easier to read and maintain.
Signed-off-by: Max Charrier <max@puffer.fish>
| -rw-r--r-- | stylesheet.css | 7 |
1 files changed, 5 insertions, 2 deletions
diff --git a/stylesheet.css b/stylesheet.css index bcd9e8b..ee6301e 100644 --- a/stylesheet.css +++ b/stylesheet.css @@ -1,3 +1,6 @@ +:root { + --system-ui: 'comic_monobold', ui-monospace, Menlo, Consolas, Monaco, Liberation Mono, Lucida Console, monospace; +} body { background-color: #f1e9df; color: #89a06b; @@ -6,7 +9,7 @@ body { flex-direction: column; align-items: center; gap: 30px; - font-family: 'comic_monobold', ui-monospace, monospace; + font-family: var(--system-ui); font-size: 1.4em; } header { @@ -25,7 +28,7 @@ nav aside { } nav aside a { text-align: center; - font-family: 'comic_monobold', ui-monospace, monospace; + font-family: var(--system-ui); font-size: 1.2rem; display: inline-block; padding: 10px 20px; |