render custom tags in doc site

docs/css/extra.css

@@ -7,4 +7,19 @@
 .md-nav__item--active > .md-nav__link, /* Active top-level items */
 .md-nav__item--nested > .md-nav__link { /* Nested top-level items */
     font-weight: bold;
-}
+}
+
+.tags-list {
+    list-style: none;
+    padding: 0;
+  }
+
+  .tag {
+    display: inline-block;
+    background-color: #e0e0e0;
+    border-radius: 3px;
+    padding: 2px 8px;
+    margin: 2px;
+    font-size: 0.9em;
+    color: aqua;
+  }

docs/overrides/main.html

@@ -0,0 +1,14 @@
+{% extends "base.html" %}
+
+{% block content %}
+<div class="tags">
+  {% if page.meta.tags %}
+    <ul class="tags-list">
+      {% for tag in page.meta.tags %}
+        <li class="tag">{{ tag }}</li>
+      {% endfor %}
+    </ul>
+  {% endif %}
+</div>
+{{ super() }}
+{% endblock %}

mkdocs.yml

@@ -4,6 +4,7 @@ site_name: Operator Lifecycle Manager
 theme:
   logo: assets/logo.svg
   name: "material"
+  # custom_dir: overrides
   palette:
     primary: black
   features:
@@ -14,6 +15,9 @@ theme:
 
 repo_url: https://github.com/operator-framework/operator-controller
 
+plugins:
+  - awesome-pages
+
 extra_css:
   - css/extra.css
 

requirements.txt

@@ -33,3 +33,5 @@ six==1.16.0
 soupsieve==2.6
 urllib3==2.2.3
 watchdog==4.0.2
+mkdocs-awesome-pages-plugin==2.9.3
+