javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-22 05:21:52 +08:00
Code Issues Packages Projects Releases Wiki Activity

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

Browse Source 
references #5651
This commit is contained in:
Brandy Carney
2016-03-03 12:39:49 -05:00
parent 374efde03f
commit 8db6a855b8
3 changed files with 20 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
ionic/components/button/button.ios.scss
View File

@ -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;
}
}

12
ionic/components/button/button.md.scss
View File

@ -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 {

18
ionic/components/segment/segment.ios.scss
View File

@ -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;
}