fix: use gray on hover in button groups instead of primary (#60)

FLO-12070
flocasts · Nov 19, 2020 · c9869cd · c9869cd
1 parent f7e2b08
commit c9869cd
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 5 deletions.
diff --git a/_config.yml b/_config.yml
@@ -48,16 +48,16 @@ download:
 
 cdn:
   # See https://www.srihash.org for info on how to generate the hashes
-  css: 'sha384-bTuOyWFzvtzatBsqmXxShF1CAHyTzY4LiDCiZ5xdOi/Uq4W2ss8wllsHVHbNOd5P'
+  css: 'sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN'
   css_hash: sha384-hnvsmW4CEqIE9xpwdmvw+oyi2zalIdkqZJKT8ovyObj2fiPNSLt7xdsda4JGUfSf
-  js: 'sha384-bTuOyWFzvtzatBsqmXxShF1CAHyTzY4LiDCiZ5xdOi/Uq4W2ss8wllsHVHbNOd5P'
+  js: 'sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN'
   js_hash: sha384-1RkA5wjfeG5u+6ycZ90q+PMlafLBaMCHvGk6PlVrQmIuTvpdA9qupxwbnPf9QbHH
   js_bundle: >-
     https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.bundle.min.js
   js_bundle_hash: sha384-gEp0IQktG6BLXHMpPT1pxMSC8EKUA159uPI9c/AmIhedq/EvAEfBroQ5tsSOS1/A
-  jquery: 'sha384-bTuOyWFzvtzatBsqmXxShF1CAHyTzY4LiDCiZ5xdOi/Uq4W2ss8wllsHVHbNOd5P'
+  jquery: 'sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN'
   jquery_hash: sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n
-  popper: 'sha384-bTuOyWFzvtzatBsqmXxShF1CAHyTzY4LiDCiZ5xdOi/Uq4W2ss8wllsHVHbNOd5P'
+  popper: 'sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN'
   popper_hash: sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN
 
 toc:

diff --git a/scss/_button-group.scss b/scss/_button-group.scss
@@ -8,6 +8,11 @@ $btn-group-focus: 0 0 0 $btn-focus-width rgba(255, 20, 15, 0.2) !important;
   border: solid $btn-border-width $primary;
 }
 
+@mixin btn-outline-secondary-hover{
+  background-color: darken($gray-100, 5%);
+  border: solid $btn-border-width $gray-300;
+}
+
 @mixin btn-group-inactive {
   color: $gray-500;
   border-color: $gray-300;
@@ -60,7 +65,7 @@ $btn-group-focus: 0 0 0 $btn-focus-width rgba(255, 20, 15, 0.2) !important;
     &:hover,
     &.hover,
     &:hover:not([disabled]){
-      @include btn-outline-secondary-active;
+      @include btn-outline-secondary-hover;
     }
     &:active,
     &.active {