mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-11-08 23:58:13 +08:00
BREAKING CHANGE: The `legacy` property and support for the legacy syntax, which involved placing an `ion-checkbox` inside of an `ion-item` with an `ion-label`, have been removed from checkbox. For more information on migrating from the legacy checkbox syntax, refer to the [Checkbox documentation](https://ionicframework.com/docs/api/checkbox#migrating-from-legacy-checkbox-syntax).
41 lines
1.6 KiB
SCSS
41 lines
1.6 KiB
SCSS
@import "../../themes/ionic.globals.md";
|
|
@import "../item/item.md.vars";
|
|
|
|
// Material Design Checkbox
|
|
// --------------------------------------------------
|
|
|
|
/// @prop - Opacity of the disabled checkbox label
|
|
$checkbox-md-disabled-opacity: $form-control-md-disabled-opacity !default;
|
|
|
|
/// @prop - Background color of the checkbox icon when off
|
|
$checkbox-md-icon-background-color-off: $item-md-background !default;
|
|
|
|
/// @prop - Size of the checkbox icon
|
|
/// The icon size does not use dynamic font
|
|
/// because it does not scale in native.
|
|
$checkbox-md-icon-size: 18px !default;
|
|
|
|
/// @prop - Border width of the checkbox icon
|
|
$checkbox-md-icon-border-width: 2px !default;
|
|
|
|
/// @prop - Border style of the checkbox icon
|
|
$checkbox-md-icon-border-style: solid !default;
|
|
|
|
/// @prop - Border color of the checkbox icon when off
|
|
$checkbox-md-icon-border-color-off: rgb($text-color-rgb, 0.60) !default;
|
|
|
|
/// @prop - Transition duration of the checkbox
|
|
$checkbox-md-transition-duration: 180ms !default;
|
|
|
|
/// @prop - Transition easing of the checkbox
|
|
$checkbox-md-transition-easing: cubic-bezier(.4, 0, .2, 1) !default;
|
|
|
|
/// @prop - Opacity of the disabled checkbox
|
|
/// This value is used because the checkbox color is set to
|
|
/// `rgb(0, 0, 0, 0.60)` when enabled and we need it to be
|
|
/// `rgb(0, 0, 0, 0.38)` when disabled but the disabled
|
|
/// opacity is applied on top of the transparent color so
|
|
/// this opacity gets us the equivalent of applying `0.38`
|
|
/// on top of an opaque checkbox `rgb(0, 0, 0, 1.0)`
|
|
$checkbox-md-icon-disabled-opacity: 0.63 !default;
|