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*/
z-index: 1;
}
/* for data field we need to reuse color from record (add-row and zebra stripes) */
.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 */
@ -328,11 +331,6 @@
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 */
.field.frozen + .field:not(.frozen) {
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)
* column color defined on a field (so lower in the dom).
*/
background-color: var(--grist-diff-background-color,
var(--grist-column-rule-background-color,
var(--grist-row-rule-background-color,
var(--grist-cell-background-color, unset))));
--field-background-color: var(--grist-diff-background-color,
var(--grist-column-rule-background-color,
var(--grist-row-rule-background-color,
var(--grist-cell-background-color))));
background-color: var(--field-background-color, unset);
}
/** Similar order is for detail view, but there is no row rules */
@ -67,11 +68,11 @@
}
.record.record-zebra.record-even .field {
background-color: var(--grist-diff-background-color,
var(--grist-column-rule-background-color,
var(--grist-row-rule-background-color-zebra,
var(--grist-row-rule-background-color,
var(--grist-cell-background-color, unset)))));
--field-background-color: var(--grist-diff-background-color,
var(--grist-column-rule-background-color,
var(--grist-row-rule-background-color-zebra,
var(--grist-row-rule-background-color,
var(--grist-cell-background-color)))));
}
.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),
* or `color` unchanged if it's not a name.
* Returns the rgb/hex representation of `color` if it's a name (e.g. red, blue, green, white, black, addRow, or
* transparent), or `color` unchanged if it's not a name.
*/
export function nameToHex(color: string) {
switch(color) {
@ -2041,6 +2041,7 @@ export function nameToHex(color: string) {
case 'white': color = '#FFFFFF'; break;
case 'black': color = '#000000'; break;
case 'transparent': color = 'rgba(0, 0, 0, 0)'; break;
case 'addRow': color = 'rgba(246, 246, 255, 1)'; break;
}
return color;
}