From d9d1532d9d931162cf935bd838c6094ee4c6e986 Mon Sep 17 00:00:00 2001
From: Rushan <rushenn@minio.io>
Date: Wed, 13 Nov 2024 19:29:04 +0400
Subject: [PATCH] Update docs menu to accommodate lengthy content (#1367)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

…ntent.
---
 source/_static/scss/includes/_temp.scss | 10 +++++++---
 source/_templates/header.html           |  4 ++--
 2 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/source/_static/scss/includes/_temp.scss b/source/_static/scss/includes/_temp.scss
index 521caf08..ede4660b 100644
--- a/source/_static/scss/includes/_temp.scss
+++ b/source/_static/scss/includes/_temp.scss
@@ -435,10 +435,13 @@
   margin-bottom: 5rem;
 }
 
+.docs-menu-wrapper {
+  text-align: center;
+}
+
 .docs-menu {
-  max-width: 650px;
+  display: inline-flex;
   margin: 0 auto;
-  width: 100%;
 
    & > a {
     display: flex;
@@ -446,7 +449,8 @@
     justify-content: center;
     color: $black;
     white-space: nowrap;
-    padding: 0 1.5rem;
+    padding: 0 2rem;
+    min-width: 7rem;
 
     &:hover {
       color: $theme-red;
diff --git a/source/_templates/header.html b/source/_templates/header.html
index 95e2ca47..ec01653a 100644
--- a/source/_templates/header.html
+++ b/source/_templates/header.html
@@ -28,8 +28,8 @@
   
       <h2 class="header__title hidden-rm">Documentation</h2>
 
-      <div class="overflow-x-auto hide-scrollbar mb-20">
-         <nav class="docs-menu bg-white/75 flex items-center rounded-lg font-heading border p-0.5 border-theme-neutral-subtle">
+      <div class="docs-menu-wrapper overflow-x-auto hide-scrollbar mb-20 text-center">
+         <nav class="docs-menu bg-white/75 inline-flex items-center rounded-lg font-heading border p-0.5 border-theme-neutral-subtle">
             {% for doc in docs %}
             {% set current_name = doc.name if doc.current == True %}
                <a target="{% if doc.external == True %}_blank{% endif %}" class="{% if doc.current == True %}active{% endif %} flex-1 rounded-md shrink-0 h-14 border border-transparent font-bold transition-all duration-300 hover:text-theme-red [&.active]:text-theme-red [&.active]:border-theme-red" href="{{ doc.url }}">