fix: use flex to make the search tool selects line up.

crhallberg · Oct 25, 2024 · 86e8d7c · 86e8d7c
1 parent fa781c1
commit 86e8d7c
Show file tree

Hide file tree

Showing 10 changed files with 43 additions and 28 deletions.
diff --git a/config/vufind/searches.ini b/config/vufind/searches.ini
@@ -33,7 +33,7 @@ default_view         = list
 ; If you must support large page sizes, you may need to raise the PHP memory_limit
 ; and max_input_vars settings and/or adjust the Apache LimitRequestLine setting.
 default_limit        = 20
-;limit_options        = 10,20,40,60,80,100
+limit_options        = 10,20,40,60,80,100
 
 ; This setting allows to limit pagination of a search result as deep pagination
 ; costs a lot of performance and most users are not very likely to navigate

diff --git a/themes/bootprint3/css/compiled.css b/themes/bootprint3/css/compiled.css
diff --git a/themes/bootstrap3/css/compiled.css b/themes/bootstrap3/css/compiled.css
diff --git a/themes/bootstrap3/less/components/search.less b/themes/bootstrap3/less/components/search.less
@@ -102,11 +102,16 @@ header .container.navbar { margin-bottom: 0; }
 .search-result-limit {
   display: flex;
   gap: 0.5rem;
-}
-.search-sort label,
-.search-result-limit label {
-  white-space: nowrap;
-  line-height: @input-height-base;
+
+  label {
+    flex: none;
+    white-space: nowrap;
+    line-height: @input-height-base;
+  }
+
+  select.form-control {
+    flex: 1 1 0%;
+  }
 }
 
 .search-stats {

diff --git a/themes/bootstrap3/scss/components/search.scss b/themes/bootstrap3/scss/components/search.scss
@@ -102,11 +102,16 @@ header .container.navbar { margin-bottom: 0; }
 .search-result-limit {
   display: flex;
   gap: 0.5rem;
-}
-.search-sort label,
-.search-result-limit label {
-  white-space: nowrap;
-  line-height: $input-height-base;
+
+  label {
+    flex: none;
+    white-space: nowrap;
+    line-height: $input-height-base;
+  }
+
+  select.form-control {
+    flex: 1 1 0%;
+  }
 }
 
 .search-stats {

diff --git a/themes/bootstrap5/css/compiled.css b/themes/bootstrap5/css/compiled.css
diff --git a/themes/bootstrap5/scss/components/search.scss b/themes/bootstrap5/scss/components/search.scss
@@ -102,11 +102,16 @@ header .container.navbar { margin-bottom: 0; }
 .search-result-limit {
   display: flex;
   gap: 0.5rem;
-}
-.search-sort label,
-.search-result-limit label {
-  white-space: nowrap;
-  line-height: $input-height-base;
+
+  label {
+    flex: none;
+    white-space: nowrap;
+    line-height: $input-height-base;
+  }
+
+  select.form-control {
+    flex: 1 1 0%;
+  }
 }
 
 .search-stats {

diff --git a/themes/local_theme_example/css/compiled.css b/themes/local_theme_example/css/compiled.css
diff --git a/themes/sandal/css/compiled.css b/themes/sandal/css/compiled.css
diff --git a/themes/sandal5/css/compiled.css b/themes/sandal5/css/compiled.css