}
}
-$switch-height: 1.25rem !default;
-$switch-height-half: ($switch-height / 2) !default;
-$switch-width: ($switch-height * 2) !default;
-$switch-border-radius: $switch-height !default;
-$switch-bg: $gray-300 !default;
-$switch-bg-height: 1rem !default;
-$switch-bg-height-half: ($switch-bg-height / 2) !default;
-$switch-checked-bg: rgba(map-get($theme-colors, 'primary'), .4) !default;
-$switch-checked-thumb-bg: map-get($theme-colors, 'primary') !default;
-$switch-disabled-bg: $gray-200 !default;
-$switch-disabled-color: $gray-600 !default;
-$switch-disabled-thumb-bg: $gray-600 !default;
-$switch-thumb-bg: $white !default;
-$switch-thumb-border-radius: 50% !default;
-$switch-thumb-size: $switch-height !default;
-$switch-thumb-size-half: $switch-height-half !default;
-$switch-focus-box-shadow: 0 0 0 ($input-btn-focus-width * 2) rgba(map-get($theme-colors, 'primary'), .25);
-$switch-transition: .2s all !default;
-
-.switch {
- position: relative;
- display: inline-block;
-
- input {
- float: left;
- width: 1px;
- transform: translateX(1px);
- padding: 0;
- margin: 0;
- opacity: 0;
- line-height: $switch-height;
-
- + label {
- position: relative;
- min-height: $switch-height;
- min-width: $switch-width;
- line-height: $switch-height;
- border-radius: $switch-border-radius;
- display: inline-block;
- cursor: pointer;
- outline: none;
- user-select: none;
- padding-left: ($switch-width + .5rem);
- }
-
- + label::before,
- + label::after {
- content: '';
- position: absolute;
- left: 0;
- bottom: 0;
- display: block;
- }
-
- + label::before {
- right: 0;
- height: $switch-bg-height;
- width: $switch-width;
- top: calc(50% - #{$switch-bg-height-half});
- background-color: $switch-bg;
- border-radius: $switch-border-radius;
- transition: $switch-transition;
- }
-
- + label::after {
- left: 0;
- width: $switch-thumb-size;
- height: $switch-thumb-size;
- top: calc(50% - #{$switch-thumb-size-half});
- border-radius: $switch-thumb-border-radius;
- background-color: $switch-thumb-bg;
- transition: $switch-transition;
- box-shadow:
- 0 1px 3px 0 rgba(0, 0, 0, 0.2),
- 0 1px 1px 0 rgba(0, 0, 0, 0.14),
- 0 2px 1px -1px rgba(0, 0, 0, 0.12);
- }
-
- &:checked + label::before {
- background-color: $switch-checked-bg;
- }
-
- &:checked + label::after {
- margin-left: $switch-height;
- background-color: $switch-checked-thumb-bg;
- }
-
- &:focus + label::before {
- outline: none;
- }
-
- &:focus + label::after {
- outline: none;
- box-shadow: $switch-focus-box-shadow;
- }
-
- &:disabled + label {
- color: $switch-disabled-color;
- cursor: not-allowed;
- }
-
- &:disabled + label::before {
- background-color: $switch-disabled-bg;
- }
-
- &:disabled + label::after {
- background-color: $switch-disabled-thumb-bg;
- }
- }
-
- &.sr-only-label {
- input + label {
- text-indent: -9999px;
- margin-bottom: 0;
- padding-left: 0;
- }
- }
-}
-
.paged-content-page-container {
min-height: 3.125rem;
}
