(core) Adding selection layer on top of field element

Summary: Adding a new layer in front of the field_clip element that fixes selected cells' color.

Test Plan: Existing tests

Reviewers: georgegevoian

Reviewed By: georgegevoian

Differential Revision: https://phab.getgrist.com/D3620
This commit is contained in:
Jarosław Sadziński 2022-09-08 12:01:39 +02:00
parent c9c46d337b
commit 87731224df
2 changed files with 8 additions and 6 deletions

View File

@ -1266,6 +1266,7 @@ GridView.prototype.buildDom = function() {
kd.toggleClass('selected', isSelected),
fieldBuilder.buildDomWithCursor(row, isCellActive, isCellSelected),
dom('div.field_selection')
);
})
)

View File

@ -55,9 +55,7 @@
outline: 2px dashed var(--grist-theme-cursor, var(--grist-color-cursor));
}
.field.selected {
background-color: var(--grist-theme-selection, var(--grist-color-selection));
}
.field.draft {
padding-right: 18px;
@ -72,13 +70,16 @@
text-overflow: ellipsis;
width: 100%;
height: 100%;
background-color: var(--grist-diff-background-color, var(--grist-cell-background-color, unset));
background-color: var(--grist-diff-background-color, var(--grist-cell-background-color, var(--grist-row-background-color, unset)));
--grist-actual-cell-color: var(--grist-diff-color, var(--grist-cell-color, var(--grist-row-color)));
color: var(--grist-actual-cell-color, unset);
}
.field.selected .field_clip {
mix-blend-mode: luminosity;
.field.selected > .field_selection {
background-color: var(--grist-theme-selection, var(--grist-color-selection));
position: absolute;
inset: 0;
pointer-events: none;
}
.field_clip.invalid, .field_clip.field-error-from-style {