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) Fixing background color in frozen columns for zebra stripes

Browse Source 
Summary: Background for frozen columns was set to transparent in recent PR, this diff is reverting it.

Test Plan: Updated

Reviewers: georgegevoian

Reviewed By: georgegevoian

Differential Revision: https://phab.getgrist.com/D3680
This commit is contained in:
Jarosław Sadziński 2022-10-27 12:57:08 +02:00
parent fb16c3de56
commit d81bba625a
3 changed files with 18 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
app/client/components/GridView.css
View File

@ -313,10 +313,13 @@
left: calc(4em + 1px + (var(--frozen-position, 0) - var(--frozen-offset, 0)) * 1px); /* 4em for row number + total width of cells + 1px for border*/ left: calc(4em + 1px + (var(--frozen-position, 0) - var(--frozen-offset, 0)) * 1px); /* 4em for row number + total width of cells + 1px for border*/
z-index: 1; z-index: 1;
} }
/* for data field we need to reuse color from record (add-row and zebra stripes) */ /* for data field we need to reuse color from record (add-row and zebra stripes) */
.gridview_row .record .field.frozen { .gridview_row .record .field.frozen {
background-color: inherit; background-color: var(--field-background-color, inherit);
}
.gridview_row .record.record-add .field.frozen {
background-color: inherit !important; /* important to win over zebra stripes */
} }
/* HACK: add box shadow to fix outline overflow from active cursor */ /* HACK: add box shadow to fix outline overflow from active cursor */
@ -328,11 +331,6 @@
box-shadow: 0px 1px 0px var(--grist-theme-table-body-border, var(--grist-color-dark-grey)); box-shadow: 0px 1px 0px var(--grist-theme-table-body-border, var(--grist-color-dark-grey));
} }
/* selected field has a transparent color - with frozen fields we can't do it */
.gridview_row .field.frozen.selected {
background-color: var(--grist-theme-selection-opaque-bg, var(--grist-color-selection-opaque));
}
/* make room for a frozen line by adding margin to first not frozen field - in header and in data */ /* make room for a frozen line by adding margin to first not frozen field - in header and in data */
.field.frozen + .field:not(.frozen) { .field.frozen + .field:not(.frozen) {
margin-left: 1px; margin-left: 1px;

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

@ -53,10 +53,11 @@
* We can't use background inheritance, because row background color is more important then static (aka default) * We can't use background inheritance, because row background color is more important then static (aka default)
* column color defined on a field (so lower in the dom). * column color defined on a field (so lower in the dom).
*/ */
background-color: var(--grist-diff-background-color, --field-background-color: var(--grist-diff-background-color,
var(--grist-column-rule-background-color, var(--grist-column-rule-background-color,
var(--grist-row-rule-background-color, var(--grist-row-rule-background-color,
var(--grist-cell-background-color, unset)))); var(--grist-cell-background-color))));
background-color: var(--field-background-color, unset);
} }
/** Similar order is for detail view, but there is no row rules */ /** Similar order is for detail view, but there is no row rules */
@ -67,11 +68,11 @@
} }
.record.record-zebra.record-even .field { .record.record-zebra.record-even .field {
background-color: var(--grist-diff-background-color, --field-background-color: var(--grist-diff-background-color,
var(--grist-column-rule-background-color, var(--grist-column-rule-background-color,
var(--grist-row-rule-background-color-zebra, var(--grist-row-rule-background-color-zebra,
var(--grist-row-rule-background-color, var(--grist-row-rule-background-color,
var(--grist-cell-background-color, unset))))); var(--grist-cell-background-color)))));
} }
.record.record-add .field { .record.record-add .field {

5
test/nbrowser/gristUtils.ts
View File

@ -2030,8 +2030,8 @@ export async function setFont(type: 'bold'|'underline'|'italic'|'strikethrough',
} }
/** /**
* Returns the rgb/hex representation of `color` if it's a name (e.g. red, blue, green, white, black, or transparent), * Returns the rgb/hex representation of `color` if it's a name (e.g. red, blue, green, white, black, addRow, or
* or `color` unchanged if it's not a name. * transparent), or `color` unchanged if it's not a name.
*/ */
export function nameToHex(color: string) { export function nameToHex(color: string) {
switch(color) { switch(color) {
@ -2041,6 +2041,7 @@ export function nameToHex(color: string) {
case 'white': color = '#FFFFFF'; break; case 'white': color = '#FFFFFF'; break;
case 'black': color = '#000000'; break; case 'black': color = '#000000'; break;
case 'transparent': color = 'rgba(0, 0, 0, 0)'; break; case 'transparent': color = 'rgba(0, 0, 0, 0)'; break;
case 'addRow': color = 'rgba(246, 246, 255, 1)'; break;
} }
return color; return color;
} }