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

refactor(sass): tweaks to the alpha css variables (#14223)

Browse Source 
* alpha tweaks

* added alpha-input
cleanup for theme-builder

* removed global variables

* style(searchbar): fix indentation

closes #14196
This commit is contained in:
Ross Gerbasi
2018-03-30 09:27:58 -05:00
committed by Brandy Carney
parent 7887550166
commit 6c6f867ce4
39 changed files with 729 additions and 695 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
core/src/components/segment-button/segment-button.ios.scss
View File

@ -117,11 +117,11 @@ ion-segment-button {
color: $color-base;
&:hover:not(.segment-activated) {
background-color: ion-color($colors-ios, $color-name, base, ios, $alpha-ios-hover);
background-color: ion-color($colors-ios, $color-name, base, ios, $segment-button-ios-background-color-alpha-hover);
}
&:active:not(.segment-activated) {
background-color: ion-color($colors-ios, $color-name, base, ios, $alpha-ios-activated);
background-color: ion-color($colors-ios, $color-name, base, ios, $segment-button-ios-background-color-alpha-active);
}
&.segment-activated {
@ -131,7 +131,7 @@ ion-segment-button {
}
.segment-button-disabled {
color: ion-color($colors-ios, $color-name, base, ios, $alpha-ios-disabled);
color: ion-color($colors-ios, $color-name, base, ios, $segment-button-ios-background-color-alpha-disabled);
}
}
}

15
core/src/components/segment-button/segment-button.ios.vars.scss
View File

@ -9,14 +9,23 @@ $segment-button-ios-background-color: transparent !default;
/// @prop - Background of the activated segment button
$segment-button-ios-background-color-activated: ion-color($colors-ios, primary, base, ios) !default;
/// @prop - Background alpha of the activated segment button
$segment-button-ios-background-color-alpha-hover: .1 !default;
/// @prop - Background of the segment button when hovered
$segment-button-ios-background-color-hover: ion-color($colors-ios, primary, base, ios, $alpha-ios-hover) !default;
$segment-button-ios-background-color-hover: ion-color($colors-ios, primary, base, ios, $segment-button-ios-background-color-alpha-hover) !default;
/// @prop - Background alpha of the segment button when hovered
$segment-button-ios-background-color-alpha-active: .1 !default;
/// @prop - Background of the segment button when active
$segment-button-ios-background-color-active: ion-color($colors-ios, primary, base, ios, $alpha-ios-activated) !default;
$segment-button-ios-background-color-active: ion-color($colors-ios, primary, base, ios, $segment-button-ios-background-color-alpha-active) !default;
/// @prop - Background alpha of the segment button when active
$segment-button-ios-background-color-alpha-disabled: .5 !default;
/// @prop - Background of the activated segment button when active
$segment-button-ios-background-color-disabled: ion-color($colors-ios, primary, base, ios, $alpha-ios-disabled) !default;
$segment-button-ios-background-color-disabled: ion-color($colors-ios, primary, base, ios, $segment-button-ios-background-color-alpha-disabled) !default;
/// @prop - Text color of the segment button
$segment-button-ios-text-color: ion-color($colors-ios, primary, contrast, ios) !default;