fix: mobile search cancel button layout

Close: #1377
HEIGE-PCloud · Dec 14, 2024 · 4c5c8e2 · 4c5c8e2
1 parent 160870e
commit 4c5c8e2
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 1 deletion.
diff --git a/assets/css/main.css b/assets/css/main.css
@@ -837,6 +837,11 @@ html.dark {
   height: 2.5rem;
 }
 
+.tw-h-fit {
+  height: -moz-fit-content;
+  height: fit-content;
+}
+
 .\!tw-max-h-0 {
   max-height: 0px !important;
 }

diff --git a/layouts/partials/header.html b/layouts/partials/header.html
@@ -146,7 +146,7 @@
                     <button class="search-button search-toggle tw-h-10" id="search-toggle-mobile" title="{{ T `search` }}">
                         {{ partial "plugin/fontawesome.html" (dict "Style" "solid" "Icon" "search") }}
                     </button>
-                    <button class="search-button search-clear" id="search-clear-mobile" title="{{ T `clear` }}">
+                    <button class="search-button search-clear tw-h-fit" id="search-clear-mobile" title="{{ T `clear` }}">
                         {{ partial "plugin/fontawesome.html" (dict "Style" "solid" "Icon" "times-circle") }}
                     </button>
                     <span class="search-button search-loading tw-animate-spin" id="search-loading-mobile">