render custom tags in doc site

Author: anik120

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: docs/overrides
   palette:
     primary: black
   features:

requirements.txt

@@ -33,3 +33,4 @@ six==1.16.0
 soupsieve==2.6
 urllib3==2.2.3
 watchdog==4.0.2
+