Fix scroll padding

Signed-off-by: Addisu Z. Taddese <[email protected]>
azeey · Jun 6, 2024 · 7f4d8e1 · 7f4d8e1
1 parent d4bfbb0
commit 7f4d8e1
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 7 deletions.
diff --git a/_static/css/gazebo.css b/_static/css/gazebo.css
@@ -2,6 +2,8 @@ html {
   --pst-font-family-base: Roboto, var(--pst-font-family-base-system);
   --pst-font-size-base: 14px;
   --pst-header-height: 64px;
+  --gz-doc-header-height: 120px;
+  scroll-padding-top: calc(var(--pst-header-height) + var(--gz-doc-header-height) + 1rem);
 }
 
 html[data-theme="light"] {
@@ -69,11 +71,11 @@ pre {
   display: none;
 }
 
-.doc-heading {
+.doc-header {
   width: 100%;
   background-color: var(--gz-color-doc-header);
   color: var(--gz-color-doc-header-text);
-  height: 120px;
+  height: var(--gz-doc-header-height);
 }
 
 .banner {
@@ -88,14 +90,14 @@ header.navbar {
 }
 
 .bd-sidebar-primary {
-  max-height: calc(100vh - var(--pst-header-height) + 120px);
-  top: calc(var(--pst-header-height) + 120px);
+  max-height: calc(100vh - var(--pst-header-height) + var(--gz-doc-header-height));
+  top: calc(var(--pst-header-height) + var(--gz-doc-header-height));
   background-color: var(--gz-color-primary-sidebar);
 }
 
 .bd-sidebar-secondary {
-  max-height: calc(100vh - var(--pst-header-height) + 120px);
-  top: calc(var(--pst-header-height) + 120px);
+  max-height: calc(100vh - var(--pst-header-height) + var(--gz-doc-header-height));
+  top: calc(var(--pst-header-height) + var(--gz-doc-header-height));
 }
 
 .gz-version-switcher {

diff --git a/_templates/sections/header.html b/_templates/sections/header.html
@@ -23,7 +23,7 @@
 {% include "!sections/header.html" %}
 
 {% if release_info %}
-<div class="doc-heading">
+<div class="doc-header">
   <div class="banner d-flex flex-column-reverse flex-sm-row">
     <div>
       <div class="d-none d-sm-block">