Fixes navbar

Author: karlcarstensen

docs-starlight/src/components/Header.astro

@@ -34,7 +34,7 @@ try {
 }
 ---
 
-<div class="sl-flex justify-between items-center px-5 xl:px-20">
+<div class="sl-flex justify-between items-center px-5 py-5 xl:px-20">
 	<!-- Logo -->
 	<a href="/" class="hover:cursor-pointer">
 		<Image
@@ -101,13 +101,6 @@ try {
 			<a href="#" class="hidden md:flex primary-button h-[43px]">
 				Support
 			</a>
-			<button class="menu-icon hover:cursor-pointer">
-				<div class="flex items-center">
-					<svg data-slot="icon" class="text-white w-6 h-6" fill="none" stroke-width="1.5" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
-						<path stroke-linecap="round" stroke-linejoin="round" d="M3.75 9h16.5m-16.5 6.75h16.5" />
-					</svg>
-				</div>
-			</button>
 			<a href="#" class="flex md:hidden primary-button !p-3">
 				<Image
 					src={HeadphonesIcon}
@@ -120,6 +113,7 @@ try {
 		</div>
 	</div>
 </div>
+
 <div class="block md:hidden justify-center bg-bg-dark px-5 py-2.5 border-b border-stroke-dark">
 	<div class="flex items-center">
 		{shouldRenderSearch && <Search {...Astro.props} />}

docs-starlight/src/components/dv-Navbar.astro

@@ -106,13 +106,6 @@ try {
                 <a href="https://www.gruntwork.io/services/terragrunt" class="hidden md:flex primary-button">
                     Enterprise Support
                 </a>
-                <button class="menu-icon hover:cursor-pointer">
-                    <div class="flex items-center">
-                        <svg data-slot="icon" class="text-white w-6 h-6" fill="none" stroke-width="1.5" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" d="M3.75 9h16.5m-16.5 6.75h16.5" />
-                        </svg>
-                    </div>
-                </button>
                 <a href="https://www.gruntwork.io/services/terragrunt" class="flex md:hidden primary-button !p-3">
                     <Image
                         src={HeadphonesIcon}

docs-starlight/src/styles/global.css

@@ -54,7 +54,7 @@
 
 /* Docs Dark mode colors. */
 :root {
-  --sl-nav-height: 87px;
+  --sl-nav-height: 96px;
   --sl-color-bg-nav: #0F1731;
   --sl-color-bg-sidebar: #0F1731;
   --sl-color-hairline-shade: #2E375A;
@@ -82,12 +82,15 @@
 	--sl-color-white: #ffffff;
 
   @media (width >= 768px) {
-    --sl-nav-height: 84px;
+    --sl-nav-height: 91px;
+  }
+  @media (width < 768px) {
+    --sl-nav-height: 148px;
   }
 }
 /* Docs Light mode colors. */
 :root[data-theme='light'] {
-  --sl-nav-height: 87px;
+  --sl-nav-height: 96px;
   --sl-color-bg-nav: #0F1731;
   --sl-color-bg-sidebar: #ffffff;
   --sl-color-bg: #ffffff;
@@ -118,13 +121,19 @@
   }
 }
 
-header {
-  display: flex;
+.header {
   flex-direction: column;
+  height: auto;
   justify-content: center;
   padding: 0 !important;
 }
 
+@media screen and (max-width: 767px) {
+  .main-frame {
+    padding-top: 196px;
+  }
+}
+
 .social-icon {
   color: var(--color-gray-1) !important;
   cursor: pointer;