Fix searchbar overflowing at certain widths

rucio · Aug 13, 2024 · 92ad22d · 92ad22d
1 parent edc74c8
commit 92ad22d
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 8 deletions.
diff --git a/src/component-library/Pages/Layout/Searchbar.tsx b/src/component-library/Pages/Layout/Searchbar.tsx
@@ -67,7 +67,7 @@ const SearchDropdown = forwardRef(function SearchDropdown(
     return (
         <div
             className={twMerge(
-                "w-[50rem] flex flex-col p-2",
+                "w-[35rem] lg:w-[50rem] flex flex-col p-2",
                 "rounded-md border shadow-md",
                 isInputFocused ? "visible" : "invisible",
                 "absolute mt-2",

diff --git a/src/component-library/outputtailwind.css b/src/component-library/outputtailwind.css
@@ -933,8 +933,8 @@ html {
   width: 2rem;
 }
 
-.w-\[50rem\] {
-  width: 50rem;
+.w-\[35rem\] {
+  width: 35rem;
 }
 
 .w-fit {
@@ -2098,11 +2098,6 @@ html {
   --tw-ring-color: rgb(255 255 255 / var(--tw-ring-opacity));
 }
 
-.blur {
-  --tw-blur: blur(8px);
-  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
-}
-
 .filter {
   filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
 }
@@ -3219,6 +3214,10 @@ html {
     width: 24rem;
   }
 
+  .lg\:w-\[50rem\] {
+    width: 50rem;
+  }
+
   .lg\:grid-cols-2 {
     grid-template-columns: repeat(2, minmax(0, 1fr));
   }