mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-18 19:21:34 +08:00
6e8bf4914f
Issue number: N/A --------- ## What is the current behavior? Currently, every Sass variable in Ionic has the `!default` flag added to the end. From the [Sass variables documentation](https://sass-lang.com/documentation/variables/): > Normally when you assign a value to a variable, if that variable already had a value, its old value is overwritten. But if you’re writing a Sass library, you might want to allow your users to configure your library’s variables before you use them to generate CSS. > > To make this possible, Sass provides the `!default` flag. This assigns a value to a variable only if that variable isn’t defined or its value is [null](https://sass-lang.com/documentation/values/null). Otherwise, the existing value will be used. In past versions of Ionic Framework, developers wrote Sass variables to rebuild Ionic Framework using their own values. In the latest versions of Ionic Framework, this is not possible. ## What is the new behavior? Removes the `!default` flag from all Sass variables. ## Does this introduce a breaking change? - [ ] Yes - [x] No ------- Co-authored-by: brandyscarney <brandyscarney@users.noreply.github.com>
31 lines
1.0 KiB
SCSS
31 lines
1.0 KiB
SCSS
@use "sass:math";
|
|
@import "../../themes/ionic.globals.ios";
|
|
@import "../item/item.ios.vars";
|
|
|
|
// iOS Checkbox
|
|
// --------------------------------------------------
|
|
|
|
/// @prop - Background color of the checkbox when off
|
|
$checkbox-ios-background-color-off: $item-ios-background;
|
|
|
|
/// @prop - Size of the checkbox icon
|
|
$checkbox-ios-icon-size: dynamic-font-max(22px, 2.538);
|
|
|
|
/// @prop - Border color of the checkbox icon when off
|
|
$checkbox-ios-icon-border-color-off: rgba($text-color-rgb, 0.23);
|
|
|
|
/// @prop - Border width of the checkbox icon
|
|
$checkbox-ios-icon-border-width: dynamic-font(2px);
|
|
|
|
/// @prop - Border style of the checkbox icon
|
|
$checkbox-ios-icon-border-style: solid;
|
|
|
|
/// @prop - Border radius of the checkbox icon
|
|
$checkbox-ios-icon-border-radius: 50%;
|
|
|
|
/// @prop - Opacity of the disabled checkbox
|
|
$checkbox-ios-disabled-opacity: $form-control-ios-disabled-opacity;
|
|
|
|
/// @prop - Checkmark width of the checkbox icon
|
|
$checkbox-ios-icon-checkmark-width: 1.5px;
|