Use or create variables

3 files changed, 9 insertions, 8 deletions

diff --git a/app/assets/stylesheets/framework/buttons.scss b/app/assets/stylesheets/framework/buttons.scss
index 28d29950fcf..50aa170d24c 100644
--- a/app/assets/stylesheets/framework/buttons.scss
+++ b/app/assets/stylesheets/framework/buttons.scss
@@ -7,7 +7,7 @@
   &:focus,
   &:active {
     outline: none;
-    @include box-shadow(inset 0 0 4px rgba(0, 0, 0, 0.12));
+    @include box-shadow($gl-btn-active-background);
   }
 }
 
@@ -28,7 +28,7 @@
   }
 
   &:active {
-    @include box-shadow (inset 0 0 4px rgba(0, 0, 0, 0.12));
+    @include box-shadow ($gl-btn-active-background);
 
     background-color: $dark;
     border-color: $border-dark;
@@ -190,7 +190,7 @@
   }
 
   .active {
-    @include box-shadow(inset 0 0 4px rgba(0, 0, 0, 0.12));
+    @include box-shadow($gl-btn-active-background);
 
     border: 1px solid #c6cacf !important;
     background-color: #e4e7ed !important;
diff --git a/app/assets/stylesheets/framework/selects.scss b/app/assets/stylesheets/framework/selects.scss
index 1e74139849c..3d265879100 100644
--- a/app/assets/stylesheets/framework/selects.scss
+++ b/app/assets/stylesheets/framework/selects.scss
@@ -32,11 +32,10 @@
       margin-right: 15px;
     }
 
-
     &:hover {
       background-color: $gray-dark;
       border-color: $border-white-normal;
-      color: #313236;
+      color: $gl-text-color;
     }
   }
 }
@@ -61,7 +60,7 @@
 
 .select2-results li.select2-result-with-children > .select2-result-label {
   font-weight: 600;
-  color: #313236;
+  color: $gl-text-color;
 }
 
 .select2-container-active {
@@ -76,7 +75,7 @@
     outline: 0;
     background-image: none;
     background-color: $white-dark;
-    @include box-shadow (inset 0 0 4px rgba(0, 0, 0, 0.12));
+    @include box-shadow($gl-btn-active-gradient);
   }
 }
 
@@ -117,7 +116,7 @@
   &.select2-container-active .select2-choices,
   &.select2-dropdown-open .select2-choices {
     border-color: $border-white-normal;
-    @include box-shadow (inset 0 0 4px rgba(0, 0, 0, 0.12));
+    @include box-shadow($gl-btn-active-gradient);
   }
 }
 
diff --git a/app/assets/stylesheets/framework/variables.scss b/app/assets/stylesheets/framework/variables.scss
index 7ba97a4f007..04db0da73d1 100644
--- a/app/assets/stylesheets/framework/variables.scss
+++ b/app/assets/stylesheets/framework/variables.scss
@@ -101,6 +101,8 @@ $gl-success: $green-normal;
 $gl-info: $blue-normal;
 $gl-warning: $orange-normal;
 $gl-danger: $red-normal;
+$gl-btn-active-background: rgba(0, 0, 0, 0.12);
+$gl-btn-active-gradient: inset 0 0 4px $gl-btn-active-background;
 
 /*
  * Commit Diff Colors