72 lines
1.6 KiB
SCSS
72 lines
1.6 KiB
SCSS
|
@mixin grid() {
|
||
|
|
.esri-grid {
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
|
||
|
|
// Sets 'primary' color that other properties inherit from
|
||
|
|
--lumo-base-color: #{$background-color};
|
||
|
|
--lumo-primary-color: #{$button-color};
|
||
|
|
--lumo-primary-text-color: var(--lumo-primary-color);
|
||
|
|
|
||
|
|
// Uses shade of primary theme color for highlight
|
||
|
|
$row-selected-color: rgba($button-color, 0.2);
|
||
|
|
--lumo-primary-color-10pct: #{$row-selected-color};
|
||
|
|
|
||
|
|
// grid and checkbox background color(s) default and hover
|
||
|
|
--lumo-contrast-20pct: #{$interactive-font-color};
|
||
|
|
--lumo-contrast-30pct: #{$interactive-font-color--hover};
|
||
|
|
|
||
|
|
// grid border color(s)
|
||
|
|
--lumo-contrast-10pct: #{$background-color--hover};
|
||
|
|
|
||
|
|
// row hover
|
||
|
|
--lumo-row-background-hover: #{$background-color--hover};
|
||
|
|
|
||
|
|
.esri-grid__content {
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
background-color: inherit;
|
||
|
|
}
|
||
|
|
|
||
|
|
.esri-grid__grid {
|
||
|
|
height: 100%;
|
||
|
|
width: 100%;
|
||
|
|
|
||
|
|
a {
|
||
|
|
color: $interactive-font-color;
|
||
|
|
|
||
|
|
&:hover,
|
||
|
|
&:focus {
|
||
|
|
color: $interactive-font-color--hover;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.esri-column__sorter,
|
||
|
|
.esri-column__header-label {
|
||
|
|
align-items: center;
|
||
|
|
display: flex;
|
||
|
|
flex-grow: 1;
|
||
|
|
margin: 0 5px;
|
||
|
|
min-height: 28px;
|
||
|
|
overflow: auto;
|
||
|
|
}
|
||
|
|
|
||
|
|
.esri-column__menu-container {
|
||
|
|
display: inline-block;
|
||
|
|
margin: 0 5px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.esri-column__header-content {
|
||
|
|
align-items: center;
|
||
|
|
display: flex;
|
||
|
|
flex-grow: 1;
|
||
|
|
overflow: visible;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@if $include_Grid == true {
|
||
|
|
@include grid();
|
||
|
|
}
|