170 lines
3.6 KiB
Sass
170 lines
3.6 KiB
Sass
|
@use '../../styles/tools'
|
||
|
@use '../../styles/settings'
|
||
|
@use './variables' as *
|
||
|
@use './mixins' as *
|
||
|
|
||
|
// Theme
|
||
|
.v-table
|
||
|
@include tools.theme($table-theme...)
|
||
|
|
||
|
font-size: $table-font-size
|
||
|
transition-duration: $table-transition-duration
|
||
|
transition-property: $table-transition-property
|
||
|
transition-timing-function: $table-transition-timing-function
|
||
|
|
||
|
.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
|
||
|
@include tools.absolute(true)
|
||
|
background: $table-hover-color
|
||
|
pointer-events: none
|
||
|
|
||
|
&.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
|