blob: 1d0cdfb5738677d238b599e29d5058b25f0faf22 [file] [log] [blame]
////
/// @group layout/table
////
/// Styling for table components.
@mixin os-table {
.v-table {
.v-label>img {
@if $os-img-size-override == true {
border-radius: $v-unit-size *0.5;
max-height: $v-unit-size;
}
}
img.v-icon {
@if $os-img-size-override == true {
max-height: $v-unit-size;
}
}
// 0 2px 3px rgba(0, 0, 0, 0.15)
}
.v-table-table {
//color: valo-font-color($os-background-color);
td {
border-top: 0px;
}
}
.v-table-body-wrapper {
border: 0px;
}
.v-table-body {
background-color: $os-color-contrast;
}
.v-table-cell-wrapper > .v-widget {
margin: inherit; // affects row height
}
.v-table-header {
font-size: $os-font-size;
.v-icon {
display: none;
}
}
.v-table-header-wrap {
border: 0px;
//background-image: none !important;
//background-color: $os-background-color;
//color: valo-font-color($os-background-color);
font-weight: bold;
border-top: $os-border;
border-bottom: $os-border;
.v-table-column-selector {
border: 0px;
width: auto !important;
right: 1px;
@include os-icon-font($content: '\f0c9',
$float: right);
}
}
.v-align-right > .v-table-cell-wrapper {
text-align: right !important;
}
.v-align-center >.v-table-cell-wrapper {
text-align: center !important;
}
.v-align-left > .v-table-cell-wrapper {
text-align: left !important;
}
[class*="rowheader"] {
background-color: rgba($os-highlight-color, 0.1);
}
/* FILTER */
.filters-wrap {
overflow: hidden;
background-color: $os-textfield-shade;
height: $v-unit-size;
div {
height: $v-unit-size;
}
}
.filters-panel {
width: 90000px;
overflow: hidden;
line-height: $os-line-height;
color: valo-font-color($os-light-contrast);
font-style: italic;
> div, > span, > input {
float: left !important;
}
.v.label, .filterplaceholder {
height: $v-unit-size - first($v-border); //first list element
border-bottom: $os-border;
}
.v-textfield {
@include os-textfield-filterspanel;
}
.datefilterpopup, .numberfilterpopup {
> .v-button {
@include os-button-filterspanel;
}
}
}
}
/// @param {number} $header-footer-height 0 if no header or footer
@mixin os-table-mod($height-mod: 0, $width-mod: 0, $has-caption: 0, $header-footer-height: 0) {
@if $width-mod > 0 {
.v-table-body-wrapper.v-scrollable, .v-table-header-wrap {
width: $width-mod * ($cash-field-width * 1.5) + ($v-layout-spacing-horizontal * ($width-mod - 1)) !important;
}
&.v-table.v-widget {
/* table: needed for proper scrollbar display when width is fixed */
width: auto !important;
}
}
@if $height-mod > 0 {
@if $has-caption == 1 {
.v-table-body-wrapper.v-scrollable {
height: ($height-mod * $cash-field-height - ($v-unit-size * $os-cash-zoom-factor) - ($header-footer-height) + (($height-mod - 1) * $v-layout-spacing-vertical)) - first-number($v-border) !important;
}
}
@else {
.v-table-body-wrapper.v-scrollable {
height: $height-mod * $cash-field-height - ($header-footer-height) + (($height-mod - 1) * $v-layout-spacing-vertical) !important;
}
}
&.v-table.v-widget {
/* table: needed for proper scrollbar display when height is fixed */
height: auto !important;
}
}
}