123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899 |
- @use '../../styles/tools'
- @use './variables' as *
- @include tools.layer('components')
- .v-navigation-drawer
- -webkit-overflow-scrolling: $navigation-drawer-overflow-scrolling
- background: $navigation-drawer-background
- display: flex
- flex-direction: column
- height: $navigation-drawer-height
- max-width: 100%
- pointer-events: auto
- transition-duration: $navigation-drawer-transition-duration
- transition-property: $navigation-drawer-transition-property
- transition-timing-function: $navigation-drawer-transition-timing-function
- position: absolute
- @include tools.border($navigation-drawer-border...)
- @include tools.elevation($navigation-drawer-elevation)
- @include tools.rounded($navigation-drawer-border-radius)
- @include tools.theme($navigation-drawer-theme...)
- &--rounded
- @include tools.rounded($navigation-drawer-rounded-border-radius)
- &--top,
- &--bottom
- max-height: -webkit-fill-available
- overflow-y: auto
- &--top
- top: 0
- border-bottom-width: $navigation-drawer-border-thin-width
- &--bottom
- left: 0
- border-top-width: $navigation-drawer-border-thin-width
- &--left
- top: 0
- left: 0
- right: auto
- border-right-width: $navigation-drawer-border-thin-width
- &--right
- top: 0
- left: auto
- right: 0
- border-left-width: $navigation-drawer-border-thin-width
- &--floating
- border: none
- &--temporary.v-navigation-drawer--active
- @include tools.elevation($navigation-drawer-temporary-elevation)
- &--sticky
- height: auto
- transition: box-shadow, transform, visibility, width, height, left, right
- .v-list
- overflow: hidden
- .v-navigation-drawer__content
- flex: 0 1 auto
- height: $navigation-drawer-content-height
- max-width: 100%
- overflow-x: $navigation-drawer-content-overflow-x
- overflow-y: $navigation-drawer-content-overflow-y
- .v-navigation-drawer__img
- height: 100%
- left: 0
- position: absolute
- top: 0
- width: 100%
- z-index: -1
- // TODO: remove in v4
- img:not(.v-img__img)
- height: $navigation-drawer-img-height
- object-fit: $navigation-drawer-img-object-fit
- width: $navigation-drawer-img-width
- .v-navigation-drawer__scrim
- position: absolute
- top: 0
- left: 0
- width: 100%
- height: 100%
- background: black
- opacity: $navigation-drawer-scrim-opacity
- transition: opacity $navigation-drawer-transition-duration $navigation-drawer-transition-timing-function
- z-index: 1
- .v-navigation-drawer__prepend,
- .v-navigation-drawer__append
- flex: none
- overflow: hidden
|