1 files changed, 32 insertions, 9 deletions

diff --git a/assets/stylesheets/bootstrap/_input-group.scss b/assets/stylesheets/bootstrap/_input-group.scss
index a1d16e3..9315051 100644
--- a/assets/stylesheets/bootstrap/_input-group.scss
+++ b/assets/stylesheets/bootstrap/_input-group.scss
@@ -14,7 +14,7 @@
     // Ensure that the input is always above the *appended* addon button for
     // proper border colors.
     position: relative;
-    z-index: 2;
+    z-index: 1;
     flex: 1 1 auto;
     // Add width 1% and flex-basis auto to ensure that button will not wrap out
     // the column. Applies to IE Edge+ and Firefox. Chrome does not require this.
@@ -23,27 +23,39 @@
 
     // Bring the "active" form control to the front
     @include hover-focus-active {
-      z-index: 3;
+      z-index: 2;
     }
   }
 }
 
 .input-group-addon,
 .input-group-btn,
-.input-group .form-control {
+.input-group .form-control,
+.input-group .custom-select,
+.input-group .custom-file {
   display: flex;
   align-items: center;
+
   &:not(:first-child):not(:last-child) {
     @include border-radius(0);
   }
 }
 
+.input-group .custom-file {
+  display: flex;
+  align-items: center;
+}
+
+.input-group .custom-select,
+.input-group .custom-file {
+  width: 100%;
+}
+
 .input-group-addon,
 .input-group-btn {
   white-space: nowrap;
 }
 
-
 // Sizing options
 //
 // Remix the default form control sizing classes into new ones for easier
@@ -103,6 +115,8 @@
 //
 
 .input-group .form-control:not(:last-child),
+.input-group .custom-select:not(:last-child),
+.input-group .custom-file:not(:last-child) .custom-file-control::before,
 .input-group-addon:not(:last-child),
 .input-group-btn:not(:last-child) > .btn,
 .input-group-btn:not(:last-child) > .btn-group > .btn,
@@ -111,10 +125,14 @@
 .input-group-btn:not(:first-child) > .btn-group:not(:last-child) > .btn {
   @include border-right-radius(0);
 }
+
 .input-group-addon:not(:last-child) {
   border-right: 0;
 }
+
 .input-group .form-control:not(:first-child),
+.input-group .custom-select:not(:first-child),
+.input-group .custom-file:not(:first-child) .custom-file-control,
 .input-group-addon:not(:first-child),
 .input-group-btn:not(:first-child) > .btn,
 .input-group-btn:not(:first-child) > .btn-group > .btn,
@@ -123,8 +141,13 @@
 .input-group-btn:not(:last-child) > .btn-group:not(:first-child) > .btn {
   @include border-left-radius(0);
 }
-.form-control + .input-group-addon:not(:first-child) {
-  border-left: 0;
+
+.form-control,
+.custom-select,
+.custom-file {
+  + .input-group-addon:not(:first-child) {
+    border-left: 0;
+  }
 }
 
 //
@@ -150,7 +173,7 @@
 
     // Bring the "active" button to the front
     @include hover-focus-active {
-      z-index: 3;
+      z-index: 2;
     }
   }
 
@@ -168,7 +191,7 @@
   &:not(:first-child) {
     > .btn,
     > .btn-group {
-      z-index: 2;
+      z-index: 1;
       // remove nagative margin ($input-btn-border-width) to solve overlapping issue with button.
       margin-left: 0;
 
@@ -179,7 +202,7 @@
 
       // Because specificity
       @include hover-focus-active {
-        z-index: 3;
+        z-index: 2;
       }
     }
   }