mirror of
https://github.com/dbeaver/cloudbeaver.git
synced 2026-09-24 16:04:36 +08:00
* dbeaver/pro#7626 bumps yarn locks * updates globals * bumps subscript major version * bumps react-data-grid * fixes react-data-grid checksum * bumps yarn.lock * reverts 'true' & 'false' literals for ObjectPropertyInfo * reverts subscript to ver v9 due to poor v10 library support (it is not working api) --------- Co-authored-by: mr-anton-t <42037741+mr-anton-t@users.noreply.github.com>
425 lines
9.9 KiB
CSS
425 lines
9.9 KiB
CSS
@layer rdg {
|
|
@layer Defaults,
|
|
FocusSink,
|
|
CheckboxInput,
|
|
CheckboxIcon,
|
|
CheckboxLabel,
|
|
Cell,
|
|
HeaderCell,
|
|
SummaryCell,
|
|
EditCell,
|
|
Row,
|
|
HeaderRow,
|
|
SummaryRow,
|
|
GroupedRow,
|
|
Root;
|
|
}
|
|
|
|
.rdg-7-0-0-beta-59-fa71d63e {
|
|
@layer rdg.MeasuringCell {
|
|
contain: strict;
|
|
grid-row: 1;
|
|
visibility: hidden;
|
|
}
|
|
}
|
|
.rdg-7-0-0-beta-59-85c48527 {
|
|
@layer rdg.Cell {
|
|
/* max-content does not work with size containment
|
|
* dynamically switching between different containment styles incurs a heavy relayout penalty
|
|
* Chromium bug: at odd zoom levels or subpixel positioning,
|
|
* layout/paint/style containment can make cell borders disappear
|
|
* https://issues.chromium.org/issues/40840864
|
|
*/
|
|
position: relative; /* needed for absolute positioning to work */
|
|
padding-block: 0;
|
|
padding-inline: 8px;
|
|
border-inline-end: var(--rdg-border-width) solid var(--rdg-border-color);
|
|
border-block-end: var(--rdg-border-width) solid var(--rdg-border-color);
|
|
grid-row-start: var(--rdg-grid-row-start);
|
|
align-content: center;
|
|
background-color: inherit;
|
|
|
|
white-space: nowrap;
|
|
overflow: clip;
|
|
text-overflow: ellipsis;
|
|
outline: none;
|
|
|
|
&[aria-selected='true'] {
|
|
outline: var(--rdg-selection-width) solid var(--rdg-selection-color);
|
|
outline-offset: calc(var(--rdg-selection-width) * -1);
|
|
}
|
|
}
|
|
}
|
|
|
|
.rdg-7-0-0-beta-59-17a9a6d4 {
|
|
@layer rdg.Cell {
|
|
position: sticky;
|
|
/* Should have a higher value than 0 to show up above unfrozen cells */
|
|
z-index: 1;
|
|
|
|
/* Add box-shadow on the last frozen cell */
|
|
&:nth-last-child(1 of &) {
|
|
box-shadow: var(--rdg-cell-frozen-box-shadow);
|
|
}
|
|
}
|
|
}
|
|
|
|
.rdg-7-0-0-beta-59-bfba19bc {
|
|
@layer rdg.DragHandle {
|
|
--rdg-drag-handle-size: 8px;
|
|
z-index: 0;
|
|
cursor: move;
|
|
inline-size: var(--rdg-drag-handle-size);
|
|
block-size: var(--rdg-drag-handle-size);
|
|
background-color: var(--rdg-selection-color);
|
|
place-self: end;
|
|
|
|
&:hover {
|
|
--rdg-drag-handle-size: 16px;
|
|
border: 2px solid var(--rdg-selection-color);
|
|
background-color: var(--rdg-background-color);
|
|
}
|
|
}
|
|
}
|
|
|
|
.rdg-7-0-0-beta-59-7abddb3e {
|
|
@layer rdg.DragHandle {
|
|
z-index: 1;
|
|
position: sticky;
|
|
}
|
|
}
|
|
.rdg-7-0-0-beta-59-3b807ead {
|
|
@layer rdg.CheckboxInput {
|
|
display: block;
|
|
margin: auto;
|
|
inline-size: 20px;
|
|
block-size: 20px;
|
|
|
|
&:focus-visible {
|
|
outline: 2px solid var(--rdg-checkbox-focus-color);
|
|
outline-offset: -3px;
|
|
}
|
|
|
|
&:enabled {
|
|
cursor: pointer;
|
|
}
|
|
}
|
|
}
|
|
.rdg-7-0-0-beta-59-07919382 {
|
|
@layer rdg.GroupCellContent {
|
|
outline: none;
|
|
}
|
|
}
|
|
|
|
.rdg-7-0-0-beta-59-02a50147 {
|
|
@layer rdg.GroupCellCaret {
|
|
margin-inline-start: 4px;
|
|
stroke: currentColor;
|
|
stroke-width: 1.5px;
|
|
fill: transparent;
|
|
vertical-align: middle;
|
|
|
|
> path {
|
|
transition: d 0.1s;
|
|
}
|
|
}
|
|
}
|
|
.rdg-7-0-0-beta-59-56a248e4 {
|
|
@layer rdg.SortableHeaderCell {
|
|
display: flex;
|
|
}
|
|
}
|
|
|
|
.rdg-7-0-0-beta-59-7fad8c83 {
|
|
@layer rdg.SortableHeaderCellName {
|
|
flex-grow: 1;
|
|
overflow: clip;
|
|
text-overflow: ellipsis;
|
|
}
|
|
}
|
|
.rdg-7-0-0-beta-59-35ccb4c8 {
|
|
@layer rdg.Cell {
|
|
background-color: #ccccff;
|
|
}
|
|
}
|
|
.rdg-7-0-0-beta-59-46f9ea88 {
|
|
@layer rdg.EditCell {
|
|
padding: 0;
|
|
}
|
|
}
|
|
.rdg-7-0-0-beta-59-0dbd5994 {
|
|
@layer rdg.HeaderRow {
|
|
display: contents;
|
|
background-color: var(--rdg-header-background-color);
|
|
font-weight: bold;
|
|
|
|
& > .rdg-7-0-0-beta-59-85c48527 {
|
|
/* Should have a higher value than 1 to show up above regular cells and the focus sink */
|
|
z-index: 2;
|
|
position: sticky;
|
|
}
|
|
|
|
& > .rdg-7-0-0-beta-59-17a9a6d4 {
|
|
z-index: 3;
|
|
}
|
|
}
|
|
}
|
|
.rdg-7-0-0-beta-59-2a7e240d {
|
|
@layer rdg.HeaderCell {
|
|
cursor: pointer;
|
|
}
|
|
}
|
|
|
|
.rdg-7-0-0-beta-59-1893dc0f {
|
|
@layer rdg.HeaderCell {
|
|
touch-action: none;
|
|
}
|
|
}
|
|
|
|
.rdg-7-0-0-beta-59-4e60db91 {
|
|
@layer rdg.HeaderCell {
|
|
cursor: col-resize;
|
|
position: absolute;
|
|
inset-block-start: 0;
|
|
inset-inline-end: 0;
|
|
inset-block-end: 0;
|
|
inline-size: 10px;
|
|
}
|
|
}
|
|
|
|
.rdg-7-0-0-beta-59-3e1a4ad4 {
|
|
@layer rdg.HeaderCell {
|
|
background-color: var(--rdg-header-draggable-background-color);
|
|
}
|
|
}
|
|
|
|
.rdg-7-0-0-beta-59-51abd8b8 {
|
|
@layer rdg.HeaderCell {
|
|
background-color: var(--rdg-header-draggable-background-color);
|
|
}
|
|
}
|
|
|
|
.rdg-7-0-0-beta-59-c8d7aa64 {
|
|
@layer rdg.HeaderCell {
|
|
border-radius: 4px;
|
|
width: fit-content;
|
|
outline: 2px solid hsl(207, 100%, 50%);
|
|
outline-offset: -2px;
|
|
}
|
|
}
|
|
.rdg-7-0-0-beta-59-3c083f1b {
|
|
@layer rdg.Row {
|
|
display: contents;
|
|
background-color: var(--rdg-background-color);
|
|
|
|
&:hover {
|
|
background-color: var(--rdg-row-hover-background-color);
|
|
}
|
|
|
|
&[aria-selected='true'] {
|
|
background-color: var(--rdg-row-selected-background-color);
|
|
|
|
&:hover {
|
|
background-color: var(--rdg-row-selected-hover-background-color);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.rdg-7-0-0-beta-59-3fe773c3 {
|
|
@layer rdg.FocusSink {
|
|
outline: 2px solid var(--rdg-selection-color);
|
|
outline-offset: -2px;
|
|
}
|
|
}
|
|
|
|
.rdg-7-0-0-beta-59-97ce3fde {
|
|
@layer rdg.FocusSink {
|
|
&::before {
|
|
content: '';
|
|
display: inline-block;
|
|
block-size: 100%;
|
|
position: sticky;
|
|
inset-inline-start: 0;
|
|
border-inline-start: 2px solid var(--rdg-selection-color);
|
|
}
|
|
}
|
|
}
|
|
.rdg-7-0-0-beta-59-3d5115f3 {
|
|
@layer rdg.SortIcon {
|
|
fill: currentColor;
|
|
|
|
> path {
|
|
transition: d 0.1s;
|
|
}
|
|
}
|
|
}
|
|
.rdg-7-0-0-beta-59-ccd2e5d9 {
|
|
@layer rdg.Defaults {
|
|
*,
|
|
*::before,
|
|
*::after {
|
|
box-sizing: inherit;
|
|
}
|
|
}
|
|
|
|
@layer rdg.Root {
|
|
--rdg-selection-width: 2px;
|
|
--rdg-selection-color: hsl(207, 75%, 66%);
|
|
--rdg-font-size: 14px;
|
|
--rdg-cell-frozen-box-shadow: 2px 0 5px -2px rgba(136, 136, 136, 0.3);
|
|
--rdg-border-width: 1px;
|
|
--rdg-summary-border-width: calc(var(--rdg-border-width) * 2);
|
|
--rdg-color: light-dark(#000, #ddd);
|
|
--rdg-border-color: light-dark(#ddd, #444);
|
|
--rdg-summary-border-color: light-dark(#aaa, #555);
|
|
--rdg-background-color: light-dark(hsl(0deg 0% 100%), hsl(0deg 0% 13%));
|
|
--rdg-header-background-color: light-dark(hsl(0deg 0% 97.5%), hsl(0deg 0% 10.5%));
|
|
--rdg-header-draggable-background-color: light-dark(hsl(0deg 0% 90.5%), hsl(0deg 0% 17.5%));
|
|
--rdg-row-hover-background-color: light-dark(hsl(0deg 0% 96%), hsl(0deg 0% 9%));
|
|
--rdg-row-selected-background-color: light-dark(hsl(207deg 76% 92%), hsl(207deg 76% 42%));
|
|
--rdg-row-selected-hover-background-color: light-dark(hsl(207deg 76% 88%), hsl(207deg 76% 38%));
|
|
--rdg-checkbox-focus-color: hsl(207deg 100% 69%);
|
|
|
|
&.rdg-dark {
|
|
color-scheme: dark;
|
|
}
|
|
|
|
&.rdg-light {
|
|
color-scheme: light;
|
|
}
|
|
|
|
&:dir(rtl) {
|
|
--rdg-cell-frozen-box-shadow: -2px 0 5px -2px rgba(136, 136, 136, 0.3);
|
|
}
|
|
|
|
display: grid;
|
|
|
|
accent-color: light-dark(hsl(207deg 100% 29%), hsl(207deg 100% 79%));
|
|
|
|
/* https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context */
|
|
/* We set a stacking context so internal elements don't render on top of external elements. */
|
|
/* size containment is not used as it could break "width: min-content" for example, and the grid would infinitely resize on Chromium browsers */
|
|
contain: content;
|
|
content-visibility: auto;
|
|
block-size: 350px;
|
|
border: 1px solid var(--rdg-border-color);
|
|
box-sizing: border-box;
|
|
overflow: auto;
|
|
background-color: var(--rdg-background-color);
|
|
color: var(--rdg-color);
|
|
font-size: var(--rdg-font-size);
|
|
|
|
/* needed on Firefox to fix scrollbars */
|
|
&::before {
|
|
content: '';
|
|
grid-column: 1/-1;
|
|
grid-row: 1/-1;
|
|
}
|
|
|
|
> :nth-last-child(1 of .rdg-top-summary-row) {
|
|
> .rdg-7-0-0-beta-59-85c48527 {
|
|
border-block-end: var(--rdg-summary-border-width) solid var(--rdg-summary-border-color);
|
|
}
|
|
}
|
|
|
|
> :nth-child(1 of .rdg-bottom-summary-row) {
|
|
> .rdg-7-0-0-beta-59-85c48527 {
|
|
border-block-start: var(--rdg-summary-border-width) solid var(--rdg-summary-border-color);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.rdg-7-0-0-beta-59-e9b0e1c9 {
|
|
@layer rdg.Root {
|
|
user-select: none;
|
|
|
|
& .rdg-7-0-0-beta-59-3c083f1b {
|
|
cursor: move;
|
|
}
|
|
}
|
|
}
|
|
|
|
.rdg-7-0-0-beta-59-dbb8b3c5 {
|
|
@layer rdg.FocusSink {
|
|
grid-column: 1/-1;
|
|
pointer-events: none;
|
|
/* Should have a higher value than 1 to show up above regular frozen cells */
|
|
z-index: 1;
|
|
}
|
|
}
|
|
|
|
.rdg-7-0-0-beta-59-e9f55541 {
|
|
@layer rdg.FocusSink {
|
|
/* Should have a higher value than 3 to show up above header and summary rows */
|
|
z-index: 3;
|
|
}
|
|
}
|
|
.rdg-7-0-0-beta-59-0b90c82c {
|
|
@layer rdg.SummaryRow {
|
|
> .rdg-7-0-0-beta-59-85c48527 {
|
|
position: sticky;
|
|
}
|
|
}
|
|
}
|
|
|
|
.rdg-7-0-0-beta-59-d0520eab {
|
|
@layer rdg.SummaryRow {
|
|
> .rdg-7-0-0-beta-59-85c48527 {
|
|
z-index: 2;
|
|
}
|
|
|
|
> .rdg-7-0-0-beta-59-17a9a6d4 {
|
|
z-index: 3;
|
|
}
|
|
}
|
|
}
|
|
.rdg-7-0-0-beta-59-d907aa87 {
|
|
@layer rdg.SummaryCell {
|
|
inset-block-start: var(--rdg-summary-row-top);
|
|
inset-block-end: var(--rdg-summary-row-bottom);
|
|
}
|
|
}
|
|
.rdg-7-0-0-beta-59-e74a2be3 {
|
|
@layer rdg.GroupedRow {
|
|
&:not([aria-selected='true']) {
|
|
background-color: var(--rdg-header-background-color);
|
|
}
|
|
|
|
> .rdg-7-0-0-beta-59-85c48527:not(:last-child, .rdg-7-0-0-beta-59-17a9a6d4),
|
|
> :nth-last-child(n + 2 of .rdg-7-0-0-beta-59-17a9a6d4) {
|
|
border-inline-end: none;
|
|
}
|
|
}
|
|
}
|
|
.rdg-7-0-0-beta-59-2f8db206 {
|
|
@layer rdg.TextEditor {
|
|
appearance: none;
|
|
|
|
box-sizing: border-box;
|
|
inline-size: 100%;
|
|
block-size: 100%;
|
|
padding-block: 0;
|
|
padding-inline: 6px;
|
|
border: 2px solid #ccc;
|
|
vertical-align: top;
|
|
color: var(--rdg-color);
|
|
background-color: var(--rdg-background-color);
|
|
|
|
font-family: inherit;
|
|
font-size: var(--rdg-font-size);
|
|
|
|
&:focus {
|
|
border-color: var(--rdg-selection-color);
|
|
outline: none;
|
|
}
|
|
|
|
&::placeholder {
|
|
color: #999;
|
|
opacity: 1;
|
|
}
|
|
}
|
|
}
|
|
|
|
/*# sourceMappingURL=styles.css.map*/ |