60 lines
1.2 KiB
Sass
60 lines
1.2 KiB
Sass
|
// Imports
|
||
|
|
@use '../../styles/settings'
|
||
|
|
@use '../../styles/tools'
|
||
|
|
@use './variables' as *
|
||
|
|
|
||
|
|
.v-otp-input
|
||
|
|
@include tools.rounded(4px)
|
||
|
|
|
||
|
|
align-items: center
|
||
|
|
display: flex
|
||
|
|
justify-content: center
|
||
|
|
padding: $otp-input-padding
|
||
|
|
position: relative
|
||
|
|
|
||
|
|
.v-field
|
||
|
|
height: 100%
|
||
|
|
|
||
|
|
.v-otp-input__divider
|
||
|
|
margin: $otp-input-divider-margin
|
||
|
|
|
||
|
|
.v-otp-input__content
|
||
|
|
align-items: center
|
||
|
|
display: flex
|
||
|
|
gap: $otp-input-content-gap
|
||
|
|
height: $otp-input-content-height
|
||
|
|
padding: $otp-input-content-padding
|
||
|
|
justify-content: center
|
||
|
|
max-width: $otp-input-content-max-width
|
||
|
|
position: relative
|
||
|
|
border-radius: inherit
|
||
|
|
|
||
|
|
.v-otp-input--divided &
|
||
|
|
max-width: $otp-input-divided-content-max-width
|
||
|
|
|
||
|
|
.v-otp-input__field
|
||
|
|
color: inherit
|
||
|
|
font-size: $otp-input-field-font-size
|
||
|
|
height: 100%
|
||
|
|
outline: none
|
||
|
|
text-align: center
|
||
|
|
width: 100%
|
||
|
|
|
||
|
|
&[type=number]::-webkit-outer-spin-button,
|
||
|
|
&[type=number]::-webkit-inner-spin-button
|
||
|
|
-webkit-appearance: none
|
||
|
|
margin: 0
|
||
|
|
|
||
|
|
&[type=number]
|
||
|
|
-moz-appearance: textfield
|
||
|
|
|
||
|
|
.v-otp-input__loader
|
||
|
|
align-items: center
|
||
|
|
display: flex
|
||
|
|
height: 100%
|
||
|
|
justify-content: center
|
||
|
|
width: 100%
|
||
|
|
|
||
|
|
.v-progress-linear
|
||
|
|
position: absolute
|