Archives/gristlabs_grist-core
1
0
Fork 0
mirror of https://github.com/gristlabs/grist-core.git synced 2024-10-27 20:44:07 +00:00
Code Issues Projects Releases Wiki Activity

(core) Adding selection layer on top of field element

Browse Source 
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
app/client/components/GridView.js
View File

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

13
app/client/components/viewCommon.css
View File

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