54 lines
1.2 KiB
Sass
54 lines
1.2 KiB
Sass
|
@use 'sass:math'
|
||
|
|
@use 'sass:selector'
|
||
|
|
@use '../../styles/settings'
|
||
|
|
@use '../../styles/tools'
|
||
|
|
@use './variables' as *
|
||
|
|
|
||
|
|
.v-textarea
|
||
|
|
.v-field
|
||
|
|
--v-textarea-control-height: var(--v-input-control-height)
|
||
|
|
|
||
|
|
.v-field__field
|
||
|
|
--v-input-control-height: var(--v-textarea-control-height)
|
||
|
|
|
||
|
|
.v-field__input
|
||
|
|
$a: calc((var(--v-field-padding-top, 0) + var(--v-input-padding-top, 0)) - 6px)
|
||
|
|
$b: calc(var(--v-field-padding-top, 0) + var(--v-input-padding-top, 0) + 4px)
|
||
|
|
|
||
|
|
flex: 1 1 auto
|
||
|
|
outline: none
|
||
|
|
-webkit-mask-image: linear-gradient(to bottom, transparent, transparent $a, black $b)
|
||
|
|
mask-image: linear-gradient(to bottom, transparent, transparent $a, black $b)
|
||
|
|
|
||
|
|
&.v-textarea__sizer
|
||
|
|
visibility: hidden
|
||
|
|
position: absolute
|
||
|
|
top: 0
|
||
|
|
left: 0
|
||
|
|
height: 0 !important
|
||
|
|
min-height: 0 !important
|
||
|
|
pointer-events: none
|
||
|
|
|
||
|
|
&--no-resize
|
||
|
|
.v-field__input
|
||
|
|
resize: none
|
||
|
|
|
||
|
|
.v-field--no-label,
|
||
|
|
.v-field--active
|
||
|
|
textarea
|
||
|
|
opacity: 1
|
||
|
|
|
||
|
|
textarea
|
||
|
|
opacity: 0
|
||
|
|
flex: 1
|
||
|
|
min-width: 0
|
||
|
|
transition: .15s opacity settings.$standard-easing
|
||
|
|
|
||
|
|
&:focus,
|
||
|
|
&:active
|
||
|
|
outline: none
|
||
|
|
|
||
|
|
// Remove Firefox red outline
|
||
|
|
&:invalid
|
||
|
|
box-shadow: none
|