Make Knowledgebase -> KB on media breakpoint

Blargian · Feb 3, 2025 · 0114aed · 0114aed
1 parent 9daad77
commit 0114aed
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 3 deletions.
diff --git a/src/components/DocsCategoryDropdown/index.jsx b/src/components/DocsCategoryDropdown/index.jsx
@@ -90,7 +90,7 @@ function DocsCategoryDropdown({ dropdownCategory }) {
 export const DocsCategoryDropdownLinkOnly = ({ title, link }) => {
   return (
     <div className={styles.docsNavDropdownContainer}>
-      <Link href={link} className={styles.docsNavDropdownToolbarTopLevelLink}>{title}</Link>
+      <Link href={link} className={styles.docsNavDropdownToolbarTopLevelLink}><span>{title}</span></Link>
     </div>
   );
 }

diff --git a/src/css/custom.scss b/src/css/custom.scss
@@ -1264,3 +1264,16 @@ input::-ms-input-placeholder { /* Microsoft Edge */
     #437EEF;
   }
 }
+
+/* Fixes for the long menu bar */
+@media (max-width: 1103px) {
+
+  .docsNavDropdownContainer_cADf a[href="/docs/knowledgebase"]::before {
+    content: "KB";
+    display: inline-block;
+  }
+
+  .docsNavDropdownContainer_cADf a[href="/docs/knowledgebase"] span{
+    display: none;
+  }
+}
diff --git a/src/theme/Navbar/Content/index.js b/src/theme/Navbar/Content/index.js
@@ -40,7 +40,7 @@ function NavbarItems({ items }) {
 // TODO: Move this to a config file
 // Important note: The link is either the slug (iff one is set) or the file path.
 const dropdownCategories = [{
-  title: 'Getting Started',
+  title: 'Get Started',
   description: 'Learn how to use ClickHouse',
   sidebar: 'docs',
   link: '/docs',
@@ -122,7 +122,7 @@ const dropdownCategories = [{
     ]
   },
   {
-    title: 'Managing Data',
+    title: 'Manage Data',
     description: 'How to manage data in ClickHouse',
     sidebar: 'managingData',
     link: '/docs/en/updating-data',