| 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758 |
- @use '../../styles/tools'
- @use './variables' as *
- @include tools.layer('components')
- .v-bottom-navigation
- display: flex
- max-width: 100%
- overflow: hidden
- position: absolute
- transition: $bottom-navigation-transition
- @include tools.border($bottom-navigation-border...)
- @include tools.rounded($bottom-navigation-border-radius)
- @include tools.theme($bottom-navigation-theme...)
- &--active
- @include tools.elevation($bottom-navigation-elevation)
- .v-bottom-navigation__content
- display: flex
- flex: none
- font-size: $bottom-navigation-content-font-size
- justify-content: center
- transition: inherit
- width: 100%
- .v-bottom-navigation &
- > .v-btn
- font-size: inherit
- height: $bottom-navigation-height
- max-width: $bottom-navigation-max-width
- min-width: $bottom-navigation-min-width
- text-transform: $bottom-navigation-text-transform
- transition: inherit
- width: auto
- @include tools.rounded(0)
- .v-btn__content,
- .v-btn__icon
- transition: inherit
- .v-btn__icon
- font-size: $bottom-navigation-icon-font-size
- .v-bottom-navigation--grow &
- > .v-btn
- flex-grow: 1
- .v-bottom-navigation--shift &
- .v-btn
- &:not(.v-btn--selected)
- .v-btn__content > span
- transition: inherit
- opacity: 0
- .v-btn__content
- transform: $bottom-navigation-shift-icon-transform
|
