[camel-website] 02/08: CAMEL-14958: make corresponding changes to new layout to each nav menu item pages

[zr...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

zregvart pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/camel-website.git

commit dd7418e4d5a1e7847da25e1c16f0b6fe93b6cf0a
Author: Aemie <ae...@hotmail.co.uk>
AuthorDate: Sat Jun 27 13:19:08 2020 +0530

    CAMEL-14958: make corresponding changes to new layout to each nav menu item pages
---
 antora-ui-camel/src/css/blog.css      | 12 +++++++++++-
 antora-ui-camel/src/css/frontpage.css |  7 ++++++-
 antora-ui-camel/src/css/header.css    |  2 +-
 antora-ui-camel/src/css/nav.css       |  2 +-
 antora-ui-camel/src/css/static.css    |  9 +++++++--
 antora-ui-camel/src/css/toolbar.css   |  6 ++++++
 6 files changed, 32 insertions(+), 6 deletions(-)

diff --git a/antora-ui-camel/src/css/blog.css b/antora-ui-camel/src/css/blog.css
index 1466973..6bdbc57 100644
--- a/antora-ui-camel/src/css/blog.css
+++ b/antora-ui-camel/src/css/blog.css
@@ -193,7 +193,7 @@ article.blog p {
   padding: 1rem;
 }
 
-@media screen and (min-width: 1024px) {
+@media screen and (min-width: 1278px) {
   .blog .pagination {
     max-width: var(--static-max-width--desktop);
   }
@@ -223,3 +223,13 @@ article.blog p {
 .blog .page-item.active a {
   color: var(--color-white);
 }
+
+@media screen and (max-width: 1277px) {
+  article.blog:first-child {
+    margin-top: 5rem;
+  }
+
+  .blog.list aside {
+    margin-top: 4.5rem;
+  }
+}
diff --git a/antora-ui-camel/src/css/frontpage.css b/antora-ui-camel/src/css/frontpage.css
index 9f81b1b..705ce15 100644
--- a/antora-ui-camel/src/css/frontpage.css
+++ b/antora-ui-camel/src/css/frontpage.css
@@ -251,13 +251,18 @@ section.frontpage h2 {
   }
 }
 
-@media screen and (max-width: 1023px) {
+@media screen and (max-width: 1277px) {
+  header.frontpage {
+    margin-top: var(--navbar-height);
+  }
+
   header.frontpage h1 {
     font-size: 9vw;
   }
 
   header.frontpage svg {
     height: 10rem;
+    top: 8rem;
   }
 
   .split {
diff --git a/antora-ui-camel/src/css/header.css b/antora-ui-camel/src/css/header.css
index 8461ee8..697f83f 100644
--- a/antora-ui-camel/src/css/header.css
+++ b/antora-ui-camel/src/css/header.css
@@ -69,7 +69,7 @@ body {
   position: relative;
   /* width: var(--navbar-height); */
   width: 2rem;
-  top: 0.5rem;
+  top: 0.75rem;
   padding: 0;
   order: 8;
 }
diff --git a/antora-ui-camel/src/css/nav.css b/antora-ui-camel/src/css/nav.css
index 158b615..4122a3b 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-height);
+    top: var(--navbar-mobile-height);
     box-shadow: none;
     position: sticky;
     height: var(--nav-height--desktop);
diff --git a/antora-ui-camel/src/css/static.css b/antora-ui-camel/src/css/static.css
index 6002d2c..78e74e9 100644
--- a/antora-ui-camel/src/css/static.css
+++ b/antora-ui-camel/src/css/static.css
@@ -1,14 +1,19 @@
 .static {
   margin: var(--static-margin);
-  max-width: var(--static-max-width);
 }
 
-@media screen and (min-width: 1024px) {
+@media screen and (min-width: 1278px) {
   .static {
     max-width: var(--static-max-width--desktop);
   }
 }
 
+@media screen and (max-width: 1277px) {
+  .static {
+    margin-top: 5rem;
+  }
+}
+
 /* Antora markup is wrapped in <div>, we need to emulate the same */
 .static dl,
 .static ol,
diff --git a/antora-ui-camel/src/css/toolbar.css b/antora-ui-camel/src/css/toolbar.css
index 76da9e0..a80c2a7 100644
--- a/antora-ui-camel/src/css/toolbar.css
+++ b/antora-ui-camel/src/css/toolbar.css
@@ -12,6 +12,12 @@
   z-index: var(--z-index-toolbar);
 }
 
+@media screen and (max-width: 1023px) {
+  .toolbar {
+    top: var(--navbar-mobile-height);
+  }
+}
+
 .toolbar a {
   color: inherit;
 }