FIX: differentiate sk outline handling on single/multi (#9512)

FIX: differentiate sk outline handling on single/multi (#9512)

diff --git a/app/assets/javascripts/select-kit/components/select-kit.js b/app/assets/javascripts/select-kit/components/select-kit.js
index e0307c2..175559c 100644
--- a/app/assets/javascripts/select-kit/components/select-kit.js
+++ b/app/assets/javascripts/select-kit/components/select-kit.js
@@ -832,6 +832,8 @@ export default Component.extend(
           placementStrategy = inModal ? "fixed" : "absolute";
         }
 
+        const verticalOffset = this.multiSelect ? 0 : 2;
+
         /* global Popper:true */
         this.popper = Popper.createPopper(anchor, popper, {
           eventsEnabled: false,
@@ -841,7 +843,7 @@ export default Component.extend(
             {
               name: "offset",
               options: {
-                offset: [0, 2]
+                offset: [0, verticalOffset]
               }
             },
             {
@@ -853,7 +855,7 @@ export default Component.extend(
                   ".select-kit-wrapper"
                 );
                 if (wrapper) {
-                  let height = this.element.offsetHeight;
+                  let height = this.element.offsetHeight + verticalOffset;
 
                   const body = this.element.querySelector(".select-kit-body");
                   if (body) {
@@ -873,7 +875,8 @@ export default Component.extend(
                     this.element.classList.add("is-under");
                   }
 
-                  wrapper.style.width = `${this.element.offsetWidth}px`;
+                  // - 1 accounts for any rounding error
+                  wrapper.style.width = `${this.element.offsetWidth - 1}px`;
                   wrapper.style.height = `${height}px`;
                 }
               }
diff --git a/app/assets/stylesheets/common/select-kit/multi-select.scss b/app/assets/stylesheets/common/select-kit/multi-select.scss
index e1ee384..65d9d29 100644
--- a/app/assets/stylesheets/common/select-kit/multi-select.scss
+++ b/app/assets/stylesheets/common/select-kit/multi-select.scss
@@ -53,6 +53,7 @@
       .multi-select-header {
         border-radius: 0;
         box-shadow: none;
+        outline: none;
       }
 
       .select-kit-body {
diff --git a/app/assets/stylesheets/common/select-kit/select-kit.scss b/app/assets/stylesheets/common/select-kit/select-kit.scss
index 627325e..65a2125 100644
--- a/app/assets/stylesheets/common/select-kit/select-kit.scss
+++ b/app/assets/stylesheets/common/select-kit/select-kit.scss
@@ -34,10 +34,6 @@
       box-sizing: border-box;
       width: 100%;
     }
-
-    .select-kit-header {
-      outline: 1px solid $tertiary;
-    }
   }
 
   &.is-loading {
diff --git a/app/assets/stylesheets/common/select-kit/single-select.scss b/app/assets/stylesheets/common/select-kit/single-select.scss
index 4868756..f77def2 100644
--- a/app/assets/stylesheets/common/select-kit/single-select.scss
+++ b/app/assets/stylesheets/common/select-kit/single-select.scss
@@ -8,4 +8,10 @@
       border-bottom: 1px solid $primary-low;
     }
   }
+
+  &.is-expanded {
+    .select-kit-header {
+      outline: 1px solid $tertiary;
+    }
+  }
 }

GitHub sha: 4889dbde

This commit appears in #9512 which was merged by jjaffeux.