From 9f89b3198d8309c2bf77784c8c783d76f2c94794 Mon Sep 17 00:00:00 2001 From: Max Charrier Date: Sun, 20 Apr 2025 17:44:20 +0200 Subject: [PATCH] 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 --- stylesheet.css | 7 +++++-- 1 file 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; -- 2.39.5