javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-20 12:29:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(segment): adds global variable for targeting segment in toolbar (#16344)

Browse Source 
adds the following variables

```
--ion-toolbar-color-unchecked
--ion-toolbar-color-checked
```
This commit is contained in:
Brandy Carney
2018-11-16 13:19:01 -05:00
committed by GitHub
parent ac3e065b3e
commit 10971cc3ca
8 changed files with 54 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -12,7 +12,7 @@
--border-color: #{$segment-button-ios-border-color};
--color: #{$segment-button-ios-text-color};
--color-activated: var(--color);
--color-checked: #{ion-color(primary, contrast)};
--color-checked: #{$segment-button-ios-text-color-checked};
--color-disabled: #{ion-color(primary, base, $segment-button-ios-opacity-disabled)};
--color-checked-disabled: #{ion-color(primary, contrast, $segment-button-ios-opacity-disabled)};
--border-radius: #{$segment-button-ios-border-radius};

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

@ -30,6 +30,9 @@ $segment-button-ios-background-color-disabled: ion-color(primary, base, $
/// @prop - Text color of the segment button
$segment-button-ios-text-color: ion-color(primary, base) !default;
/// @prop - Text color of the checked segment button
$segment-button-ios-text-color-checked: ion-color(primary, contrast) !default;
/// @prop - Border width of the segment button
$segment-button-ios-border-width: 1px !default;

2
core/src/components/segment-button/segment-button.md.scss
View File

@ -15,7 +15,7 @@
--background-activated: #{$segment-button-md-background-activated};
--color: #{$segment-button-md-text-color};
--color-activated: var(--color);
--color-checked: #{$segment-button-md-text-color-activated};
--color-checked: #{$segment-button-md-text-color-checked};
--color-checked-disabled: var(--color-checked);
--indicator-color: transparent;
--indicator-color-checked: var(--color-checked);

2
core/src/components/segment-button/segment-button.md.vars.scss
View File

@ -25,7 +25,7 @@ $segment-button-md-border-bottom-width: 2px !default;
$segment-button-md-border-bottom-color: transparent !default;
/// @prop - Text color of the activated segment button
$segment-button-md-text-color-activated: ion-color(primary, base) !default;
$segment-button-md-text-color-checked: ion-color(primary, base) !default;
/// @prop - Border color of the activated segment button
$segment-button-md-border-bottom-color-activated: ion-color(primary, base) !default;