Update mkdocs version

.gitlab-ci.yml

@@ -16,9 +16,9 @@ workflow:
 variables:
   GIT_SUBMODULE_STRATEGY: recursive
   # If you update these, you may need to update the theme customisations
-  MKDOCS_VERSION: '1.2.3'
-  MATERIAL_VERSION: '8.2.7'
-  I18NSTATIC_VERSION: '0.31'
+  MKDOCS_VERSION: '1.4.3'
+  MATERIAL_VERSION: '9.1.19'
+  I18NSTATIC_VERSION: '0.56'
   OKD_SERVER: https://api.paas.okd.cern.ch
   RELEASE_NAME: mkdocs
 
@@ -36,7 +36,7 @@ variables:
 
 .common_functions: &common_functions |
   if [[ -z "${OKD_TOKEN}" || -z "${PROJECT}" ]]; then echo "Please make sure that OKD_TOKEN and PROJECT variables are set"; exit 1;fi
-  curl "https://get.helm.sh/helm-v3.6.3-linux-amd64.tar.gz" | tar xvz && cp ./linux-amd64/helm /usr/local/bin
+  curl "https://get.helm.sh/helm-v3.12.2-linux-amd64.tar.gz" | tar xvz && cp ./linux-amd64/helm /usr/local/bin
   # OKD_TOKEN must be created as one of the project CI/CD variables
   # This variable should hold a token of a ServiceAccount allowed to edit the OKD project (specified by $PROJECT variable)
   oc login --token="${OKD_TOKEN}" --server="${OKD_SERVER}"
@@ -45,7 +45,7 @@ variables:
   oc start-build "${RELEASE_NAME}-artifacts" --from-dir=public/
 
 Build static site content:
-  image: python:3.9-alpine
+  image: registry.cern.ch/docker.io/library/python:3.11-alpine
   stage: build-static-content
   script:
     - apk add --no-cache git subversion

docs/stylesheets/extra.css

@@ -80,6 +80,12 @@
   }
 }
 
+.md-nav__title {
+  background: unset !important;
+  box-shadow: unset !important;
+  color: white !important;
+}
+
 .md-header-nav__button.md-logo img {
   width: 1.5rem;
   height: 1.5rem;
@@ -192,4 +198,5 @@
 .news_date {
   margin-top: 3em !important;
   margin-bottom: -2em !important;
+  font-weight: bold !important;
 }

theme/partials/footer.html

@@ -25,17 +25,17 @@ Based on https://raw.githubusercontent.com/squidfunk/mkdocs-material/7.1.7/src/p
         <a
           href="{{ page.previous_page.url | url }}"
           class="md-footer__link md-footer__link--prev"
-          aria-label="{{ direction }}: {{ page.previous_page.title }}"
+          aria-label="{{ direction }}: {{ page.previous_page.title | e }}"
           rel="prev"
         >
           <div class="md-footer__button md-icon">
             {% include ".icons/material/arrow-left.svg" %}
           </div>
           <div class="md-footer__title">
+            <span class="md-footer__direction">
+              {{ direction }}
+            </span>
             <div class="md-ellipsis">
-              <span class="md-footer__direction">
-                {{ direction }}
-              </span>
               {{ page.previous_page.title }}
             </div>
           </div>
@@ -48,14 +48,14 @@ Based on https://raw.githubusercontent.com/squidfunk/mkdocs-material/7.1.7/src/p
         <a
           href="{{ page.next_page.url | url }}"
           class="md-footer__link md-footer__link--next"
-          aria-label="{{ direction }}: {{ page.next_page.title }}"
+          aria-label="{{ direction }}: {{ page.next_page.title | e }}"
           rel="next"
         >
           <div class="md-footer__title">
+            <span class="md-footer__direction">
+              {{ direction }}
+            </span>
             <div class="md-ellipsis">
-              <span class="md-footer__direction">
-                {{ direction }}
-              </span>
               {{ page.next_page.title }}
             </div>
           </div>

theme/partials/header.html

@@ -36,7 +36,7 @@
         </div>
         <div class="md-header__topic" data-md-component="header-topic">
           <span class="md-ellipsis">
-            {% if page and page.meta and page.meta.title %}
+            {% if page.meta and page.meta.title %}
               {{ page.meta.title }}
             {% else %}
               {{ page.title }}
@@ -47,48 +47,51 @@
     </div>
 
     <!-- Color palette -->
-    {% if not config.theme.palette is mapping %}
-      <form class="md-header__option" data-md-component="palette">
-        {% for option in config.theme.palette %}
-          {% set primary = option.primary | replace(" ", "-") | lower %}
-          {% set accent  = option.accent  | replace(" ", "-") | lower %}
-          <input
-            class="md-option"
-            data-md-color-media="{{ option.media }}"
-            data-md-color-scheme="{{ option.scheme }}"
-            data-md-color-primary="{{ primary }}"
-            data-md-color-accent="{{ accent }}"
+    {% if config.theme.palette %}
+      {% if not config.theme.palette is mapping %}
+        <form class="md-header__option" data-md-component="palette">
+          {% for option in config.theme.palette %}
+            {% set scheme  = option.scheme  | d("default", true) %}
+            {% set primary = option.primary | d("indigo", true) %}
+            {% set accent  = option.accent  | d("indigo", true) %}
+            <input
+              class="md-option"
+              data-md-color-media="{{ option.media }}"
+              data-md-color-scheme="{{ scheme | replace(' ', '-') }}"
+              data-md-color-primary="{{ primary | replace(' ', '-') }}"
+              data-md-color-accent="{{ accent | replace(' ', '-') }}"
+              {% if option.toggle %}
+                aria-label="{{ option.toggle.name }}"
+              {% else  %}
+                aria-hidden="true"
+              {% endif %}
+              type="radio"
+              name="__palette"
+              id="__palette_{{ loop.index }}"
+            />
             {% if option.toggle %}
-              aria-label="{{ option.toggle.name }}"
-            {% else  %}
-              aria-hidden="true"
+              <label
+                class="md-header__button md-icon"
+                title="{{ option.toggle.name }}"
+                for="__palette_{{ loop.index0 or loop.length }}"
+                hidden
+              >
+                {% include ".icons/" ~ option.toggle.icon ~ ".svg" %}
+              </label>
             {% endif %}
-            type="radio"
-            name="__palette"
-            id="__palette_{{ loop.index }}"
-          />
-          {% if option.toggle %}
-            <label
-              class="md-header__button md-icon"
-              title="{{ option.toggle.name }}"
-              for="__palette_{{ loop.index0 or loop.length }}"
-              hidden
-            >
-              {% include ".icons/" ~ option.toggle.icon ~ ".svg" %}
-            </label>
-          {% endif %}
-        {% endfor %}
-      </form>
+          {% endfor %}
+        </form>
+      {% endif %}
     {% endif %}
 
     <!-- Site language selector -->
     {% if config.extra.alternate %}
-      <div class="md-header__option"></form>
+      <div class="md-header__option">
         <div class="md-select">
           {% set icon = config.theme.icon.alternate or "material/translate" %}
           <button
             class="md-header__button md-icon"
-            aria-label="{{ lang.t('select.language.title') }}"
+            aria-label="{{ lang.t('select.language') }}"
           >
             {% include ".icons/" ~ icon ~ ".svg" %}
           </button>
@@ -104,7 +107,7 @@
                     {{ alt.name }}
                   </a>
                 </li>
-                {% endfor %}
+              {% endfor %}
             </ul>
           </div>
         </div>
@@ -112,7 +115,7 @@
     {% endif %}
 
     <!-- Button to open search modal -->
-    {% if "search" in config["plugins"] %}
+    {% if "material/search" in config.plugins %}
       <label class="md-header__button md-icon" for="__search">
         {% include ".icons/material/magnify.svg" %}
       </label>