cleanup formatting and docs (#247)

exampleSite/content/usage/configuration.md

@@ -46,8 +46,13 @@ enableRobotsTXT = true
   geekdocLogo = "logo.png"
 
   # (Optional, default false) Render menu from data file im 'data/menu/main.yaml'.
+  # See also https://geekdocs.de/usage/menus/#bundle-menu.
   geekdocMenuBundle = true
 
+  # (Optional, default false) Collapse all menu entries, can not be overwritten
+  # per page if enabled. Can be enabled per page via `geekdocCollapseSection`.
+  geekdocCollapseAllSections = true
+
   # (Optional, default true) Show page navigation links at the bottom of each
   # docs page (bundle menu only).
   geekdocNextPrev = false
@@ -154,11 +159,11 @@ params:
   geekdocLogo: logo.png
 
   # (Optional, default false) Render menu from data file im 'data/menu/main.yaml'.
-  # See also https://geekdocs.de/usage/menus/#bundle-menu
+  # See also https://geekdocs.de/usage/menus/#bundle-menu.
   geekdocMenuBundle: true
 
   # (Optional, default false) Collapse all menu entries, can not be overwritten
-  # per page if enabled. Can be enabled per page via `geekdocCollapseSection`
+  # per page if enabled. Can be enabled per page via `geekdocCollapseSection`.
   geekdocCollapseAllSections: true
 
   # (Optional, default true) Show page navigation links at the bottom of each

exampleSite/static/custom.css.example

@@ -13,6 +13,8 @@
   --body-background: #ffffff;
   --body-font-color: #343a40;
 
+  --mark-color: #ffab00;
+
   --button-background: #62cb97;
   --button-border-color: #4ec58a;
 
@@ -45,6 +47,8 @@
     --body-background: #ffffff;
     --body-font-color: #343a40;
 
+    --mark-color: #ffab00;
+
     --button-background: #62cb97;
     --button-border-color: #4ec58a;
 
@@ -79,6 +83,8 @@
   --body-background: #343a40;
   --body-font-color: #ced3d8;
 
+  --mark-color: #ffab00;
+
   --button-background: #62cb97;
   --button-border-color: #4ec58a;
 
@@ -111,6 +117,8 @@
     --body-background: #343a40;
     --body-font-color: #ced3d8;
 
+    --mark-color: #ffab00;
+
     --button-background: #62cb97;
     --button-border-color: #4ec58a;
 

layouts/partials/site-footer.html

@@ -18,7 +18,7 @@
         </div>
         {{ if (default true .Site.Params.GeekdocBackToTop) }}
         <div class="flex flex-25 justify-end">
-            <span class="gdoc-footer__item">
+            <span class="gdoc-footer__item text-right">
                 <a class="gdoc-footer__link fake-link" href="#" aria-label="Back to top">
                     <svg class="icon gdoc_keyborad_arrow_up"><use xlink:href="#gdoc_keyborad_arrow_up"></use></svg> <span class="hidden-mobile">Back to top</span>
                 </a>

src/sass/_base.scss

@@ -358,14 +358,6 @@ img {
     border-radius: $border-radius;
   }
 
-  &__footer {
-    margin-top: $padding-32;
-
-    a:hover {
-      text-decoration: none;
-    }
-  }
-
   &__nav {
     &:hover {
       background-image: linear-gradient(var(--link-color), var(--link-color));
@@ -408,6 +400,38 @@ img {
       color: transparent;
     }
   }
+
+  &__figure {
+    padding: $padding-4;
+    margin: $padding-16 0;
+    background-color: var(--accent-color);
+    display: table;
+    border-top-left-radius: $border-radius;
+    border-top-right-radius: $border-radius;
+
+    figcaption {
+      display: table-caption;
+      caption-side: bottom;
+      background-color: var(--accent-color);
+      padding: 0 $padding-4 $padding-4;
+      text-align: center;
+      border-bottom-left-radius: $border-radius;
+      border-bottom-right-radius: $border-radius;
+    }
+
+    img {
+      max-width: 100%;
+      height: auto;
+    }
+  }
+
+  &__footer {
+    margin-top: $padding-32;
+
+    a:hover {
+      text-decoration: none;
+    }
+  }
 }
 
 .gdoc-post {
@@ -545,7 +569,7 @@ img {
     line-height: 2em;
 
     &--row {
-      margin-right: 1em;
+      margin-right: $padding-16;
     }
   }
 

src/sass/_color_mode.scss

@@ -7,6 +7,8 @@
   --body-background: #{$body-background};
   --body-font-color: #{$body-font-color};
 
+  --mark-color: #{$mark-color};
+
   --button-background: #{lighten($main-color, 2)};
   --button-border-color: #{$main-color};
 
@@ -54,6 +56,8 @@
   --body-background: #{$body-background-dark};
   --body-font-color: #{lighten($body-background-dark, 60)};
 
+  --mark-color: #{$mark-color};
+
   --button-background: #{lighten($main-color, 2)};
   --button-border-color: #{$main-color};
 

src/sass/_defaults.scss

@@ -54,6 +54,7 @@ $container-max-width: 80rem !default;
 
 $main-color: rgba(65, 134, 201, 1) !default;
 $second-color: rgba(47, 51, 62, 1) !default;
+$mark-color: rgba(255, 171, 0, 1) !default;
 
 $body-background-dark: mix(
   invert($body-background, 75%),

src/sass/_markdown.scss

@@ -76,30 +76,6 @@
     border-radius: $border-radius;
   }
 
-  &__figure {
-    padding: $padding-4;
-    margin: $padding-16 0;
-    background-color: var(--accent-color);
-    display: table;
-    border-top-left-radius: $border-radius;
-    border-top-right-radius: $border-radius;
-
-    figcaption {
-      display: table-caption;
-      caption-side: bottom;
-      background-color: var(--accent-color);
-      padding: 0 $padding-4 $padding-4;
-      text-align: center;
-      border-bottom-left-radius: $border-radius;
-      border-bottom-right-radius: $border-radius;
-    }
-
-    img {
-      max-width: 100%;
-      height: auto;
-    }
-  }
-
   blockquote {
     margin: $padding-16 0;
     padding: $padding-8 $padding-16 $padding-8 ($padding-16 - $padding-4); //to keep total left space 16dp
@@ -115,10 +91,6 @@
     }
   }
 
-  .table-wrap {
-    overflow: auto;
-  }
-
   table:not(.lntable) {
     display: table;
     border-spacing: 0;
@@ -187,6 +159,10 @@
     width: 100%;
   }
 
+  mark {
+    background-color: var(--mark-color);
+  }
+
   &__align {
     &--left {
       h1,

src/sass/_mobile.scss

@@ -64,12 +64,6 @@
     flex-direction: column;
   }
 
-  .gdoc-footer {
-    &__item--row {
-      width: 100%;
-    }
-  }
-
   #menu-control:checked ~ main {
     .gdoc-nav nav,
     .gdoc-page {

src/sass/_utils.scss

@@ -57,6 +57,10 @@
   text-align: center;
 }
 
+.text-right {
+  text-align: right;
+}
+
 .no-wrap {
   white-space: nowrap;
 }
@@ -72,6 +76,10 @@
   overflow: hidden;
 }
 
+.table-wrap {
+  overflow: auto;
+}
+
 .badge-placeholder {
   display: inline-block;
   min-width: 4rem;