sticky the header bar

tallstackui · Mar 25, 2024 · 11c16be · 11c16be
1 parent 8b41a4e
commit 11c16be
Showing 1 changed file with 2 additions and 2 deletions.
diff --git a/resources/views/components/layout/header.blade.php b/resources/views/components/layout/header.blade.php
@@ -1,4 +1,4 @@
-<header class="top-0 z-50 flex items-center justify-between bg-white px-4 py-5 shadow-md shadow-slate-900/5 dark:bg-dark-900 dark:shadow-none sm:px-6 lg:px-8">
+<header class="sticky top-0 z-50 flex items-center justify-between bg-white px-4 py-5 shadow-md shadow-slate-900/5 dark:bg-dark-900 dark:shadow-none sm:px-6 lg:px-8">
     <div class="hidden lg:block">
         <x-svg.banner class="h-8 w-10" />
     </div>
@@ -12,7 +12,7 @@ class="h-6 w-6 stroke-slate-500">
     </div>
     <div class="relative flex basis-0 items-center justify-end gap-4 md:flex-grow">
         <div id="docsearch" class="hidden"></div>
-        <x-icon x-on:click="document.querySelector('#docsearch').firstChild.click()" name="magnifying-glass" class="h-6 w-6 cursor-pointer text-gray-500 block lg:hidden" />
+        <x-icon x-on:click="document.querySelector('#docsearch').firstChild.click()" name="magnifying-glass" class="block h-6 w-6 cursor-pointer text-gray-500 lg:hidden" />
         <x-icon x-on:click="darkTheme = false" name="sun" class="h-6 w-6 cursor-pointer text-yellow-500" x-show="darkTheme" />
         <x-icon x-on:click="darkTheme = true" name="moon" class="h-6 w-6 cursor-pointer text-blue-500" x-show="!darkTheme" />
         <x-github repository />