123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687 |
- @use 'sass:selector'
- @use '../../styles/settings'
- @use '../../styles/tools'
- @use './variables' as *
- .v-switch
- .v-label
- padding-inline-start: $switch-label-margin-inline-start
- .v-switch__loader
- display: flex
- .v-progress-circular
- color: $switch-loader-color
- .v-switch__track,
- .v-switch__thumb
- background-color: currentColor
- transition: none
- .v-selection-control--error:not(.v-selection-control--disabled) &
- background-color: $switch-error-background-color
- .v-switch__thumb
- .v-selection-control--dirty &
- color: currentColor
- .v-switch__track
- border-radius: $switch-track-radius
- height: $switch-track-height
- opacity: $switch-track-opacity
- width: $switch-track-width
- cursor: pointer
- .v-switch--inset &
- border-radius: $switch-inset-track-border-radius
- height: $switch-inset-track-height
- width: $switch-inset-track-width
- .v-switch__thumb
- align-items: center
- border-radius: $switch-thumb-radius
- color: rgb(var(--v-theme-surface))
- display: flex
- height: $switch-thumb-height
- justify-content: center
- width: $switch-thumb-width
- pointer-events: none
- transition: $switch-control-input-transition
- @include tools.elevation($switch-thumb-elevation)
- .v-switch--inset &
- @include tools.elevation(0)
- .v-switch:not(.v-switch--loading) .v-icon ~ &
- display: none
- .v-switch--loading .v-selection-control__input > .v-icon
- display: none
- .v-switch
- $switch-thumb-transform: $switch-track-width * .5 - $switch-thumb-width * .5 + $switch-thumb-offset
- .v-selection-control
- min-height: var(--v-input-control-height)
- .v-selection-control__input
- border-radius: 50%
- transition: $switch-control-input-transition
- transform: translateX(-$switch-thumb-transform)
- position: absolute
- .v-selection-control--dirty
- .v-selection-control__input
- transform: translateX($switch-thumb-transform)
- &.v-switch--indeterminate
- .v-selection-control__input
- transform: scale(.8)
- .v-switch__thumb
- transform: scale(.75)
- box-shadow: none
- &.v-switch--inset
- .v-selection-control__wrapper
- width: auto
|