From 9ddb2e67abdcd26129ab7170beb7583e4d1c4226 Mon Sep 17 00:00:00 2001 From: David Rivera Date: Wed, 16 Jul 2025 08:32:02 -0700 Subject: [PATCH 1/6] fix: do not cut off bottom portion of text --- src/themes/shared/_vars.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/themes/shared/_vars.css b/src/themes/shared/_vars.css index 72ed013e4..b1dda1094 100644 --- a/src/themes/shared/_vars.css +++ b/src/themes/shared/_vars.css @@ -115,7 +115,7 @@ --form-element-color : ; --heading-color : var(--strong-color); --heading-font-weight : 600; - --heading-line-height : calc(2ex + 5px); /* Unit required */ + --heading-line-height : normal; /* Unit required */ --kbd-bg : var(--color-mono-1); --kbd-border : 1px solid var(--color-mono-3); --kbd-border-radius : 4px; From 745ba130f2082544a9171b071472c9ef0ecf3daf Mon Sep 17 00:00:00 2001 From: Luffy <52o@qq52o.cn> Date: Thu, 17 Jul 2025 10:26:44 +0800 Subject: [PATCH 2/6] Update src/themes/shared/_vars.css --- src/themes/shared/_vars.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/themes/shared/_vars.css b/src/themes/shared/_vars.css index b1dda1094..b1f0d7d86 100644 --- a/src/themes/shared/_vars.css +++ b/src/themes/shared/_vars.css @@ -115,7 +115,7 @@ --form-element-color : ; --heading-color : var(--strong-color); --heading-font-weight : 600; - --heading-line-height : normal; /* Unit required */ + --heading-line-height : normal; --kbd-bg : var(--color-mono-1); --kbd-border : 1px solid var(--color-mono-3); --kbd-border-radius : 4px; From d22ed31300f4da15b9d14009a3b27cc7941a75b9 Mon Sep 17 00:00:00 2001 From: David Rivera Date: Wed, 16 Jul 2025 23:52:20 -0700 Subject: [PATCH 3/6] update markdown h2 bottom-margin calculation * calculation must use units; 'normal' value breaks calculation * replace --header-line-height variable with line height unit (lh) * introduce line heigh multiplier to reduce or increase line height --- src/themes/shared/_markdown.css | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/themes/shared/_markdown.css b/src/themes/shared/_markdown.css index b328c001e..1016d59fd 100644 --- a/src/themes/shared/_markdown.css +++ b/src/themes/shared/_markdown.css @@ -276,9 +276,11 @@ h2 { --_spacing: 0.5em; + --_line-height-muliplier: 0.9; margin-bottom: calc( - var(--_spacing) + (var(--heading-line-height) - var(--font-size-xxl)) + var(--_spacing) + (1lh * var(--_line-height-muliplier)) - + var(--font-size-xxl) ); padding-bottom: var(--_spacing); border-bottom: 1px solid var(--border-color); From a66ab1d5a8106ab260dc6a4f7f3234efa7b1ba6d Mon Sep 17 00:00:00 2001 From: David Rivera Date: Fri, 18 Jul 2025 12:00:05 -0700 Subject: [PATCH 4/6] calculate h1, h2 top and bottom margins based on font line height --- src/themes/shared/_markdown.css | 12 +++--------- 1 file changed, 3 insertions(+), 9 deletions(-) diff --git a/src/themes/shared/_markdown.css b/src/themes/shared/_markdown.css index 1016d59fd..83d1c075c 100644 --- a/src/themes/shared/_markdown.css +++ b/src/themes/shared/_markdown.css @@ -259,7 +259,7 @@ h1, h2 { - margin-top: 2.5rem; + margin-top: calc(2.5rem - (1lh - 1.275em)); } :is(h1, h2, h3, h4, h5, h6) + * { @@ -275,14 +275,8 @@ } h2 { - --_spacing: 0.5em; - --_line-height-muliplier: 0.9; - - margin-bottom: calc( - var(--_spacing) + (1lh * var(--_line-height-muliplier)) - - var(--font-size-xxl) - ); - padding-bottom: var(--_spacing); + margin-bottom: 0.65em; + padding-bottom: calc(0.5em - (1lh - 1.275em)); border-bottom: 1px solid var(--border-color); font-size: var(--font-size-xxl); } From 5a14726f80bda38a77163c9dd00ee6dd13f69033 Mon Sep 17 00:00:00 2001 From: David Rivera Date: Wed, 23 Jul 2025 13:43:05 -0700 Subject: [PATCH 5/6] allow y overflow in h1, h2 headings * change h2 margin calculation to use lh and em units to allow heading-line-height var to be any valid value (no unit requirement) --- src/themes/shared/_markdown.css | 11 +++++++---- src/themes/shared/_vars.css | 2 +- 2 files changed, 8 insertions(+), 5 deletions(-) diff --git a/src/themes/shared/_markdown.css b/src/themes/shared/_markdown.css index 83d1c075c..69e654ec0 100644 --- a/src/themes/shared/_markdown.css +++ b/src/themes/shared/_markdown.css @@ -252,14 +252,15 @@ /* Prevent long titles from causing horizontal scrolling */ &[id] a { display: block; - overflow: hidden; + overflow-x: clip; + overflow-y: visible; text-overflow: ellipsis; } } h1, h2 { - margin-top: calc(2.5rem - (1lh - 1.275em)); + margin-top: 2.5rem; } :is(h1, h2, h3, h4, h5, h6) + * { @@ -275,8 +276,10 @@ } h2 { - margin-bottom: 0.65em; - padding-bottom: calc(0.5em - (1lh - 1.275em)); + --_spacing: 0.5em; + + margin-bottom: calc(var(--_spacing) + (1lh - 1em)); + padding-bottom: var(--_spacing); border-bottom: 1px solid var(--border-color); font-size: var(--font-size-xxl); } diff --git a/src/themes/shared/_vars.css b/src/themes/shared/_vars.css index b1f0d7d86..6bdf885fc 100644 --- a/src/themes/shared/_vars.css +++ b/src/themes/shared/_vars.css @@ -115,7 +115,7 @@ --form-element-color : ; --heading-color : var(--strong-color); --heading-font-weight : 600; - --heading-line-height : normal; + --heading-line-height : calc(2ex + 5px); --kbd-bg : var(--color-mono-1); --kbd-border : 1px solid var(--color-mono-3); --kbd-border-radius : 4px; From fdce5fe24fedce145af1e5f8f4fb1bc583bffbf4 Mon Sep 17 00:00:00 2001 From: David Rivera Date: Wed, 23 Jul 2025 14:06:43 -0700 Subject: [PATCH 6/6] fix: safari has a slight ui difference using lh and em units instead of variables --- src/themes/shared/_markdown.css | 4 +++- src/themes/shared/_vars.css | 2 +- 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/src/themes/shared/_markdown.css b/src/themes/shared/_markdown.css index 69e654ec0..ce0f0e8a8 100644 --- a/src/themes/shared/_markdown.css +++ b/src/themes/shared/_markdown.css @@ -278,7 +278,9 @@ h2 { --_spacing: 0.5em; - margin-bottom: calc(var(--_spacing) + (1lh - 1em)); + margin-bottom: calc( + var(--_spacing) + (var(--heading-line-height) - var(--font-size-xxl)) + ); padding-bottom: var(--_spacing); border-bottom: 1px solid var(--border-color); font-size: var(--font-size-xxl); diff --git a/src/themes/shared/_vars.css b/src/themes/shared/_vars.css index 6bdf885fc..72ed013e4 100644 --- a/src/themes/shared/_vars.css +++ b/src/themes/shared/_vars.css @@ -115,7 +115,7 @@ --form-element-color : ; --heading-color : var(--strong-color); --heading-font-weight : 600; - --heading-line-height : calc(2ex + 5px); + --heading-line-height : calc(2ex + 5px); /* Unit required */ --kbd-bg : var(--color-mono-1); --kbd-border : 1px solid var(--color-mono-3); --kbd-border-radius : 4px;