123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109 |
- @use '../../styles/tools'
- @use './variables' as *
- @include tools.layer('components')
- // Block
- .v-toolbar
- align-items: flex-start
- display: flex
- flex: $toolbar-flex
- flex-direction: column
- justify-content: space-between
- max-width: 100%
- position: relative
- transition: $toolbar-transition
- transition-property: height, width, transform, max-width, left, right, top, bottom, box-shadow
- width: 100%
- @include tools.border($toolbar-border...)
- @include tools.elevation($toolbar-elevation)
- @include tools.rounded($toolbar-border-radius)
- @include tools.theme($toolbar-theme...)
- &--absolute
- position: absolute
- &--collapse
- max-width: $toolbar-collapsed-max-width
- overflow: hidden
- border-end-end-radius: $toolbar-collapsed-border-radius
- .v-toolbar-title
- display: none
- &--flat
- @include tools.elevation($toolbar-flat-elevation)
- &--floating
- display: inline-flex
- &--rounded
- @include tools.rounded($toolbar-rounded-border-radius)
- .v-toolbar__content,
- .v-toolbar__extension
- align-items: center
- display: flex
- flex: 0 0 auto
- position: relative
- transition: inherit
- width: 100%
- .v-toolbar__content
- overflow: hidden
- > .v-btn:first-child
- margin-inline-start: $toolbar-prepend-btn-margin-start
- > .v-btn:last-child
- margin-inline-end: $toolbar-append-btn-margin-end
- > .v-toolbar-title
- margin-inline-start: $toolbar-title-margin
- .v-toolbar--density-prominent &
- align-items: flex-start
- .v-toolbar__image
- display: flex
- opacity: var(--v-toolbar-image-opacity, 1)
- transition-property: opacity
- @include tools.absolute()
- .v-toolbar__prepend,
- .v-toolbar__append
- align-items: center
- align-self: stretch
- display: flex
- .v-toolbar__prepend
- margin-inline: $toolbar-prepend-btn-margin-start auto
- .v-toolbar__append
- margin-inline: auto $toolbar-append-btn-margin-end
- .v-toolbar-title
- flex: 1 1
- font-size: $toolbar-title-font-size
- min-width: 0
- @include tools.typography($toolbar-title-typography...)
- .v-toolbar--density-prominent &
- align-self: flex-end
- padding-bottom: 6px
- @include tools.typography($toolbar-prominent-title-typography...)
- .v-toolbar-title__placeholder
- overflow: hidden
- text-overflow: ellipsis
- white-space: nowrap
- .v-toolbar-items
- display: flex
- height: inherit
- align-self: stretch
- > .v-btn
- border-radius: 0
|