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

chore(): checkbox use ion-checkbox scss

Browse Source
This commit is contained in:
Adam Bradley
2015-09-21 21:00:14 -05:00
parent 03d3899bce
commit 0f41aec2b6
5 changed files with 8 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
ionic/components/checkbox/checkbox.scss
View File

@ -3,12 +3,12 @@
// -------------------------------------------------- // --------------------------------------------------
.checkbox { ion-checkbox {
cursor: pointer; cursor: pointer;
@include user-select-none(); @include user-select-none();
} }
.checkbox[aria-disabled=true] { ion-checkbox[aria-disabled=true] {
pointer-events: none; pointer-events: none;
opacity: 0.5; opacity: 0.5;
color: $subdued-text-color; color: $subdued-text-color;

2
ionic/components/checkbox/checkbox.ts
View File

@ -34,7 +34,7 @@ import {IonicComponent, IonicView} from '../../config/annotations';
'id' 'id'
], ],
host: { host: {
'class': 'item', 'class': 'item no-activated',
'role': 'checkbox', 'role': 'checkbox',
'tappable': 'true', 'tappable': 'true',
'[attr.tab-index]': 'tabIndex', '[attr.tab-index]': 'tabIndex',

8
ionic/components/checkbox/modes/ios.scss
View File

@ -10,7 +10,7 @@ $checkbox-ios-border-color-on: color(primary) !default;
$checkbox-ios-checkmark-color-on: $background-color !default; $checkbox-ios-checkmark-color-on: $background-color !default;
.checkbox { ion-checkbox {
&[aria-checked=true] .checkbox-icon { &[aria-checked=true] .checkbox-icon {
background-color: $checkbox-ios-background-color-on; background-color: $checkbox-ios-background-color-on;
@ -30,10 +30,6 @@ $checkbox-ios-checkmark-color-on: $background-color !default;
transform: rotate(45deg); transform: rotate(45deg);
} }
&.item.activated {
background-color: inherit;
}
} }
.checkbox-icon { .checkbox-icon {
@ -51,7 +47,7 @@ $checkbox-ios-checkmark-color-on: $background-color !default;
@mixin checkbox-theme-ios($color-name, $bg-on) { @mixin checkbox-theme-ios($color-name, $bg-on) {
.checkbox[#{$color-name}][aria-checked=true] .checkbox-icon { ion-checkbox[#{$color-name}][aria-checked=true] .checkbox-icon {
background-color: $bg-on; background-color: $bg-on;
border-color: $bg-on; border-color: $bg-on;
} }

4
ionic/components/checkbox/modes/md.scss
View File

@ -12,7 +12,7 @@ $checkbox-md-border-color-on: color(primary) !default;
$checkbox-md-checkmark-color-on: $background-color !default; $checkbox-md-checkmark-color-on: $background-color !default;
.checkbox { ion-checkbox {
&[aria-checked=true] .checkbox-icon { &[aria-checked=true] .checkbox-icon {
background-color: $checkbox-md-background-color-on; background-color: $checkbox-md-background-color-on;
@ -49,7 +49,7 @@ $checkbox-md-checkmark-color-on: $background-color !default;
@mixin checkbox-theme-md($color-name, $bg-on) { @mixin checkbox-theme-md($color-name, $bg-on) {
.checkbox[#{$color-name}][aria-checked=true] .checkbox-icon { ion-checkbox[#{$color-name}][aria-checked=true] .checkbox-icon {
background-color: $bg-on; background-color: $bg-on;
border-color: $bg-on; border-color: $bg-on;
} }

2
ionic/components/item/modes/ios.scss
View File

@ -56,7 +56,7 @@ $item-ios-forward-icon-color: $item-ios-border-color !default;
left: 0; left: 0;
} }
&.activated { &.activated:not(.no-activated) {
background-color: $item-ios-activated-background-color; background-color: $item-ios-activated-background-color;
} }
} }