| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183 |
- @import "../../themes/ionic.globals.wp";
-
- // Windows Radio
- // --------------------------------------------------
-
- /// @prop - Color of the checked radio
- $radio-wp-color-on: color($colors-wp, primary) !default;
-
- /// @prop - Color of the unchecked radio
- $radio-wp-color-off: #333 !default;
-
- /// @prop - Order of the radio (places to the left of the item)
- $radio-wp-order: -1 !default;
-
- /// @prop - Width of the radio icon
- $radio-wp-icon-width: 16px !default;
-
- /// @prop - Height of the radio icon
- $radio-wp-icon-height: 16px !default;
-
- /// @prop - Border width of the radio icon
- $radio-wp-icon-border-width: 2px !default;
-
- /// @prop - Border style of the radio icon
- $radio-wp-icon-border-style: solid !default;
-
- /// @prop - Border radius of the radio icon
- $radio-wp-icon-border-radius: 50% !default;
-
- /// @prop - Opacity of the disabled radio
- $radio-wp-disabled-opacity: .3 !default;
-
- // deprecated
- $radio-wp-item-left-margin: null !default;
-
- /// @prop - Margin top of the item-start in a radio
- $radio-wp-item-start-margin-top: 9px !default;
-
- /// @prop - Margin end of the item-start in a radio
- $radio-wp-item-start-margin-end: 20px !default;
-
- /// @prop - Margin bottom of the item-start in a radio
- $radio-wp-item-start-margin-bottom: 9px !default;
-
- /// @prop - Margin start of the item-start in a radio
- $radio-wp-item-start-margin-start: 4px !default;
-
- // deprecated
- $radio-wp-item-right-margin: null !default;
-
- /// @prop - Margin top of the item-end in a radio
- $radio-wp-item-end-margin-top: 11px !default;
-
- /// @prop - Margin end of the item-end in a radio
- $radio-wp-item-end-margin-end: 10px !default;
-
- /// @prop - Margin bottom of the item-end in a radio
- $radio-wp-item-end-margin-bottom: 10px !default;
-
- /// @prop - Margin start of the item-end in a radio
- $radio-wp-item-end-margin-start: 0 !default;
-
-
- .radio-wp {
- position: relative;
- display: inline-block;
- }
-
-
- // Windows Radio Outer Circle: Unchecked
- // -----------------------------------------
-
- .radio-wp .radio-icon {
- @include position(0, null, null, 0);
- @include margin(0);
- @include border-radius($radio-wp-icon-border-radius);
-
- position: relative;
-
- display: block;
-
- width: $radio-wp-icon-width;
- height: $radio-wp-icon-height;
-
- border-width: $radio-wp-icon-border-width;
- border-style: $radio-wp-icon-border-style;
- border-color: $radio-wp-color-off;
- }
-
-
- // Windows Radio Inner Circle: Unchecked
- // -----------------------------------------
-
- .radio-wp .radio-inner {
- @include position($radio-wp-icon-border-width, null, null, $radio-wp-icon-border-width);
- @include border-radius(50%);
-
- position: absolute;
-
- display: none;
-
- width: $radio-wp-icon-width / 2;
- height: $radio-wp-icon-height / 2;
-
- background-color: $radio-wp-color-off;
- }
-
-
- // Windows Radio Outer Circle: Checked
- // -----------------------------------------
-
- .radio-wp .radio-checked {
- border-color: $radio-wp-color-on;
- }
-
-
- // Windows Radio Inner Circle: Checked
- // -----------------------------------------
-
- .radio-wp .radio-checked .radio-inner {
- // transform: scale3d(1, 1, 1);
- display: block;
- }
-
-
- // Windows Radio: Disabled
- // -----------------------------------------
-
- .radio-wp.radio-disabled,
- .item-wp.item-radio-disabled ion-label {
- opacity: $radio-wp-disabled-opacity;
-
- pointer-events: none;
- }
-
-
- // Windows Radio Within An Item
- // -----------------------------------------
-
- .item-wp .radio-wp {
- position: static;
- display: block;
-
- order: $radio-wp-order;
-
- @include deprecated-variable(margin, $radio-wp-item-left-margin) {
- @include margin($radio-wp-item-start-margin-top, $radio-wp-item-start-margin-end, $radio-wp-item-start-margin-bottom, $radio-wp-item-start-margin-start);
- }
-
- &[item-right], // deprecated
- &[item-end] {
- order: 0;
-
- @include deprecated-variable(margin, $radio-wp-item-right-margin) {
- @include margin($radio-wp-item-end-margin-top, $radio-wp-item-end-margin-end, $radio-wp-item-end-margin-bottom, $radio-wp-item-end-margin-start);
- }
- }
- }
-
- .item-radio.item-wp ion-label {
- @include margin-horizontal(0, null);
- }
-
-
- // Windows Radio Color Mixin
- // --------------------------------------------------
-
- @mixin radio-theme-wp($color-name, $color-base) {
-
- .radio-wp-#{$color-name} .radio-checked {
- border-color: $color-base;
- }
-
- }
-
-
- // Generate Windows Radio Colors
- // --------------------------------------------------
-
- @each $color-name, $color-base, $color-contrast in get-colors($colors-wp) {
- @include radio-theme-wp($color-name, $color-base);
- }
|