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

fix(checkbox): get css variable customization working better

Browse Source 
also fixes a bug where transition wasn’t working
This commit is contained in:
Brandy Carney
2018-07-23 17:16:16 -04:00
parent c3b5dc77ff
commit 3e7aa4be83
4 changed files with 107 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
core/src/components/checkbox/checkbox.md.scss
View File

@ -6,11 +6,15 @@
:host {
--size: #{$checkbox-md-icon-size};
// Border
--border-radius: calc(var(--size) * .125);
--border-width: #{$checkbox-md-icon-border-width};
--border-style: #{$checkbox-md-icon-border-style};
--unchecked-border-color: #{$checkbox-md-icon-border-color-off};
--unchecked-background: #{$checkbox-md-icon-background-color-off};
--border-color: #{$checkbox-md-icon-border-color-off};
// Background
--background: #{$checkbox-md-icon-background-color-off};
--transition: #{background $checkbox-md-transition-duration $checkbox-md-transition-easing};
}
@ -18,11 +22,7 @@
// -----------------------------------------
:host(.checkbox-checked) .checkbox-inner {
@include position(
calc(var(--size) * .05),
null, null,
calc(var(--size) * .3)
);
@include position(calc(var(--size) * .05), null, null, calc(var(--size) * .3));
position: absolute;