fix: heading hierachy for the docs pages (#165)

* fix: heading hierachy for the docs pages

* fix: duplicate meta description

Author: ktx-krupa

mkdocs.yml

@@ -1,4 +1,4 @@
-site_name: Documentation
+site_name: OpenObserve Documentation
 site_url: https://openobserve.ai/docs
 # https://github.com/lukasgeiter/mkdocs-awesome-pages-plugin required for nav
 plugins:

overrides/css/landing-page.css

@@ -83,7 +83,7 @@ body > .landing-page {
 
 /* Heading styles */
 .landing-page h1 {
-  font-size: 20px !important;
+  font-size: 32px !important;
   font-weight: bold;
   margin: 0;
   line-height: 1.3;
@@ -176,6 +176,7 @@ body:has(.landing-page) .md-sidebar--secondary {
   margin-bottom: 12px;
   position: relative;
   overflow: hidden;
+  margin-top: 20px;
 }
 
 /* Dark theme hero card background */

overrides/main.html

@@ -2,12 +2,6 @@
 
 {% block extrahead %}
 {{ super() }}
-{% block htmltitle %}
-  <title>OpenObserve Documentation</title>
-{% endblock %}
-{% if page and page.meta and page.meta.description %}
-<meta name="description" content="{{ page.meta.description }}">
-{% endif %}
 
 <!-- Simple theme flash prevention -->
 <script>

overrides/partials/header.html

@@ -254,7 +254,7 @@
                     <div
                       class="flex items-center justify-between text-gray-500 text-base font-semibold w-full text-left toggle-btn"
                     >
-                      <h4>Platform</h4>
+                      <span>Platform</span>
                       <img
                         src="/docs/assets/submenu-icon.svg"
                         alt="Arrow"
@@ -265,9 +265,9 @@ <h4>Platform</h4>
                       <div
                         class="border rounded-md p-4 text-center flex flex-col space-y-2"
                       >
-                        <h3 class="font-medium text-xs text-black">
+                        <p class="font-medium text-xs text-black">
                           Full Stack Observability Platform
-                        </h3>
+                        </p>
                         <a
                           href="/platform/"
                           class="text-xs gradient-hover font-medium underline"
@@ -337,7 +337,7 @@ <h3 class="font-medium text-xs text-black">
                     <div
                       class="flex items-center justify-between text-gray-500 text-base font-semibold w-full text-left toggle-btn"
                     >
-                      <h4>Solutions</h4>
+                      <span>Solutions</span>
                       <img
                         src="/docs/assets/submenu-icon.svg"
                         alt="Arrow"
@@ -348,9 +348,9 @@ <h4>Solutions</h4>
                       <div
                         class="border rounded-md p-4 text-center flex flex-col space-y-2"
                       >
-                        <h3 class="font-medium text-xs text-black">
+                        <p class="font-medium text-xs text-black">
                           Full Stack Observability Solutions
-                        </h3>
+                        </p>
                         <a
                           href="/solutions/"
                           class="text-xs gradient-hover font-medium underline"
@@ -423,7 +423,7 @@ <h3 class="font-medium text-xs text-black">
                     <div
                       class="flex items-center justify-between text-gray-500 text-base font-semibold w-full text-left toggle-btn"
                     >
-                      <h4>Resources</h4>
+                      <span>Resources</span>
                       <img
                         src="/docs/assets/submenu-icon.svg"
                         alt="Arrow"
@@ -432,11 +432,11 @@ <h4>Resources</h4>
                     </div>
                     <div class="submenu hidden space-y-4 mt-2">
                       <div class="border rounded-md p-4 text-center">
-                        <h3
+                        <p
                           class="font-medium text-xs text-black flex flex-col space-y-2"
                         >
                           Full Stack Observability Resources
-                        </h3>
+                        </p>
                         <a
                           href="/resources/"
                           class="text-xs gradient-hover font-medium underline"

overrides/partials/index.html

@@ -6,6 +6,9 @@
   <div class="landing-container w-full mx-auto">
     <!-- Main Content -->
     <main class="landing-main-content">
+      <!-- Main Documentation Heading -->
+      <h1 class="">OpenObserve Documentation</h1>
+
       <!-- Hero Card -->
       <div class="landing-hero-card">
         <div class="landing-hero-content">