Synced from 3-layout-tud-cd

doc.zih.tu-dresden.de/mkdocs.yml

@@ -14,8 +14,8 @@ site_url: https://gitlab.hrz.tu-chemnitz.de/hpcsupport/hpc-compendium
 theme:
   # basetheme
   name: material
-  font:
-    text: Open Sans
+  # disable fonts being loaded from google fonts
+  font: false
   language: en
   # dir containing all customizations
   custom_dir: tud_theme

doc.zih.tu-dresden.de/tud_theme/partials/footer.html

@@ -2,58 +2,6 @@
 
 <!-- Footer -->
 <footer class="md-footer">
-
-  <!-- Link to previous and/or next page -->
-  {% if page.previous_page or page.next_page %}
-    <nav
-      class="md-footer__inner md-grid"
-      aria-label="{{ lang.t('footer.title') }}"
-    >
-
-      <!-- Link to previous page -->
-      {% if page.previous_page %}
-        <a
-          href="{{ page.previous_page.url | url }}"
-          class="md-footer__link md-footer__link--prev"
-          rel="prev"
-        >
-          <div class="md-footer__button md-icon">
-            {% include ".icons/material/arrow-left.svg" %}
-          </div>
-          <div class="md-footer__title">
-            <div class="md-ellipsis">
-              <span class="md-footer__direction">
-                {{ lang.t("footer.previous") }}
-              </span>
-              {{ page.previous_page.title }}
-            </div>
-          </div>
-        </a>
-      {% endif %}
-
-      <!-- Link to next page -->
-      {% if page.next_page %}
-        <a
-          href="{{ page.next_page.url | url }}"
-          class="md-footer__link md-footer__link--next"
-          rel="next"
-        >
-          <div class="md-footer__title">
-            <div class="md-ellipsis">
-              <span class="md-footer__direction">
-                {{ lang.t("footer.next") }}
-              </span>
-              {{ page.next_page.title }}
-            </div>
-          </div>
-          <div class="md-footer__button md-icon">
-            {% include ".icons/material/arrow-right.svg" %}
-          </div>
-        </a>
-      {% endif %}
-    </nav>
-  {% endif %}
-
   <!-- Further information -->
   <div class="md-footer-meta md-typeset">
     <div class="md-footer-meta__inner md-grid">

doc.zih.tu-dresden.de/tud_theme/partials/header.html

+<!--
+  Copyright (c) 2016-2021 Martin Donath <martin.donath@squidfunk.com>
+  Permission is hereby granted, free of charge, to any person obtaining a copy
+  of this software and associated documentation files (the "Software"), to
+  deal in the Software without restriction, including without limitation the
+  rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
+  sell copies of the Software, and to permit persons to whom the Software is
+  furnished to do so, subject to the following conditions:
+  The above copyright notice and this permission notice shall be included in
+  all copies or substantial portions of the Software.
+  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+  FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL THE
+  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+  FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
+  IN THE SOFTWARE.
+-->
+<!-- Header -->
+<header class="md-header" data-md-component="header">
+  <nav
+    class="md-header__inner md-grid"
+    aria-label="{{ lang.t('header.title') }}"
+  >
+
+    <!-- Link to home -->
+    <a
+      href="{{ config.extra.homepage | d(nav.homepage.url, true) | url }}"
+      title="{{ config.site_name | e }}"
+      class="md-header__button md-logo"
+      aria-label="{{ config.site_name }}"
+      data-md-component="logo"
+    >
+      {% include "partials/logo.html" %}
+    </a>
+
+    <!-- Button to open drawer -->
+    <label class="md-header__button md-icon" for="__drawer">
+      {% include ".icons/material/menu" ~ ".svg" %}
+    </label>
+
+    <!-- Header title -->
+    <div class="md-header__title">
+      <div class="md-header__ellipsis">
+        <div class="md-header__topic">
+          <span class="md-ellipsis">
+            <a
+              href="{{ config.site_url | url }}"
+              title="{{ config.site_name | e }}"
+              aria-label="{{ config.site_name }}"
+              data-md-component="title"
+            >
+              {{ config.site_name }}
+            </a>
+          </span>
+        </div>
+      </div>
+    </div>
+
+    <!-- Button to open search modal -->
+    {% if "search" in config["plugins"] %}
+      <label class="md-header__button md-icon" for="__search">
+        {% include ".icons/material/magnify.svg" %}
+      </label>
+
+      <!-- Search interface -->
+      {% include "partials/search.html" %}
+    {% endif %}
+
+  </nav>
+</header>
\ No newline at end of file

doc.zih.tu-dresden.de/tud_theme/partials/nav.html

+<!--
+  Copyright (c) 2016-2021 Martin Donath <martin.donath@squidfunk.com>
+  Permission is hereby granted, free of charge, to any person obtaining a copy
+  of this software and associated documentation files (the "Software"), to
+  deal in the Software without restriction, including without limitation the
+  rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
+  sell copies of the Software, and to permit persons to whom the Software is
+  furnished to do so, subject to the following conditions:
+  The above copyright notice and this permission notice shall be included in
+  all copies or substantial portions of the Software.
+  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+  FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL THE
+  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+  FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
+  IN THE SOFTWARE.
+-->
+
+<!-- Determine class according to configuration -->
+{% set class = "md-nav md-nav--primary" %}
+{% if "navigation.tabs" in features %}
+  {% set class = class ~ " md-nav--lifted" %}
+{% endif %}
+{% if "toc.integrate" in features %}
+  {% set class = class ~ " md-nav--integrated" %}
+{% endif %}
+
+<!-- Main navigation -->
+<nav
+  class="{{ class }}"
+  aria-label="{{ lang.t('nav.title') }}"
+  data-md-level="0"
+>
+
+  <!-- Site title -->
+  <label class="md-nav__title" for="__drawer">
+    <a
+      href="{{ config.extra.homepage | d(nav.homepage.url, true) | url }}"
+      title="{{ config.site_name | e }}"
+      class="md-nav__button md-logo"
+      aria-label="{{ config.site_name }}"
+      data-md-component="logo"
+    >
+      {% include "partials/logo.html" %}
+    </a>
+    {{ config.site_name }}
+  </label>
+
+  <!-- Render item list -->
+  <ul class="md-nav__list" data-md-scrollfix>
+    {% for nav_item in nav %}
+      {% set path = "__nav_" ~ loop.index %}
+      {% set level = 1 %}
+      {% include "partials/nav-item.html" %}
+    {% endfor %}
+  </ul>
+</nav>
\ No newline at end of file

doc.zih.tu-dresden.de/tud_theme/stylesheets/extra.css

+/* general */
+@font-face {
+    font-family: "Open Sans Regular";
+    src: 
+        local('Open Sans Regular'),
+        url('./Open_Sans/OpenSans-Regular-webfont.woff') format('woff')
+}
+@font-face {
+    font-family: "Open Sans Semibold";
+    src: 
+        local('Open Sans Semibold'),
+        url('./Open_Sans/OpenSans-Semibold-webfont.woff') format('woff')
+}
 :root {
+    --md-text-font-family: 'Open Sans Regular', sans-serif;
+
     --md-primary-fg-color:        rgb(0, 37, 87);
     --md-primary-fg-color--light: rgb(39, 66, 117);
     --md-footer-bg-color:         rgb(0, 37, 87);
-  }
+    --tud-grey-100:               rgb(51, 51, 51);
+    --tud-red-90:                 rgb(221, 29, 29);
+
+}
+
+.md-typeset h1, 
+.md-typeset h2, 
+.md-typeset h3, 
+.md-typeset h4, 
+.md-typeset h5 {
+    font-family: 'Open Sans Semibold';
+    line-height: 130%;
+}
+
+.md-typeset h1 {
+    font-family: 'Open Sans Regular';
+    font-size: 1.6rem;   
+}
 
-.md-header__topic {
-    padding: 0 1em;
+.md-typeset h2 {
+    font-size: 1.4rem;
+}
+
+.md-typeset h3 {
+    font-size: 1.2rem;
+}
+
+.md-typeset h4 {
+    font-size: 1rem;
+}
+
+.md-typeset h5 {
+    font-size: 10.9rem;
+    line-height: 120%;
+}
+
+strong {
+    font-weight: bold;
+    line-height: 170%;
+}
+
+.md-typeset a {
+    line-height: 170%;
+    color: var(--tud-red-90);
+}
+
+.md-nav__link:hover,
+a:hover {
+    text-decoration: underline;
+    color: var(--tud-grey-100);
+}
+.md-grid {
+    max-width: 1600px;
+}
+
+/* header */
+
+.md-header * {
+    height: 80px;
+}  
+
+.md-header__button.md-logo,
+.md-logo {
+    padding: 0;
+    margin: 0;
+}
+.md-header__button.md-logo {
+    width: 12.1rem;
+}
+/* center top Logo */
+/* .md-header__button img  {
+    display: block;
+    margin: 0 auto;
+} */
+
+.md-header__topic{
+    padding: 0 30px;
     background-color: var(--md-primary-fg-color--light); 
 }
 
-.md-header__button.md-logo img,
-.md-header__button.md-logo svg {
-    height: 5em;
-    width: auto;
-    object-fit: cover;
+.md-header__topic *,
+.md-search {
+    display: flex;
+    align-items: center;
+}
+
+.md-header .md-logo img,
+.md-footer .md-logo img {
+    margin-top: 22px;
+    height: 36px;
+    width: 125px;
+    object-fit: fill;
 }
 
+.md-search * {
+    height: 44px;
+}
+/* header mobile view */
 .md-nav__title .md-nav__button.md-logo img {
-    width: 100%;
+    height: 36px;
+    width: 125px;
+}
+
+.md-header__button.md-icon {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+@media screen and (min-width: 76.25rem) {
+    .md-header__button.md-icon {
+        display: none;
+    }
+}
+@media screen and (min-width: 60rem) {
+    .md-header__button.md-icon {
+        display: none;
+    }
 }
+/* main */
 
-.md-footer-meta__inner.md-grid {
+/* footer */
+.md-footer * {
     justify-content: flex-start;
     align-items: center;
+    flex-direction: column;
+}
+
+@media screen and (min-width: 40rem) {
+    .md-footer * {
+        flex-direction: row;
+    }
+}
+
+.md-footer-logo {
+    flex-grow: 2;
 }
 
 .footer-item {
-    margin: 0 1em;
+    margin: 0 30px 0 0;
 }
 
 .md-footer {
     background-color: var(--md-primary-fg-color);
-}
-
-.md-footer-logo img{
-    height: 5vh;
-    width: auto;
-    margin: 0.5em 0;
-    object-fit: cover;
 }
\ No newline at end of file