UX: follow-up search fixes for welcome banner (#32776)

awesomerobot · web-flow · commit de2159cd8a78 · 2025-05-16T15:34:59.000-04:00
follow-up to 6169ac2 this fixes a spacing regression in the welcome banner search results before: ![image](https://github.com/user-attachments/assets/3175feb9-b75b-4019-9df0-002faa73f204) after: ![image](https://github.com/user-attachments/assets/82c3c90e-7a0a-4c30-9cdc-a3a65e23ca27) before: ![image](https://github.com/user-attachments/assets/a44b7414-c9a2-453d-96cc-a50af234e8fe) after: ![image](https://github.com/user-attachments/assets/88e27a1c-b873-4e52-bab2-1eda84323565)
diff --git a/app/assets/stylesheets/common/base/search-menu.scss b/app/assets/stylesheets/common/base/search-menu.scss
@@ -11,19 +11,19 @@
   border-top: 1px solid var(--primary-low);
 }
 
-.search-menu.glimmer-search-menu {
+:root {
   --search-result-element-padding: 0.5em 1rem;
+}
 
-  .search-input-wrapper {
-    @include viewport.until(sm) {
-      position: fixed;
-      left: 1rem;
-      right: 0.35rem; // to compensate for cancel button padding
-      top: 0;
-      padding-block: 0.5em;
-      background-color: var(--secondary);
-      z-index: z("base");
-    }
+.search-menu.glimmer-search-menu .search-input-wrapper {
+  @include viewport.until(sm) {
+    position: fixed;
+    left: 1rem;
+    right: 0.35rem; // to compensate for cancel button padding
+    top: 0;
+    padding-block: 0.5em;
+    background-color: var(--secondary);
+    z-index: z("base");
   }
 }
 
@@ -40,7 +40,7 @@
 
     .search-menu-panel & {
       @include viewport.from(sm) {
-        padding: 0.75em 1rem 0.5em;
+        padding: 0.75em 1rem 0.25em;
       }
     }
   }
@@ -415,10 +415,14 @@
 }
 
 .search-random-quick-tip {
-  padding: 0 1rem max(0.75rem, 0.75em);
+  padding: max(0.75rem, 0.75em) 1rem;
   font-size: var(--font-down-2);
   color: var(--primary-medium);
 
+  .search-menu-panel & {
+    padding: 0.5rem 1rem max(0.75rem, 0.75em);
+  }
+
   .tip-label {
     background-color: rgba(var(--tertiary-rgb), 0.1);
     margin-right: 0.25em;
