Makes the searchbar visible in iPhone widths (#725). (#732)

emory-libraries · Sep 29, 2022 · 5d83145 · 5d83145
1 parent c888619
commit 5d83145
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 0 deletions.
diff --git a/app/assets/stylesheets/lux/_navbar.scss b/app/assets/stylesheets/lux/_navbar.scss
@@ -44,6 +44,12 @@
   max-width: 1170px;
 }
 
+@media (max-width: 575px) {
+  nav.navbar {
+    padding-bottom: map-get($spacers, 3);
+  }
+}
+
 li.list-group-item > .nav-link {
   padding: map-get($spacers, 1) map-get($spacers, 3);
 }

diff --git a/app/assets/stylesheets/lux/_search_form.scss b/app/assets/stylesheets/lux/_search_form.scss
@@ -15,6 +15,35 @@ form.search-query-form {
   }
 }
 
+@media (max-width: 575px) {
+  .row.justify-content-between.branding-row {
+    margin-right: -30px;
+    margin-left: -30px;
+  }
+
+  .form-inline {
+    &.col-lg-8,
+    &.col-md-12,
+    &.col-sm-12
+    {
+      > .search-query-form > #search-fields {
+        > .dropdown.bootstrap-select {
+          min-width: 25%;
+          width: 30%;
+        }
+
+        > input#q {
+          width: 100%;
+        }
+
+        padding-left: 0;
+      }
+      padding-left: 0;
+      padding-bottom: 0;
+    }
+  }
+}
+
 .input-group {
   &.col-md-12 {
     padding-right: 0;