Merge pull request #27619 from suneox/fix/27365-help-search-can-not-s…

…croll-to-bottom style search result can scroll to bottom
Expensify · Sep 21, 2023 · b03a594 · b03a594
2 parents e7bcd7f + 2c0109b
commit b03a594
Showing 1 changed file with 13 additions and 6 deletions.
diff --git a/docs/_sass/_search-bar.scss b/docs/_sass/_search-bar.scss
@@ -23,14 +23,25 @@ $color-gray-label: $color-gray-label;
 #sidebar-search {
     background-color: $color-appBG;
     width: 375px;
-    height: 100vh;
     position: fixed;
-    display: block;
+    display: flex;
+    flex-direction: column;
+    bottom: 0;
     top: 0;
     right: 0;
     z-index: 2;
 }
 
+#sidebar-search > div:last-child {
+    flex-grow: 1;
+    overflow-y: auto;
+    -ms-overflow-style: none;
+    scrollbar-width: none;
+    &::-webkit-scrollbar {
+        display: none;
+    }
+}
+
 @media only screen and (max-width: $breakpoint-tablet) {
     #sidebar-search {
         width: 100%;
@@ -156,10 +167,6 @@ label.search-label {
     background-color: $color-appBG;
     border: $color-appBG;
     font-family: "ExpensifyNeue", "Helvetica Neue", "Helvetica", Arial, sans-serif !important;
-    max-height: 80vh;
-    overflow-y: scroll;
-    -ms-overflow-style: none;
-    scrollbar-width: none;
 }
 
 /* Hide the scrollbar */