Light theme for the documentation page (#931)

* light theme for docs, wip

* several switchers, fixes

* format

* fix

* sooner apllication of user's theme

* dark theme by default

qdrant-landing/themes/qdrant-2024/layouts/partials/customer-stories.html

@@ -42,7 +42,10 @@
           </div>
         </div>
       </div>
-      <p class="core-features__subtitle mx-auto">{{ .Params.wall.intro_text }} <a class="link" target="_blank" href="{{ .Params.wall.url }}">{{ .Params.wall.url_text }}</a></p>
+      <p class="core-features__subtitle mx-auto">
+        {{ .Params.wall.intro_text }}
+        <a class="link" target="_blank" href="{{ .Params.wall.url }}">{{ .Params.wall.url_text }}</a>
+      </p>
     </div>
   </section>
 {{ end }}

qdrant-landing/themes/qdrant-2024/layouts/partials/documentation.html

@@ -1,4 +1,4 @@
-<section class="documentation">
+<section class="documentation documentation_theme-light">
   <div class="documentation__container">
     <div class="row gx-4">
       {{ partial "docs-menu" . }}

qdrant-landing/themes/qdrant-2024/layouts/partials/js-head.html

@@ -30,3 +30,8 @@
   {{ $filterChartJs := resources.Get "/js/benchmarks/benchmarks_filtered_search.js" | minify | resources.Fingerprint "sha512" }}
   <script src="{{ $filterChartJs.RelPermalink }}"></script>
 {{ end }}
+
+{{ if eq .Section "documentation" }}
+  {{ $documentationJs := resources.Get "/js/documentation.js" | js.Build | minify | resources.Fingerprint "sha512" }}
+  <script src="{{ $documentationJs.RelPermalink }}"></script>
+{{ end }}

qdrant-landing/themes/qdrant-2024/layouts/partials/js.html

@@ -115,25 +115,16 @@
   <script src="{{ $anchorJs.RelPermalink }}"></script>
 {{ end }}
 
-{{ if eq .Section "documentation" }}
-  <script>
-    document.getElementById('sidebar-toggle').addEventListener('click', () => {
-      document.getElementById('sidebar-toggle').classList.toggle('active');
-      document.getElementById('sidebar').classList.toggle('active');
-    });
-  </script>
-{{ end }}
-
 {{ if or (eq .Section "blog") (eq .Section "documentation") }}
-<script>
-  document.addEventListener('keydown', function(event) {
-    if ((event.metaKey || event.ctrlKey) && event.key === 'k') {
+  <script>
+    document.addEventListener('keydown', function (event) {
+      if ((event.metaKey || event.ctrlKey) && event.key === 'k') {
         event.preventDefault();
 
         let searchButton = document.querySelector('[data-target="#searchModal"]');
 
         if (searchButton) searchButton?.click();
-    }
-  });
-</script>
+      }
+    });
+  </script>
 {{ end }}

qdrant-landing/themes/qdrant-2024/layouts/partials/menu.html

@@ -1,9 +1,18 @@
+{{ $section := .Section }}
 {{ with (.Site.GetPage "/headless/menu") }}
   <div class="main-menu z-2">
     <a href="/">
       {{ partial "logo.html" . }}
     </a>
-    <button type="button" class="main-menu__trigger">{{ partial "svg" "hamburger-menu-white.svg" }}</button>
+
+    <div class="d-flex justify-content-end align-items-center gap-4">
+      {{ if eq $section "documentation" }}
+        <div class="d-block d-xl-none">
+          {{ partial "theme-switch" . }}
+        </div>
+      {{ end }}
+      <button type="button" class="main-menu__trigger">{{ partial "svg" "hamburger-menu-white.svg" }}</button>
+    </div>
     <ul class="main-menu__links">
       {{ range .Params.menuItems }}
         <li class="main-menu__item">
@@ -39,6 +48,9 @@
       {{ end }}
     </ul>
     <div class="main-menu__buttons">
+      {{ if eq $section "documentation" }}
+        {{ partial "theme-switch" . }}
+      {{ end }}
       <a href="{{ .Params.logIn.url }}" class="menu-link mx-3">{{ .Params.logIn.text }}</a>
       <a href="{{ .Params.startFree.url }}" class="button button_contained button_sm">{{ .Params.startFree.text }}</a>
     </div>

qdrant-landing/themes/qdrant-2024/layouts/partials/table-of-contents.html

@@ -1,19 +1,19 @@
 <div class="col-12 col-xl-2">
   {{ if gt (.TableOfContents | len) 34 }}
-    <div class="table-contents">
-      <h2 class="table-contents__title">{{ .Params.title }}</h2>
+    <div class="table-of-contents">
+      <h2 class="table-of-contents__title">{{ .Params.title }}</h2>
 
       {{ .TableOfContents }}
 
 
-      <ul class="table-contents__external-links">
-        <li class="table-contents__link">
+      <ul class="table-of-contents__external-links">
+        <li class="table-of-contents__link">
           <a href="{{ .Site.Params.githubDocPrefix }}{{ path.Clean .File.Path }}" target="_blank">
             {{ partial "svg" "github-red.svg" }}
             Edit on Github
           </a>
         </li>
-        <li class="table-contents__link">
+        <li class="table-of-contents__link">
           <a href="{{ .Site.Params.githubIssueLink }}" target="_blank">
             {{ partial "svg" "bug-red.svg" }}
             Create an issue

qdrant-landing/themes/qdrant-2024/layouts/partials/theme-switch.html

@@ -0,0 +1 @@
+<button role="button" class="theme-switch"></button>