commit c1dc7c5d1da3a040f2e1a4d0ba68db659c16af2d
author Aemie <aemie.j@hotmail.co.uk> Sat Jun 27 15:26:10 2020 +0530
committer Zoran Regvart <zoran@regvart.com> Thu Jul 02 10:53:21 2020 +0200
tree fac06fbb9c54fe18c7139aa7ebb403e3d0f34408
parent 780f3fc9010ef22f22e3f84d3d77c0691c2c0d54

CAMEL-14958: make corresponding changes to new layout to documentation specific pages

antora-ui-camel/src/css/blog.css

diff --git a/antora-ui-camel/src/css/blog.css b/antora-ui-camel/src/css/blog.css
index 6bdbc57..7a06e1d 100644
--- a/antora-ui-camel/src/css/blog.css
+++ b/antora-ui-camel/src/css/blog.css
@@ -232,4 +232,10 @@
   .blog.list aside {
     margin-top: 4.5rem;
   }
+
+  @media screen and (min-width: 1024px) {
+    .blog.list aside {
+      top: var(--navbar-mobile-height);
+    }
+  }
 }

antora-ui-camel/src/css/doc.css

diff --git a/antora-ui-camel/src/css/doc.css b/antora-ui-camel/src/css/doc.css
index 912c080..fd8d58a 100644
--- a/antora-ui-camel/src/css/doc.css
+++ b/antora-ui-camel/src/css/doc.css
@@ -37,12 +37,24 @@
   margin: 1.5rem 0;
 }
 
-@media screen and (min-width: 769px) {
+@media screen and (min-width: 1278px) {
   .doc > h1.page:first-child {
     margin-top: 2.5rem;
   }
 }
 
+@media screen and (max-width: 1277px) {
+  .doc > h1.page:first-child {
+    margin-top: 3rem;
+  }
+
+  @media screen and (max-width: 1023px) {
+    .doc > h1.page:first-child {
+      margin-top: 5rem;
+    }
+  }
+}
+
 #preamble + .sect1,
 .doc .sect1 + .sect1 {
   margin-top: 2rem;

antora-ui-camel/src/css/nav.css

diff --git a/antora-ui-camel/src/css/nav.css b/antora-ui-camel/src/css/nav.css
index 4122a3b..c1a1487 100644
--- a/antora-ui-camel/src/css/nav.css
+++ b/antora-ui-camel/src/css/nav.css
@@ -43,7 +43,7 @@
 
 @media screen and (min-width: 1024px) {
   .nav {
-    top: var(--navbar-mobile-height);
+    top: var(--navbar-height);
     box-shadow: none;
     position: sticky;
     height: var(--nav-height--desktop);
@@ -70,6 +70,18 @@
   .nav-panel-menu {
     height: var(--nav-panel-height--desktop);
   }
+
+  @media screen and (max-width: 1277px) {
+    .nav-panel-menu {
+      height: calc(var(--nav-panel-height--desktop) - 2rem);
+    }
+  }
+}
+
+@media screen and (max-width: 1277px) {
+  .nav-panel-menu {
+    margin-top: var(--navbar-height);
+  }
 }
 
 .nav-panel-menu:not(.is-active) .nav-menu {

antora-ui-camel/src/css/toc.css

diff --git a/antora-ui-camel/src/css/toc.css b/antora-ui-camel/src/css/toc.css
index b4ff541..e430ee1 100644
--- a/antora-ui-camel/src/css/toc.css
+++ b/antora-ui-camel/src/css/toc.css
@@ -8,6 +8,13 @@
   top: var(--toc-top);
 }
 
+@media screen and (min-width: 1024px) and (max-width: 1277px) {
+  .toc.sidebar .toc-menu {
+    margin-top: 2rem;
+    top: var(--toc-mobile-top);
+  }
+}
+
 .toc .toc-menu h3 {
   color: var(--toc-heading-font-color);
   font-size: calc(16 / var(--rem-base) * 1rem);

antora-ui-camel/src/css/vars.css

diff --git a/antora-ui-camel/src/css/vars.css b/antora-ui-camel/src/css/vars.css
index 13c8641..981fb17 100644
--- a/antora-ui-camel/src/css/vars.css
+++ b/antora-ui-camel/src/css/vars.css
@@ -146,6 +146,7 @@
   --nav-panel-height--desktop: calc(var(--nav-height--desktop) - var(--drawer-height));
   --nav-width: calc(270 / var(--rem-base) * 1rem);
   --toc-top: calc(var(--body-top) + var(--toolbar-height));
+  --toc-mobile-top: calc(1rem + var(--toc-top));
   --toc-height: calc(100vh - var(--toc-top) - 2.5rem);
   --toc-width: calc(162 / var(--rem-base) * 1rem);
   --toc-width--widescreen: calc(216 / var(--rem-base) * 1rem);