fix the case where selects were covered when using floating labels

js/src/bootstrapMaterialDesign.js

@@ -59,21 +59,21 @@ const BootstrapMaterialDesign = (($) => {
     checkboxInline: {
       selector: 'label.checkbox-inline > input[type=checkbox]'
     },
-    switch: {
-      selector: '.switch > label > input[type=checkbox]'
-    },
     radio: {
       selector: '.radio > label > input[type=radio]'
     },
     radioInline: {
       selector: 'label.radio-inline > input[type=radio]'
     },
-    textarea: {
-      selector: ['textarea']
-    },
     select: {
       selector: ['select']
     },
+    switch: {
+      selector: '.switch > label > input[type=checkbox]'
+    },
+    textarea: {
+      selector: ['textarea']
+    },
     autofill: {
       selector: 'body'
     },

js/src/select.js

@@ -31,6 +31,9 @@ const Select = (($) => {
 
     constructor($element, config) {
       super($element, $.extend(true, {invalidComponentMatches: [Checkbox, File, Radio, Switch, Text, Textarea]}, Default, config))
+
+      // floating labels will cover the options, so trigger them to be above (if used)
+      this.addIsFilled()
     }
 
     dispose() {