Redo the small custom select vars

— Sizing shorthand comes last
— Add height var and put it to use

diff --git a/scss/_custom-forms.scss b/scss/_custom-forms.scss
index fb1e59c57cbe06b3550f4e56316a77c5deb42447..1d3ce2f183818dccf0538402ebf80a03ae595460 100644 (file)
--- a/scss/_custom-forms.scss
+++ b/scss/_custom-forms.scss
@@ -176,14 +176,10 @@
 }
 
 .custom-select-sm {
+  height: $custom-select-height-sm;
   padding-top: $custom-select-padding-y;
   padding-bottom: $custom-select-padding-y;
-  font-size: $custom-select-sm-font-size;
-
-  // &:not([multiple]) {
-  //   height: 26px;
-  //   min-height: 26px;
-  // }
+  font-size: $custom-select-font-size-sm;
 }
 
 

diff --git a/scss/_variables.scss b/scss/_variables.scss
index d59d8fb21c737c571ec18e43bd10e8c124401b98..3ab37f9f5d33a86ac73de6320a37bbfb58f46051 100644 (file)
--- a/scss/_variables.scss
+++ b/scss/_variables.scss
@@ -492,7 +492,8 @@ $custom-select-border-radius: $border-radius !default;
 $custom-select-focus-border-color: lighten($brand-primary, 25%) !default;
 $custom-select-focus-box-shadow:   inset 0 1px 2px rgba($black, .075), 0 0 5px rgba($custom-select-focus-border-color, .5) !default;
 
-$custom-select-sm-font-size:  75% !default;
+$custom-select-font-size-sm:  75% !default;
+$custom-select-height-sm: $input-height-sm !default;
 
 $custom-file-height:           2.5rem !default;
 $custom-file-width:            14rem !default;