(core) Making cells colors effective also in Card and Card List views

Summary:
 . Makes cell color work well in comparison mode
 . Do not apply cell color to the add new row
 . Allow to change color for all widget (including changing color for the checkbox and the switch widget)
 . Fix an issue that was setting color to black when opening the picker
 . Do not apply color to invalid cell

Test Plan: . Added nbrowser/CellColor

Reviewers: paulfitz, dsagal

Reviewed By: dsagal

Differential Revision: https://phab.getgrist.com/D2720
This commit is contained in:
Cyprien P
2021-02-09 11:12:53 +01:00
parent de1719ee08
commit 890a8709f3
12 changed files with 65 additions and 27 deletions

View File

@@ -935,10 +935,6 @@ GridView.prototype.buildDom = function() {
//TODO: Ensure that fields in a row resize when
//a cell in that row becomes larger
kd.style('borderRightWidth', v.borderWidthPx),
kd.style('color', field.textColor),
// If making a comparison, use the background exclusively for
// marking that up.
self.comparison ? null : kd.style('background-color', () => (row._isAddRow() || isSelected()) ? '' : field.fillColor()),
kd.toggleClass('selected', isSelected),
fieldBuilder.buildDomWithCursor(row, isCellActive, isCellSelected)

View File

@@ -55,10 +55,14 @@
text-overflow: ellipsis;
width: 100%;
height: 100%;
background-color: var(--grist-diff-background-color, var(--grist-cell-background-color, unset));
--grist-actual-cell-color: var(--grist-diff-color, var(--grist-cell-color));
color: var(--grist-actual-cell-color, unset);
}
.field_clip.invalid {
background-color: #ffb6c1;
color: unset;
}
.field_clip.invalid:empty {
@@ -159,20 +163,28 @@
.diff-local, .diff-local-add {
background-color: #dfdfff;
--grist-diff-background-color: #dfdfff;
--grist-diff-color: black;
}
.diff-parent, .diff-remote-remove {
background-color: #ffdfdf;
--grist-diff-background-color: #ffdfdf;
--grist-diff-color: black;
text-decoration: line-through;
}
.diff-local-remove {
background-color: #dfdfdf;
--grist-diff-background-color: #dfdfdf;
--grist-diff-color: black;
text-decoration: line-through;
}
.diff-remote, .diff-remote-add {
background-color: #afffaf;
--grist-diff-background-color: #afffaf;
--grist-diff-color: black;
}
.diff-common {