From bdcc7809685ca23d203bc70bd20a360b5ce7779a Mon Sep 17 00:00:00 2001 From: Jan Calanog Date: Tue, 7 Oct 2025 11:53:14 +0200 Subject: [PATCH 1/4] EUI font-size compatibility --- src/Elastic.Documentation.Site/Assets/styles.css | 10 ++++++++++ src/Elastic.Documentation.Site/Assets/theme.css | 9 +++++++++ .../Assets/web-components/VersionDropdown.tsx | 2 +- 3 files changed, 20 insertions(+), 1 deletion(-) diff --git a/src/Elastic.Documentation.Site/Assets/styles.css b/src/Elastic.Documentation.Site/Assets/styles.css index f1bbdd1cb..6502cb5f1 100644 --- a/src/Elastic.Documentation.Site/Assets/styles.css +++ b/src/Elastic.Documentation.Site/Assets/styles.css @@ -24,6 +24,16 @@ @import './api-docs.css'; @import 'tippy.js/dist/tippy.css'; +html { + /* We need to use 14px because EUI works best with a 14px base */ + font-size: 14px; +} + +body { + /* This is still needed because of some usages of ch units and to maintain the previous behavior */ + font-size: 16px; +} + :root { --outline-size: max(2px, 0.08em); --outline-style: auto; diff --git a/src/Elastic.Documentation.Site/Assets/theme.css b/src/Elastic.Documentation.Site/Assets/theme.css index 46e1d7b27..9ce53550c 100644 --- a/src/Elastic.Documentation.Site/Assets/theme.css +++ b/src/Elastic.Documentation.Site/Assets/theme.css @@ -175,4 +175,13 @@ --color-poppy: #fa744e; /* == --color-poppy-90 */ --spacing: 4px; + + --text-xs: 0.857rem; + --text-sm: 1rem; + --text-base: 1.143rem; + --text-xl: 1.429rem; + --text-2xl: 1.714rem; + --text-3xl: 2.143rem; + --text-4xl: 2.571rem; + --text-5xl: 3.429rem; } diff --git a/src/Elastic.Documentation.Site/Assets/web-components/VersionDropdown.tsx b/src/Elastic.Documentation.Site/Assets/web-components/VersionDropdown.tsx index 458e71c60..694247c05 100644 --- a/src/Elastic.Documentation.Site/Assets/web-components/VersionDropdown.tsx +++ b/src/Elastic.Documentation.Site/Assets/web-components/VersionDropdown.tsx @@ -197,7 +197,7 @@ const VersionDropdown = ({ Current version ({currentVersion}) From 7d7faaf8e7b5d8fd269f7d0b9e267f26daac9971 Mon Sep 17 00:00:00 2001 From: Jan Calanog Date: Tue, 7 Oct 2025 11:56:13 +0200 Subject: [PATCH 2/4] Run prettier --- src/Elastic.Documentation.Site/Assets/theme.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Elastic.Documentation.Site/Assets/theme.css b/src/Elastic.Documentation.Site/Assets/theme.css index 9ce53550c..25054cee6 100644 --- a/src/Elastic.Documentation.Site/Assets/theme.css +++ b/src/Elastic.Documentation.Site/Assets/theme.css @@ -175,7 +175,7 @@ --color-poppy: #fa744e; /* == --color-poppy-90 */ --spacing: 4px; - + --text-xs: 0.857rem; --text-sm: 1rem; --text-base: 1.143rem; From de257610dab6ef9a0cce73a93ea321bff72264d0 Mon Sep 17 00:00:00 2001 From: Jan Calanog Date: Tue, 7 Oct 2025 11:58:56 +0200 Subject: [PATCH 3/4] Add comments --- .../Assets/theme.css | 19 ++++++++++--------- 1 file changed, 10 insertions(+), 9 deletions(-) diff --git a/src/Elastic.Documentation.Site/Assets/theme.css b/src/Elastic.Documentation.Site/Assets/theme.css index 25054cee6..5ccba1823 100644 --- a/src/Elastic.Documentation.Site/Assets/theme.css +++ b/src/Elastic.Documentation.Site/Assets/theme.css @@ -175,13 +175,14 @@ --color-poppy: #fa744e; /* == --color-poppy-90 */ --spacing: 4px; - - --text-xs: 0.857rem; - --text-sm: 1rem; - --text-base: 1.143rem; - --text-xl: 1.429rem; - --text-2xl: 1.714rem; - --text-3xl: 2.143rem; - --text-4xl: 2.571rem; - --text-5xl: 3.429rem; + + /* Typography scale based on a 14px base but to maintain the behaviour of 16px */ + --text-xs: 0.857rem; /* 12px */ + --text-sm: 1rem; /* 14px */ + --text-base: 1.143rem; /* 16px */ + --text-xl: 1.429rem; /* 20px */ + --text-2xl: 1.714rem; /* 24px */ + --text-3xl: 2.143rem; /* 30px */ + --text-4xl: 2.571rem; /* 36px */ + --text-5xl: 3.429rem; /* 48px */ } From e75307fbea3384a9afb56cd8ddbddca1e65270db Mon Sep 17 00:00:00 2001 From: Jan Calanog Date: Tue, 7 Oct 2025 12:01:02 +0200 Subject: [PATCH 4/4] Run prettier --- src/Elastic.Documentation.Site/Assets/theme.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Elastic.Documentation.Site/Assets/theme.css b/src/Elastic.Documentation.Site/Assets/theme.css index 5ccba1823..2ef194e7b 100644 --- a/src/Elastic.Documentation.Site/Assets/theme.css +++ b/src/Elastic.Documentation.Site/Assets/theme.css @@ -175,7 +175,7 @@ --color-poppy: #fa744e; /* == --color-poppy-90 */ --spacing: 4px; - + /* Typography scale based on a 14px base but to maintain the behaviour of 16px */ --text-xs: 0.857rem; /* 12px */ --text-sm: 1rem; /* 14px */