refactor(sass): replace all instances of bg in sass variables with ba…

…ckground references #5651
ionic-team · Mar 3, 2016 · 8db6a85 · 8db6a85
1 parent 374efde
commit 8db6a85
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 20 deletions.
diff --git a/ionic/components/button/button.ios.scss b/ionic/components/button/button.ios.scss
@@ -55,15 +55,15 @@ $button-ios-small-icon-font-size:     1.3em !default;
 @mixin ios-button-default($color-name, $color-value) {
 
   .button-#{$color-name} {
-    $bg-color: $color-value;
-    $bg-color-activated: color-shade($bg-color);
-    $fg-color: color-inverse($bg-color);
+    $background-color: $color-value;
+    $background-color-activated: color-shade($background-color);
+    $fg-color: color-inverse($background-color);
 
     color: $fg-color;
-    background-color: $bg-color;
+    background-color: $background-color;
 
     &.activated {
-      background-color: $bg-color-activated;
+      background-color: $background-color-activated;
     }
   }
 

diff --git a/ionic/components/button/button.md.scss b/ionic/components/button/button.md.scss
@@ -78,20 +78,20 @@ $button-md-small-icon-font-size:           1.4em !default;
 @mixin md-button-default($color-name, $color-value) {
 
   .button-#{$color-name} {
-    $bg-color: $color-value;
-    $bg-color-activated: color-shade($bg-color);
-    $fg-color: color-inverse($bg-color);
+    $background-color: $color-value;
+    $background-color-activated: color-shade($background-color);
+    $fg-color: color-inverse($background-color);
 
     color: $fg-color;
-    background-color: $bg-color;
+    background-color: $background-color;
 
     &:hover:not(.disable-hover) {
-      background-color: $bg-color;
+      background-color: $background-color;
     }
 
     &.activated {
       opacity: 1;
-      background-color: $bg-color-activated;
+      background-color: $background-color-activated;
     }
 
     ion-button-effect {

diff --git a/ionic/components/segment/segment.ios.scss b/ionic/components/segment/segment.ios.scss
@@ -4,10 +4,10 @@
 // iOS Segment
 // --------------------------------------------------
 
-$segment-button-ios-bg-color:                   transparent !default;
-$segment-button-ios-bg-color-activated:         $toolbar-ios-active-color !default;
+$segment-button-ios-background-color:                   transparent !default;
+$segment-button-ios-background-color-activated:         $toolbar-ios-active-color !default;
 
-$segment-button-ios-text-color:                 color-inverse($segment-button-ios-bg-color-activated) !default;
+$segment-button-ios-text-color:                 color-inverse($segment-button-ios-background-color-activated) !default;
 $segment-button-ios-activated-transition:       100ms all linear !default;
 $segment-button-ios-hover-transition:           100ms all linear !default;
 $segment-button-ios-active-transition:          100ms all linear !default;
@@ -37,10 +37,10 @@ $segment-button-ios-toolbar-icon-line-height:   2.4rem !default;
 
   border-width: $segment-button-ios-border-width;
   border-style: solid;
-  border-color: $segment-button-ios-bg-color-activated;
+  border-color: $segment-button-ios-background-color-activated;
 
-  color: $segment-button-ios-bg-color-activated;
-  background-color: $segment-button-ios-bg-color;
+  color: $segment-button-ios-background-color-activated;
+  background-color: $segment-button-ios-background-color;
 
   ion-icon {
     font-size: $segment-button-ios-icon-size;
@@ -50,17 +50,17 @@ $segment-button-ios-toolbar-icon-line-height:   2.4rem !default;
   &.segment-activated {
     opacity: 1;
     color: $segment-button-ios-text-color;
-    background-color: $segment-button-ios-bg-color-activated;
+    background-color: $segment-button-ios-background-color-activated;
     transition: $segment-button-ios-activated-transition;
   }
 
   &:hover:not(.segment-activated) {
-    background-color: rgba($segment-button-ios-bg-color-activated, $segment-button-ios-hover-opacity);
+    background-color: rgba($segment-button-ios-background-color-activated, $segment-button-ios-hover-opacity);
     transition: $segment-button-ios-hover-transition;
   }
 
   &:active:not(.segment-activated) {
-    background-color: rgba($segment-button-ios-bg-color-activated, $segment-button-ios-active-opacity);
+    background-color: rgba($segment-button-ios-background-color-activated, $segment-button-ios-active-opacity);
     transition: $segment-button-ios-active-transition;
   }