diff --git a/src/theme/css/chrome.css b/src/theme/css/chrome.css index 4b3870e51b..02d0dcedf9 100644 --- a/src/theme/css/chrome.css +++ b/src/theme/css/chrome.css @@ -45,7 +45,7 @@ a > .hljs { position: relative; padding: 0 8px; z-index: 10; - line-height: 50px; + line-height: var(--menu-bar-height); cursor: pointer; transition: color 0.5s; } @@ -73,7 +73,7 @@ a > .hljs { } html:not(.sidebar-visible) #menu-bar:not(:hover).folded > #menu-bar-sticky-container { - transform: translateY(-60px); + transform: translateY(calc(-10px - var(--menu-bar-height))); } .left-buttons { @@ -88,7 +88,7 @@ html:not(.sidebar-visible) #menu-bar:not(:hover).folded > #menu-bar-sticky-conta display: inline-block; font-weight: 200; font-size: 20px; - line-height: 50px; + line-height: var(--menu-bar-height); text-align: center; margin: 0; flex: 1; @@ -446,7 +446,7 @@ ul#searchresults span.teaser em { .theme-popup { position: absolute; left: 10px; - top: 50px; + top: var(--menu-bar-height); z-index: 1000; border-radius: 4px; font-size: 0.7em; diff --git a/src/theme/css/general.css b/src/theme/css/general.css index 44c117d622..336b5a5d6b 100644 --- a/src/theme/css/general.css +++ b/src/theme/css/general.css @@ -45,6 +45,13 @@ h4 a.header:target::before { width: 30px; } +h1 a.header:target, +h2 a.header:target, +h3 a.header:target, +h4 a.header:target { + scroll-margin-top: calc(var(--menu-bar-height) + 0.5em); +} + .page { outline: 0; padding: 0 var(--page-padding); diff --git a/src/theme/css/variables.css b/src/theme/css/variables.css index 6838c644ac..9534ec8d15 100644 --- a/src/theme/css/variables.css +++ b/src/theme/css/variables.css @@ -5,6 +5,7 @@ --sidebar-width: 300px; --page-padding: 15px; --content-max-width: 750px; + --menu-bar-height: 50px; } /* Themes */