73 lines
1.6 KiB
Sass
73 lines
1.6 KiB
Sass
@use 'sass:selector'
|
|
@use '../../styles/tools'
|
|
@use './variables' as *
|
|
|
|
@include tools.layer('components')
|
|
.v-number-input
|
|
$root: &
|
|
$control-root: #{selector.append($root, '__control')}
|
|
|
|
input[type="number"]
|
|
-moz-appearance: textfield
|
|
|
|
&::-webkit-outer-spin-button,
|
|
&::-webkit-inner-spin-button
|
|
-webkit-appearance: none
|
|
|
|
.v-field
|
|
&:has(.v-field__prepend-inner > .v-number-input__control:first-child)
|
|
padding-inline-start: 0
|
|
|
|
&:has(.v-field__append-inner > .v-number-input__control:last-child)
|
|
padding-inline-end: 0
|
|
|
|
.v-field__prepend-inner:has(.v-number-input__control)
|
|
> .v-icon
|
|
margin-inline-end: 4px
|
|
|
|
> hr + .v-icon,
|
|
> .v-number-input__control + .v-icon
|
|
margin-inline: 8px 0
|
|
|
|
.v-field__append-inner:has(.v-number-input__control)
|
|
> .v-icon
|
|
margin-inline-start: 4px
|
|
|
|
> .v-icon:has(+ hr),
|
|
> .v-icon:has(+ .v-number-input__control)
|
|
margin-inline: 0 8px
|
|
|
|
.v-field__clearable:has(+ .v-field__append-inner > hr:first-child)
|
|
margin-inline-end: 8px
|
|
|
|
&--inset
|
|
.v-divider
|
|
height: $number-input-inset-divider-size
|
|
width: $number-input-inset-divider-size
|
|
align-self: center
|
|
|
|
&--split
|
|
.v-field__input
|
|
text-align: center
|
|
|
|
&--stacked
|
|
#{$control-root}
|
|
flex-direction: column-reverse
|
|
.v-btn
|
|
flex: 1
|
|
|
|
&--hide-input
|
|
.v-field
|
|
flex: none
|
|
&__input
|
|
width: 0
|
|
padding-inline: 0
|
|
|
|
&__control
|
|
display: flex
|
|
height: 100%
|
|
|
|
.v-btn
|
|
background-color: transparent
|
|
border-radius: 0
|