123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169 |
- @use '../../styles/tools'
- @use '../../styles/settings'
- @use './variables' as *
- @use './mixins' as *
- @include tools.layer('components')
- // Theme
- .v-table
- font-size: $table-font-size
- transition-duration: $table-transition-duration
- transition-property: $table-transition-property
- transition-timing-function: $table-transition-timing-function
- @include tools.theme($table-theme...)
- .v-table-divider
- border-right: $table-border
- .v-table__wrapper
- > table
- > thead
- > tr
- > th
- border-bottom: $table-border
- > tbody
- > tr
- &:not(:last-child)
- > td,
- > th
- border-bottom: $table-border
- > tfoot
- > tr
- > td,
- > th
- border-top: $table-border
- &.v-table--hover
- > .v-table__wrapper
- > table
- > tbody
- > tr
- > td
- position: relative
- &:hover > td::after
- background: $table-hover-color
- pointer-events: none
- @include tools.absolute(true)
- &.v-table--fixed-header
- > .v-table__wrapper
- > table
- > thead
- > tr
- > th
- background: $table-background
- box-shadow: inset 0 -1px 0 $table-border-color
- z-index: 1
- &.v-table--fixed-footer
- > tfoot
- > tr
- > th,
- > td
- background: $table-background
- box-shadow: inset 0 1px 0 $table-border-color
- // Block
- .v-table
- border-radius: inherit
- // Do not inherit line-height
- line-height: $table-line-height
- max-width: 100%
- display: flex
- flex-direction: column
- > .v-table__wrapper
- > table
- width: 100%
- border-spacing: 0
- > tbody,
- > thead,
- > tfoot
- > tr
- > td,
- > th
- padding: $table-column-padding
- transition-duration: $table-transition-duration
- transition-property: $table-transition-property
- transition-timing-function: $table-transition-timing-function
- > td
- height: var(--v-table-row-height)
- > th
- height: var(--v-table-header-height)
- font-weight: $table-header-font-weight
- user-select: none
- text-align: start
- @at-root
- @include tools.density('v-table', $table-density) using ($modifier)
- --v-table-header-height: #{$table-header-height + $modifier}
- --v-table-row-height: #{$table-row-height + $modifier}
- // Elements
- .v-table__wrapper
- border-radius: inherit
- overflow: auto
- flex: 1 1 auto
- // Modifiers
- .v-table--has-top
- > .v-table__wrapper
- > table
- > tbody
- > tr
- &:first-child
- &:hover
- > td
- &:first-child
- border-top-left-radius: 0
- &:last-child
- border-top-right-radius: 0
- .v-table--has-bottom
- > .v-table__wrapper
- > table
- > tbody
- > tr
- &:last-child
- &:hover
- > td
- &:first-child
- border-bottom-left-radius: 0
- &:last-child
- border-bottom-right-radius: 0
- .v-table--fixed-height
- > .v-table__wrapper
- overflow-y: auto
- .v-table--fixed-header
- > .v-table__wrapper
- > table
- > thead
- position: sticky
- top: 0
- z-index: 2
- > tr
- > th
- border-bottom: 0px !important
- .v-table--fixed-footer
- > .v-table__wrapper
- > table
- > tfoot
- > tr
- position: sticky
- bottom: 0
- z-index: 1
- > td,
- > th
- border-top: 0px !important
|