Archives/gristlabs_grist-core
1
0
Fork 0
mirror of https://github.com/gristlabs/grist-core.git synced 2026-03-02 04:09:24 +00:00
Code Issues Projects Releases Wiki Activity

(core) Improve highlighting of previewed formula

Browse Source 
Summary:
Also improves highlighting of columns when the "Click to insert"
tooltip is shown, and improves highlighting of transforming columns.

Test Plan: Manual.

Reviewers: paulfitz

Reviewed By: paulfitz

Differential Revision: https://phab.getgrist.com/D3962
This commit is contained in:
George Gevoian
2023-07-20 14:18:32 -04:00
parent 5a703a1972
commit beffd02c41
12 changed files with 74 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -346,23 +346,23 @@
}
}
/* Column hover effect */
/* Highlight the entire column when the "Click to insert" tooltip is shown. */
.column_name.hover-column > .selection,
.column_name.hover-column.selected > .selection,
.gridview_row .field.hover-column > .selection {
background-color: var(--grist-theme-selection, var(--grist-color-selection));
inset: 0;
position: absolute;
}
.gridview_row .field.hover-column, /* normal field in a row */
.gridview_row .field.hover-column .field_clip,
.column_name.hover-column, /* column name */
.column_name.hover-column.selected, /* selected column name */
.gridview_row .field.frozen.hover-column /* frozen field in a row */ {
/* for frozen fields can't use alpha channel */
background-color: var(--grist-theme-selection-opaque-bg, var(--grist-color-selection-opaque));
color: var(--grist-theme-selection-opaque-fg, unset);
/* Use a darker highlight if the column is being transformed. */
.gridview_row .field.transform_field.hover-column > .selection {
background-color: var(--grist-theme-selection-darkest, rgba(22,179,120,0.35));
inset: 0;
position: absolute;
}
/* For zebra stripes, make the selection little darker */
.record-zebra.record-even .field.hover-column {
background-color: var(--grist-theme-selection-opaque-dark-bg, var(--grist-color-selection-darker-opaque));
color: var(--grist-theme-selection-opaque-fg, unset);
}
/* When column has a hover, remove menu button. */
/* And hide the column menu button. */
.column_name.hover-column .menu_toggle {
visibility: hidden;
}