mirror of
https://github.com/gristlabs/grist-core.git
synced 2026-03-02 04:09:24 +00:00
(core) Add dark mode to user preferences
Summary: Adds initial implementation of dark mode. Preferences for dark mode are available on the account settings page. Dark mode is currently a beta feature as there are still some small bugs to squash and a few remaining UI elements to style. Test Plan: Browser tests. Reviewers: jarek Reviewed By: jarek Subscribers: paulfitz, jarek Differential Revision: https://phab.getgrist.com/D3587
This commit is contained in:
George Gevoian
@@ -1,4 +1,5 @@
|
||||
import {StringUnion} from 'app/common/StringUnion';
|
||||
import {ThemePrefs} from 'app/common/ThemePrefs';
|
||||
|
||||
export const SortPref = StringUnion("name", "date");
|
||||
export type SortPref = typeof SortPref.type;
|
||||
@@ -12,7 +13,7 @@ export interface Prefs {
|
||||
placeholder?: string;
|
||||
}
|
||||
|
||||
// A collection of preferences related to a user or org (or combination).
|
||||
// A collection of preferences related to a user.
|
||||
export interface UserPrefs extends Prefs {
|
||||
// Whether to ask the user to fill out a form about their use-case, on opening the DocMenu page.
|
||||
// Set to true on first login, then reset when the form is closed, so that it only shows once.
|
||||
@@ -20,8 +21,11 @@ export interface UserPrefs extends Prefs {
|
||||
// Whether to record a new sign-up event via Google Tag Manager. Set to true on first login, then
|
||||
// reset on first page load (after the event is sent), so that it's only recorded once.
|
||||
recordSignUpEvent?: boolean;
|
||||
// Theme-related preferences.
|
||||
theme?: ThemePrefs;
|
||||
}
|
||||
|
||||
// A collection of preferences related to a combination of user and org.
|
||||
export interface UserOrgPrefs extends Prefs {
|
||||
docMenuSort?: SortPref;
|
||||
docMenuView?: ViewPref;
|
||||
|
||||
327
app/common/ThemePrefs-ti.ts
Normal file
327
app/common/ThemePrefs-ti.ts
Normal file
@@ -0,0 +1,327 @@
|
||||
/**
|
||||
* This module was automatically generated by `ts-interface-builder`
|
||||
*/
|
||||
import * as t from "ts-interface-checker";
|
||||
// tslint:disable:object-literal-key-quotes
|
||||
|
||||
export const ThemePrefs = t.iface([], {
|
||||
"appearance": "ThemeAppearance",
|
||||
"syncWithOS": "boolean",
|
||||
"colors": t.iface([], {
|
||||
"light": "ThemeNameOrColors",
|
||||
"dark": "ThemeNameOrColors",
|
||||
}),
|
||||
});
|
||||
|
||||
export const ThemeAppearance = t.union(t.lit('light'), t.lit('dark'));
|
||||
|
||||
export const ThemeNameOrColors = t.union("ThemeName", "ThemeColors");
|
||||
|
||||
export const ThemeName = t.union(t.lit('GristLight'), t.lit('GristDark'));
|
||||
|
||||
export const Theme = t.iface([], {
|
||||
"appearance": "ThemeAppearance",
|
||||
"colors": "ThemeColors",
|
||||
});
|
||||
|
||||
export const ThemeColors = t.iface([], {
|
||||
"text": "string",
|
||||
"text-light": "string",
|
||||
"text-dark": "string",
|
||||
"text-error": "string",
|
||||
"text-danger": "string",
|
||||
"text-disabled": "string",
|
||||
"page-bg": "string",
|
||||
"page-backdrop": "string",
|
||||
"page-panels-main-panel-bg": "string",
|
||||
"page-panels-left-panel-bg": "string",
|
||||
"page-panels-right-panel-bg": "string",
|
||||
"page-panels-top-header-bg": "string",
|
||||
"page-panels-bottom-footer-bg": "string",
|
||||
"page-panels-border": "string",
|
||||
"page-panels-border-resizing": "string",
|
||||
"page-panels-side-panel-opener-fg": "string",
|
||||
"page-panels-side-panel-opener-active-fg": "string",
|
||||
"page-panels-side-panel-opener-active-bg": "string",
|
||||
"add-new-circle-fg": "string",
|
||||
"add-new-circle-bg": "string",
|
||||
"add-new-circle-hover-bg": "string",
|
||||
"add-new-circle-small-fg": "string",
|
||||
"add-new-circle-small-bg": "string",
|
||||
"add-new-circle-small-hover-bg": "string",
|
||||
"top-bar-button-primary-fg": "string",
|
||||
"top-bar-button-secondary-fg": "string",
|
||||
"top-bar-button-disabled-fg": "string",
|
||||
"top-bar-button-error-fg": "string",
|
||||
"notifications-panel-header-bg": "string",
|
||||
"notifications-panel-body-bg": "string",
|
||||
"notifications-panel-border": "string",
|
||||
"toast-text": "string",
|
||||
"toast-text-light": "string",
|
||||
"toast-bg": "string",
|
||||
"toast-error-icon": "string",
|
||||
"toast-error-bg": "string",
|
||||
"toast-success-icon": "string",
|
||||
"toast-success-bg": "string",
|
||||
"toast-warning-icon": "string",
|
||||
"toast-warning-bg": "string",
|
||||
"toast-info-icon": "string",
|
||||
"toast-info-bg": "string",
|
||||
"toast-control-fg": "string",
|
||||
"toast-control-info-fg": "string",
|
||||
"tooltip-fg": "string",
|
||||
"tooltip-bg": "string",
|
||||
"tooltip-icon": "string",
|
||||
"tooltip-close-button-fg": "string",
|
||||
"tooltip-close-button-hover-fg": "string",
|
||||
"tooltip-close-button-hover-bg": "string",
|
||||
"modal-bg": "string",
|
||||
"modal-backdrop": "string",
|
||||
"modal-border": "string",
|
||||
"modal-border-dark": "string",
|
||||
"modal-border-hover": "string",
|
||||
"modal-shadow-inner": "string",
|
||||
"modal-shadow-outer": "string",
|
||||
"modal-close-button-fg": "string",
|
||||
"modal-backdrop-close-button-fg": "string",
|
||||
"modal-backdrop-close-button-hover-fg": "string",
|
||||
"popup-bg": "string",
|
||||
"popup-shadow-inner": "string",
|
||||
"popup-shadow-outer": "string",
|
||||
"popup-close-button-fg": "string",
|
||||
"progress-bar-fg": "string",
|
||||
"progress-bar-error-fg": "string",
|
||||
"progress-bar-bg": "string",
|
||||
"link": "string",
|
||||
"link-hover": "string",
|
||||
"hover": "string",
|
||||
"hover-light": "string",
|
||||
"cell-editor-fg": "string",
|
||||
"cell-editor-bg": "string",
|
||||
"cursor": "string",
|
||||
"cursor-inactive": "string",
|
||||
"cursor-readonly": "string",
|
||||
"table-header-fg": "string",
|
||||
"table-header-selected-fg": "string",
|
||||
"table-header-bg": "string",
|
||||
"table-header-selected-bg": "string",
|
||||
"table-header-border": "string",
|
||||
"table-header-border-dark": "string",
|
||||
"table-body-bg": "string",
|
||||
"table-body-border": "string",
|
||||
"table-add-new-bg": "string",
|
||||
"table-scroll-shadow": "string",
|
||||
"table-frozen-columns-border": "string",
|
||||
"table-drag-drop-indicator": "string",
|
||||
"table-drag-drop-shadow": "string",
|
||||
"card-compact-widget-bg": "string",
|
||||
"card-compact-record-bg": "string",
|
||||
"card-blocks-bg": "string",
|
||||
"card-form-label": "string",
|
||||
"card-compact-label": "string",
|
||||
"card-blocks-label": "string",
|
||||
"card-form-border": "string",
|
||||
"card-compact-border": "string",
|
||||
"card-editing-layout-bg": "string",
|
||||
"card-editing-layout-border": "string",
|
||||
"card-list-form-border": "string",
|
||||
"card-list-blocks-border": "string",
|
||||
"selection": "string",
|
||||
"selection-opaque-fg": "string",
|
||||
"selection-opaque-bg": "string",
|
||||
"selection-opaque-dark-bg": "string",
|
||||
"widget-border": "string",
|
||||
"widget-active-border": "string",
|
||||
"widget-inactive-stripes-light": "string",
|
||||
"widget-inactive-stripes-dark": "string",
|
||||
"pinned-doc-footer-bg": "string",
|
||||
"pinned-doc-border": "string",
|
||||
"pinned-doc-border-hover": "string",
|
||||
"pinned-doc-editor-bg": "string",
|
||||
"raw-data-table-border": "string",
|
||||
"raw-data-table-border-hover": "string",
|
||||
"control-fg": "string",
|
||||
"control-primary-fg": "string",
|
||||
"control-primary-bg": "string",
|
||||
"control-secondary-fg": "string",
|
||||
"control-hover-fg": "string",
|
||||
"control-primary-hover-bg": "string",
|
||||
"control-secondary-hover-fg": "string",
|
||||
"control-secondary-hover-bg": "string",
|
||||
"control-disabled-fg": "string",
|
||||
"control-disabled-bg": "string",
|
||||
"control-primary-disabled": "string",
|
||||
"control-border": "string",
|
||||
"checkbox-bg": "string",
|
||||
"checkbox-disabled-bg": "string",
|
||||
"checkbox-border": "string",
|
||||
"checkbox-border-hover": "string",
|
||||
"move-docs-selected-fg": "string",
|
||||
"move-docs-selected-bg": "string",
|
||||
"move-docs-disabled-bg": "string",
|
||||
"filter-bar-button-saved-fg": "string",
|
||||
"filter-bar-button-saved-bg": "string",
|
||||
"filter-bar-button-saved-hover-bg": "string",
|
||||
"icon-button-fg": "string",
|
||||
"icon-button-primary-bg": "string",
|
||||
"icon-button-primary-hover-bg": "string",
|
||||
"icon-button-secondary-bg": "string",
|
||||
"icon-button-secondary-hover-bg": "string",
|
||||
"left-panel-page-hover-bg": "string",
|
||||
"left-panel-active-page-fg": "string",
|
||||
"left-panel-active-page-bg": "string",
|
||||
"left-panel-disabled-page-fg": "string",
|
||||
"left-panel-page-options-fg": "string",
|
||||
"left-panel-page-options-hover-fg": "string",
|
||||
"left-panel-page-options-hover-bg": "string",
|
||||
"left-panel-page-options-selected-hover-bg": "string",
|
||||
"left-panel-page-initials-fg": "string",
|
||||
"left-panel-page-initials-bg": "string",
|
||||
"right-panel-tab-fg": "string",
|
||||
"right-panel-tab-bg": "string",
|
||||
"right-panel-tab-icon": "string",
|
||||
"right-panel-tab-icon-hover": "string",
|
||||
"right-panel-tab-hover-bg": "string",
|
||||
"right-panel-tab-selected-fg": "string",
|
||||
"right-panel-tab-selected-bg": "string",
|
||||
"right-panel-tab-close-button-hover-bg": "string",
|
||||
"right-panel-subtab-fg": "string",
|
||||
"right-panel-subtab-selected-fg": "string",
|
||||
"right-panel-subtab-selected-underline": "string",
|
||||
"right-panel-subtab-hover-fg": "string",
|
||||
"right-panel-subtab-hover-underline": "string",
|
||||
"right-panel-disabled-overlay": "string",
|
||||
"right-panel-toggle-button-enabled-fg": "string",
|
||||
"right-panel-toggle-button-enabled-bg": "string",
|
||||
"right-panel-toggle-button-enabled-hover-fg": "string",
|
||||
"right-panel-toggle-button-disabled-fg": "string",
|
||||
"right-panel-toggle-button-disabled-bg": "string",
|
||||
"right-panel-field-settings-bg": "string",
|
||||
"right-panel-field-settings-button-bg": "string",
|
||||
"document-history-snapshot-fg": "string",
|
||||
"document-history-snapshot-selected-fg": "string",
|
||||
"document-history-snapshot-bg": "string",
|
||||
"document-history-snapshot-selected-bg": "string",
|
||||
"document-history-snapshot-border": "string",
|
||||
"document-history-activity-text": "string",
|
||||
"document-history-activity-text-light": "string",
|
||||
"accent-icon": "string",
|
||||
"accent-border": "string",
|
||||
"accent-text": "string",
|
||||
"input-fg": "string",
|
||||
"input-bg": "string",
|
||||
"input-disabled-fg": "string",
|
||||
"input-disabled-bg": "string",
|
||||
"input-placeholder-fg": "string",
|
||||
"input-border": "string",
|
||||
"input-valid": "string",
|
||||
"input-invalid": "string",
|
||||
"input-focus": "string",
|
||||
"input-readonly-bg": "string",
|
||||
"input-readonly-border": "string",
|
||||
"choice-entry-bg": "string",
|
||||
"choice-entry-border": "string",
|
||||
"choice-entry-border-hover": "string",
|
||||
"select-button-fg": "string",
|
||||
"select-button-placeholder-fg": "string",
|
||||
"select-button-disabled-fg": "string",
|
||||
"select-button-bg": "string",
|
||||
"select-button-border": "string",
|
||||
"select-button-border-invalid": "string",
|
||||
"menu-text": "string",
|
||||
"menu-light-text": "string",
|
||||
"menu-bg": "string",
|
||||
"menu-subheader-fg": "string",
|
||||
"menu-border": "string",
|
||||
"menu-shadow": "string",
|
||||
"menu-item-fg": "string",
|
||||
"menu-item-selected-fg": "string",
|
||||
"menu-item-selected-bg": "string",
|
||||
"menu-item-disabled-fg": "string",
|
||||
"menu-item-icon-fg": "string",
|
||||
"menu-item-icon-selected-fg": "string",
|
||||
"menu-item-link-fg": "string",
|
||||
"menu-item-link-selected-fg": "string",
|
||||
"menu-item-link-selected-bg": "string",
|
||||
"autocomplete-match-text": "string",
|
||||
"autocomplete-selected-match-text": "string",
|
||||
"autocomplete-item-selected-bg": "string",
|
||||
"search-border": "string",
|
||||
"search-prev-next-button-fg": "string",
|
||||
"search-prev-next-button-bg": "string",
|
||||
"loader-fg": "string",
|
||||
"loader-bg": "string",
|
||||
"site-switcher-active-fg": "string",
|
||||
"site-switcher-active-bg": "string",
|
||||
"doc-menu-doc-options-fg": "string",
|
||||
"doc-menu-doc-options-hover-fg": "string",
|
||||
"doc-menu-doc-options-hover-bg": "string",
|
||||
"shortcut-key-fg": "string",
|
||||
"shortcut-key-primary-fg": "string",
|
||||
"shortcut-key-secondary-fg": "string",
|
||||
"shortcut-key-bg": "string",
|
||||
"shortcut-key-border": "string",
|
||||
"breadcrumbs-tag-fg": "string",
|
||||
"breadcrumbs-tag-bg": "string",
|
||||
"breadcrumbs-tag-alert-bg": "string",
|
||||
"widget-picker-primary-bg": "string",
|
||||
"widget-picker-secondary-bg": "string",
|
||||
"widget-picker-item-fg": "string",
|
||||
"widget-picker-item-selected-bg": "string",
|
||||
"widget-picker-item-disabled-bg": "string",
|
||||
"widget-picker-icon": "string",
|
||||
"widget-picker-primary-icon": "string",
|
||||
"widget-picker-summary-icon": "string",
|
||||
"widget-picker-border": "string",
|
||||
"widget-picker-shadow": "string",
|
||||
"code-view-text": "string",
|
||||
"code-view-keyword": "string",
|
||||
"code-view-comment": "string",
|
||||
"code-view-meta": "string",
|
||||
"code-view-title": "string",
|
||||
"code-view-params": "string",
|
||||
"code-view-string": "string",
|
||||
"code-view-number": "string",
|
||||
"importer-table-info-border": "string",
|
||||
"importer-preview-border": "string",
|
||||
"importer-skipped-table-overlay": "string",
|
||||
"importer-match-icon": "string",
|
||||
"menu-toggle-fg": "string",
|
||||
"menu-toggle-hover-fg": "string",
|
||||
"menu-toggle-active-fg": "string",
|
||||
"menu-toggle-bg": "string",
|
||||
"menu-toggle-border": "string",
|
||||
"button-group-fg": "string",
|
||||
"button-group-light-fg": "string",
|
||||
"button-group-bg": "string",
|
||||
"button-group-icon": "string",
|
||||
"button-group-border": "string",
|
||||
"button-group-border-hover": "string",
|
||||
"button-group-selected-fg": "string",
|
||||
"button-group-light-selected-fg": "string",
|
||||
"button-group-selected-bg": "string",
|
||||
"button-group-selected-border": "string",
|
||||
"access-rules-table-header-fg": "string",
|
||||
"access-rules-table-header-bg": "string",
|
||||
"access-rules-table-body-fg": "string",
|
||||
"access-rules-table-border": "string",
|
||||
"cell-fg": "string",
|
||||
"cell-bg": "string",
|
||||
"cell-zebra-bg": "string",
|
||||
"formula-editor-bg": "string",
|
||||
"chart-fg": "string",
|
||||
"chart-bg": "string",
|
||||
"chart-legend-bg": "string",
|
||||
"chart-x-axis": "string",
|
||||
"chart-y-axis": "string",
|
||||
});
|
||||
|
||||
const exportedTypeSuite: t.ITypeSuite = {
|
||||
ThemePrefs,
|
||||
ThemeAppearance,
|
||||
ThemeNameOrColors,
|
||||
ThemeName,
|
||||
Theme,
|
||||
ThemeColors,
|
||||
};
|
||||
export default exportedTypeSuite;
|
||||
430
app/common/ThemePrefs.ts
Normal file
430
app/common/ThemePrefs.ts
Normal file
@@ -0,0 +1,430 @@
|
||||
import ThemePrefsTI from 'app/common/ThemePrefs-ti';
|
||||
import {CheckerT, createCheckers} from 'ts-interface-checker';
|
||||
|
||||
export interface ThemePrefs {
|
||||
appearance: ThemeAppearance;
|
||||
syncWithOS: boolean;
|
||||
colors: {
|
||||
light: ThemeNameOrColors;
|
||||
dark: ThemeNameOrColors;
|
||||
}
|
||||
}
|
||||
|
||||
export type ThemeAppearance = 'light' | 'dark';
|
||||
|
||||
export type ThemeNameOrColors = ThemeName | ThemeColors;
|
||||
|
||||
export type ThemeName = 'GristLight' | 'GristDark';
|
||||
|
||||
export interface Theme {
|
||||
appearance: ThemeAppearance;
|
||||
colors: ThemeColors;
|
||||
}
|
||||
|
||||
export interface ThemeColors {
|
||||
/* Text */
|
||||
'text': string;
|
||||
'text-light': string;
|
||||
'text-dark': string;
|
||||
'text-error': string;
|
||||
'text-danger': string;
|
||||
'text-disabled': string;
|
||||
|
||||
/* Page */
|
||||
'page-bg': string;
|
||||
'page-backdrop': string;
|
||||
|
||||
/* Page Panels */
|
||||
'page-panels-main-panel-bg': string;
|
||||
'page-panels-left-panel-bg': string;
|
||||
'page-panels-right-panel-bg': string;
|
||||
'page-panels-top-header-bg': string;
|
||||
'page-panels-bottom-footer-bg': string;
|
||||
'page-panels-border': string;
|
||||
'page-panels-border-resizing': string;
|
||||
'page-panels-side-panel-opener-fg': string;
|
||||
'page-panels-side-panel-opener-active-fg': string;
|
||||
'page-panels-side-panel-opener-active-bg': string;
|
||||
|
||||
/* Add New */
|
||||
'add-new-circle-fg': string;
|
||||
'add-new-circle-bg': string;
|
||||
'add-new-circle-hover-bg': string;
|
||||
'add-new-circle-small-fg': string;
|
||||
'add-new-circle-small-bg': string;
|
||||
'add-new-circle-small-hover-bg': string;
|
||||
|
||||
/* Top Bar */
|
||||
'top-bar-button-primary-fg': string;
|
||||
'top-bar-button-secondary-fg': string;
|
||||
'top-bar-button-disabled-fg': string;
|
||||
'top-bar-button-error-fg': string;
|
||||
|
||||
/* Notifications */
|
||||
'notifications-panel-header-bg': string;
|
||||
'notifications-panel-body-bg': string;
|
||||
'notifications-panel-border': string;
|
||||
|
||||
/* Toasts */
|
||||
'toast-text': string;
|
||||
'toast-text-light': string;
|
||||
'toast-bg': string;
|
||||
'toast-error-icon': string;
|
||||
'toast-error-bg': string;
|
||||
'toast-success-icon': string;
|
||||
'toast-success-bg': string;
|
||||
'toast-warning-icon': string;
|
||||
'toast-warning-bg': string;
|
||||
'toast-info-icon': string;
|
||||
'toast-info-bg': string;
|
||||
'toast-control-fg': string;
|
||||
'toast-control-info-fg': string;
|
||||
|
||||
/* Tooltips */
|
||||
'tooltip-fg': string;
|
||||
'tooltip-bg': string;
|
||||
'tooltip-icon': string;
|
||||
'tooltip-close-button-fg': string;
|
||||
'tooltip-close-button-hover-fg': string;
|
||||
'tooltip-close-button-hover-bg': string;
|
||||
|
||||
/* Modals */
|
||||
'modal-bg': string;
|
||||
'modal-backdrop': string;
|
||||
'modal-border': string;
|
||||
'modal-border-dark': string;
|
||||
'modal-border-hover': string;
|
||||
'modal-shadow-inner': string;
|
||||
'modal-shadow-outer': string;
|
||||
'modal-close-button-fg': string;
|
||||
'modal-backdrop-close-button-fg': string;
|
||||
'modal-backdrop-close-button-hover-fg': string;
|
||||
|
||||
/* Popups */
|
||||
'popup-bg': string;
|
||||
'popup-shadow-inner': string;
|
||||
'popup-shadow-outer': string;
|
||||
'popup-close-button-fg': string;
|
||||
|
||||
/* Progress Bars */
|
||||
'progress-bar-fg': string;
|
||||
'progress-bar-error-fg': string;
|
||||
'progress-bar-bg': string;
|
||||
|
||||
/* Links */
|
||||
'link': string;
|
||||
'link-hover': string;
|
||||
|
||||
/* Hover */
|
||||
'hover': string;
|
||||
'hover-light': string;
|
||||
|
||||
/* Cell Editor */
|
||||
'cell-editor-fg': string;
|
||||
'cell-editor-bg': string;
|
||||
|
||||
/* Cursor */
|
||||
'cursor': string;
|
||||
'cursor-inactive': string;
|
||||
'cursor-readonly': string;
|
||||
|
||||
/* Tables */
|
||||
'table-header-fg': string;
|
||||
'table-header-selected-fg': string;
|
||||
'table-header-bg': string;
|
||||
'table-header-selected-bg': string;
|
||||
'table-header-border': string;
|
||||
'table-header-border-dark': string;
|
||||
'table-body-bg': string;
|
||||
'table-body-border': string;
|
||||
'table-add-new-bg': string;
|
||||
'table-scroll-shadow': string;
|
||||
'table-frozen-columns-border': string;
|
||||
'table-drag-drop-indicator': string;
|
||||
'table-drag-drop-shadow': string;
|
||||
|
||||
/* Cards */
|
||||
'card-compact-widget-bg': string;
|
||||
'card-compact-record-bg': string;
|
||||
'card-blocks-bg': string;
|
||||
'card-form-label': string;
|
||||
'card-compact-label': string;
|
||||
'card-blocks-label': string;
|
||||
'card-form-border': string;
|
||||
'card-compact-border': string;
|
||||
'card-editing-layout-bg': string;
|
||||
'card-editing-layout-border': string;
|
||||
|
||||
/* Card Lists */
|
||||
'card-list-form-border': string;
|
||||
'card-list-blocks-border': string;
|
||||
|
||||
/* Selection */
|
||||
'selection': string;
|
||||
'selection-opaque-fg': string;
|
||||
'selection-opaque-bg': string;
|
||||
'selection-opaque-dark-bg': string;
|
||||
|
||||
/* Widgets */
|
||||
'widget-border': string;
|
||||
'widget-active-border': string;
|
||||
'widget-inactive-stripes-light': string;
|
||||
'widget-inactive-stripes-dark': string;
|
||||
|
||||
/* Pinned Docs */
|
||||
'pinned-doc-footer-bg': string;
|
||||
'pinned-doc-border': string;
|
||||
'pinned-doc-border-hover': string;
|
||||
'pinned-doc-editor-bg': string;
|
||||
|
||||
/* Raw Data */
|
||||
'raw-data-table-border': string;
|
||||
'raw-data-table-border-hover': string;
|
||||
|
||||
/* Controls */
|
||||
'control-fg': string;
|
||||
'control-primary-fg': string;
|
||||
'control-primary-bg': string;
|
||||
'control-secondary-fg': string;
|
||||
'control-hover-fg': string;
|
||||
'control-primary-hover-bg': string;
|
||||
'control-secondary-hover-fg': string;
|
||||
'control-secondary-hover-bg': string;
|
||||
'control-disabled-fg': string;
|
||||
'control-disabled-bg': string;
|
||||
'control-primary-disabled': string;
|
||||
'control-border': string;
|
||||
|
||||
/* Checkboxes */
|
||||
'checkbox-bg': string;
|
||||
'checkbox-disabled-bg': string;
|
||||
'checkbox-border': string;
|
||||
'checkbox-border-hover': string;
|
||||
|
||||
/* Move Docs */
|
||||
'move-docs-selected-fg': string;
|
||||
'move-docs-selected-bg': string;
|
||||
'move-docs-disabled-bg': string;
|
||||
|
||||
/* Filter Bar */
|
||||
'filter-bar-button-saved-fg': string;
|
||||
'filter-bar-button-saved-bg': string;
|
||||
'filter-bar-button-saved-hover-bg': string;
|
||||
|
||||
/* Icon Buttons */
|
||||
'icon-button-fg': string;
|
||||
'icon-button-primary-bg': string;
|
||||
'icon-button-primary-hover-bg': string;
|
||||
'icon-button-secondary-bg': string;
|
||||
'icon-button-secondary-hover-bg': string;
|
||||
|
||||
/* Left Panel */
|
||||
'left-panel-page-hover-bg': string;
|
||||
'left-panel-active-page-fg': string;
|
||||
'left-panel-active-page-bg': string;
|
||||
'left-panel-disabled-page-fg': string;
|
||||
'left-panel-page-options-fg': string;
|
||||
'left-panel-page-options-hover-fg': string;
|
||||
'left-panel-page-options-hover-bg': string;
|
||||
'left-panel-page-options-selected-hover-bg': string;
|
||||
'left-panel-page-initials-fg': string;
|
||||
'left-panel-page-initials-bg': string;
|
||||
|
||||
/* Right Panel */
|
||||
'right-panel-tab-fg': string;
|
||||
'right-panel-tab-bg': string;
|
||||
'right-panel-tab-icon': string;
|
||||
'right-panel-tab-icon-hover': string;
|
||||
'right-panel-tab-hover-bg': string;
|
||||
'right-panel-tab-selected-fg': string;
|
||||
'right-panel-tab-selected-bg': string;
|
||||
'right-panel-tab-close-button-hover-bg': string;
|
||||
'right-panel-subtab-fg': string;
|
||||
'right-panel-subtab-selected-fg': string;
|
||||
'right-panel-subtab-selected-underline': string;
|
||||
'right-panel-subtab-hover-fg': string;
|
||||
'right-panel-subtab-hover-underline': string;
|
||||
'right-panel-disabled-overlay': string;
|
||||
'right-panel-toggle-button-enabled-fg': string;
|
||||
'right-panel-toggle-button-enabled-bg': string;
|
||||
'right-panel-toggle-button-enabled-hover-fg': string;
|
||||
'right-panel-toggle-button-disabled-fg': string;
|
||||
'right-panel-toggle-button-disabled-bg': string;
|
||||
'right-panel-field-settings-bg': string;
|
||||
'right-panel-field-settings-button-bg': string;
|
||||
|
||||
/* Document History */
|
||||
'document-history-snapshot-fg': string;
|
||||
'document-history-snapshot-selected-fg': string;
|
||||
'document-history-snapshot-bg': string;
|
||||
'document-history-snapshot-selected-bg': string;
|
||||
'document-history-snapshot-border': string;
|
||||
'document-history-activity-text': string;
|
||||
'document-history-activity-text-light': string;
|
||||
|
||||
/* Accents */
|
||||
'accent-icon': string;
|
||||
'accent-border': string;
|
||||
'accent-text': string;
|
||||
|
||||
/* Inputs */
|
||||
'input-fg': string;
|
||||
'input-bg': string;
|
||||
'input-disabled-fg': string;
|
||||
'input-disabled-bg': string;
|
||||
'input-placeholder-fg': string;
|
||||
'input-border': string;
|
||||
'input-valid': string;
|
||||
'input-invalid': string;
|
||||
'input-focus': string;
|
||||
'input-readonly-bg': string;
|
||||
'input-readonly-border': string;
|
||||
|
||||
/* Choice Entry */
|
||||
'choice-entry-bg': string;
|
||||
'choice-entry-border': string;
|
||||
'choice-entry-border-hover': string;
|
||||
|
||||
/* Select Buttons */
|
||||
'select-button-fg': string;
|
||||
'select-button-placeholder-fg': string;
|
||||
'select-button-disabled-fg': string;
|
||||
'select-button-bg': string;
|
||||
'select-button-border': string;
|
||||
'select-button-border-invalid': string;
|
||||
|
||||
/* Menus */
|
||||
'menu-text': string;
|
||||
'menu-light-text': string;
|
||||
'menu-bg': string;
|
||||
'menu-subheader-fg': string;
|
||||
'menu-border': string;
|
||||
'menu-shadow': string;
|
||||
|
||||
/* Menu Items */
|
||||
'menu-item-fg': string;
|
||||
'menu-item-selected-fg': string;
|
||||
'menu-item-selected-bg': string;
|
||||
'menu-item-disabled-fg': string;
|
||||
'menu-item-icon-fg': string;
|
||||
'menu-item-icon-selected-fg': string;
|
||||
'menu-item-link-fg': string;
|
||||
'menu-item-link-selected-fg': string;
|
||||
'menu-item-link-selected-bg': string;
|
||||
|
||||
/* Autocomplete */
|
||||
'autocomplete-match-text': string;
|
||||
'autocomplete-selected-match-text': string;
|
||||
'autocomplete-item-selected-bg': string;
|
||||
|
||||
/* Search */
|
||||
'search-border': string;
|
||||
'search-prev-next-button-fg': string;
|
||||
'search-prev-next-button-bg': string;
|
||||
|
||||
/* Loaders */
|
||||
'loader-fg': string;
|
||||
'loader-bg': string;
|
||||
|
||||
/* Site Switcher */
|
||||
'site-switcher-active-fg': string;
|
||||
'site-switcher-active-bg': string;
|
||||
|
||||
/* Doc Menu */
|
||||
'doc-menu-doc-options-fg': string;
|
||||
'doc-menu-doc-options-hover-fg': string;
|
||||
'doc-menu-doc-options-hover-bg': string;
|
||||
|
||||
/* Shortcut Keys */
|
||||
'shortcut-key-fg': string;
|
||||
'shortcut-key-primary-fg': string;
|
||||
'shortcut-key-secondary-fg': string;
|
||||
'shortcut-key-bg': string;
|
||||
'shortcut-key-border': string;
|
||||
|
||||
/* Breadcrumbs */
|
||||
'breadcrumbs-tag-fg': string;
|
||||
'breadcrumbs-tag-bg': string;
|
||||
'breadcrumbs-tag-alert-bg': string;
|
||||
|
||||
/* Page Widget Picker */
|
||||
'widget-picker-primary-bg': string;
|
||||
'widget-picker-secondary-bg': string;
|
||||
'widget-picker-item-fg': string;
|
||||
'widget-picker-item-selected-bg': string;
|
||||
'widget-picker-item-disabled-bg': string;
|
||||
'widget-picker-icon': string;
|
||||
'widget-picker-primary-icon': string;
|
||||
'widget-picker-summary-icon': string;
|
||||
'widget-picker-border': string;
|
||||
'widget-picker-shadow': string;
|
||||
|
||||
/* Code View */
|
||||
'code-view-text': string;
|
||||
'code-view-keyword': string;
|
||||
'code-view-comment': string;
|
||||
'code-view-meta': string;
|
||||
'code-view-title': string;
|
||||
'code-view-params': string;
|
||||
'code-view-string': string;
|
||||
'code-view-number': string;
|
||||
|
||||
/* Importer */
|
||||
'importer-table-info-border': string;
|
||||
'importer-preview-border': string;
|
||||
'importer-skipped-table-overlay': string;
|
||||
'importer-match-icon': string;
|
||||
|
||||
/* Menu Toggles */
|
||||
'menu-toggle-fg': string;
|
||||
'menu-toggle-hover-fg': string;
|
||||
'menu-toggle-active-fg': string;
|
||||
'menu-toggle-bg': string;
|
||||
'menu-toggle-border': string;
|
||||
|
||||
/* Button Groups */
|
||||
'button-group-fg': string;
|
||||
'button-group-light-fg': string;
|
||||
'button-group-bg': string;
|
||||
'button-group-icon': string;
|
||||
'button-group-border': string;
|
||||
'button-group-border-hover': string;
|
||||
'button-group-selected-fg': string;
|
||||
'button-group-light-selected-fg': string;
|
||||
'button-group-selected-bg': string;
|
||||
'button-group-selected-border': string;
|
||||
|
||||
/* Access Rules */
|
||||
'access-rules-table-header-fg': string;
|
||||
'access-rules-table-header-bg': string;
|
||||
'access-rules-table-body-fg': string;
|
||||
'access-rules-table-border': string;
|
||||
|
||||
/* Cells */
|
||||
'cell-fg': string;
|
||||
'cell-bg': string;
|
||||
'cell-zebra-bg': string;
|
||||
|
||||
/* Formula Editor */
|
||||
'formula-editor-bg': string;
|
||||
|
||||
/* Charts */
|
||||
'chart-fg': string;
|
||||
'chart-bg': string;
|
||||
'chart-legend-bg': string;
|
||||
'chart-x-axis': string;
|
||||
'chart-y-axis': string;
|
||||
}
|
||||
|
||||
export const ThemePrefsChecker = createCheckers(ThemePrefsTI).ThemePrefs as CheckerT<ThemePrefs>;
|
||||
|
||||
export function getDefaultThemePrefs(): ThemePrefs {
|
||||
return {
|
||||
appearance: 'light',
|
||||
syncWithOS: false,
|
||||
colors: {
|
||||
light: 'GristLight',
|
||||
dark: 'GristDark',
|
||||
}
|
||||
};
|
||||
}
|
||||
50
app/common/Themes.ts
Normal file
50
app/common/Themes.ts
Normal file
@@ -0,0 +1,50 @@
|
||||
import {ThemeColors, ThemeName} from 'app/common/ThemePrefs';
|
||||
import {GristDark} from 'app/common/themes/GristDark';
|
||||
import {GristLight} from 'app/common/themes/GristLight';
|
||||
|
||||
const THEMES: Readonly<Record<ThemeName, ThemeColors>> = {
|
||||
GristLight,
|
||||
GristDark,
|
||||
};
|
||||
|
||||
export function getThemeColors(themeName: ThemeName): ThemeColors {
|
||||
return THEMES[themeName];
|
||||
}
|
||||
|
||||
/**
|
||||
* A simple JS script that handles setting an appropriate background image
|
||||
* based on the appearance setting most recently set by the client.
|
||||
*
|
||||
* The motivation for this snippet is to avoid the FOUC-like effect that can
|
||||
* occur when Grist is loading a page, typically manifesting as a momentary flash
|
||||
* from a light background to a dark background (and vice versa). By predicting what
|
||||
* the appearance should be based on what was last stored in local storage, we can set
|
||||
* a suitable background image before the application (and consequently, the user's
|
||||
* theme preferences) have loaded, which should avoid the flash in most cases.
|
||||
*
|
||||
* Simpler alternatives exist, like using the user agent's preferred color scheme, but
|
||||
* don't account for the fact that Grist allows users to manually set their preferred
|
||||
* appearance. While this solution isn't perfect, it's a significant improvement over the
|
||||
* default behavior.
|
||||
*/
|
||||
export function getThemeBackgroundSnippet() {
|
||||
/* Note that we only need to set the property if the appearance is dark; a fallback
|
||||
* to the light background (gplaypattern.png) already exists in App.css. */
|
||||
return `
|
||||
<script>
|
||||
try {
|
||||
if (localStorage.getItem('appearance') === 'dark' && !window.gristConfig.enableCustomCss) {
|
||||
const style = document.createElement('style');
|
||||
style.setAttribute('id', 'grist-theme');
|
||||
style.textContent = ':root {\\n' +
|
||||
' --grist-theme-bg: url("img/prismpattern.png");\\n' +
|
||||
' --grist-theme-bg-color: #333333;\\n' +
|
||||
'}';
|
||||
document.head.append(style);
|
||||
}
|
||||
} catch {
|
||||
/* Do nothing. */
|
||||
}
|
||||
</script>
|
||||
`;
|
||||
}
|
||||
@@ -558,6 +558,9 @@ export interface GristLoadConfig {
|
||||
|
||||
// String to append to the end of the HTML document.title
|
||||
pageTitleSuffix?: string;
|
||||
|
||||
// If custom CSS should be included in the head of each page.
|
||||
enableCustomCss?: boolean;
|
||||
}
|
||||
|
||||
export const HideableUiElements = StringUnion("helpCenter", "billing", "templates", "multiSite", "multiAccounts");
|
||||
|
||||
396
app/common/themes/GristDark.ts
Normal file
396
app/common/themes/GristDark.ts
Normal file
@@ -0,0 +1,396 @@
|
||||
import {ThemeColors} from 'app/common/ThemePrefs';
|
||||
|
||||
export const GristDark: ThemeColors = {
|
||||
/* Text */
|
||||
'text': '#EFEFEF',
|
||||
'text-light': '#A4A4A4',
|
||||
'text-dark': '#FFFFFF',
|
||||
'text-error': '#FF6666',
|
||||
'text-danger': '#FFA500',
|
||||
'text-disabled': '#A4A4A4',
|
||||
|
||||
/* Page */
|
||||
'page-bg': '#262633',
|
||||
'page-backdrop': 'black',
|
||||
|
||||
/* Page Panels */
|
||||
'page-panels-main-panel-bg': '#32323F',
|
||||
'page-panels-left-panel-bg': '#262633',
|
||||
'page-panels-right-panel-bg': '#262633',
|
||||
'page-panels-top-header-bg': '#32323F',
|
||||
'page-panels-bottom-footer-bg': '#32323F',
|
||||
'page-panels-border': '#57575F',
|
||||
'page-panels-border-resizing': '#1DA270',
|
||||
'page-panels-side-panel-opener-fg': '#A4A4A4',
|
||||
'page-panels-side-panel-opener-active-fg': '#FFFFFF',
|
||||
'page-panels-side-panel-opener-active-bg': '#1DA270',
|
||||
|
||||
/* Add New */
|
||||
'add-new-circle-fg': '#FFFFFF',
|
||||
'add-new-circle-bg': '#157A54',
|
||||
'add-new-circle-hover-bg': '#0A5438',
|
||||
'add-new-circle-small-fg': '#FFFFFF',
|
||||
'add-new-circle-small-bg': '#1DA270',
|
||||
'add-new-circle-small-hover-bg': '#157A54',
|
||||
|
||||
/* Top Bar */
|
||||
'top-bar-button-primary-fg': '#1DA270',
|
||||
'top-bar-button-secondary-fg': '#A4A4A4',
|
||||
'top-bar-button-disabled-fg': '#69697D',
|
||||
'top-bar-button-error-fg': 'FF6666',
|
||||
|
||||
/* Notifications */
|
||||
'notifications-panel-header-bg': '#262633',
|
||||
'notifications-panel-body-bg': '#32323F',
|
||||
'notifications-panel-border': '#69697D',
|
||||
|
||||
/* Toasts */
|
||||
'toast-text': '#FFFFFF',
|
||||
'toast-text-light': '#929299',
|
||||
'toast-bg': '#040404',
|
||||
'toast-error-icon': '#D0021B',
|
||||
'toast-error-bg': '#D0021B',
|
||||
'toast-success-icon': '#009058',
|
||||
'toast-success-bg': '#009058',
|
||||
'toast-warning-icon': '#F9AE41',
|
||||
'toast-warning-bg': '#DD962C',
|
||||
'toast-info-icon': '#3B82F6',
|
||||
'toast-info-bg': '#3B82F6',
|
||||
'toast-control-fg': '#16B378',
|
||||
'toast-control-info-fg': '#87B2F9',
|
||||
|
||||
/* Tooltips */
|
||||
'tooltip-fg': 'white',
|
||||
'tooltip-bg': 'rgba(0, 0, 0, 0.75)',
|
||||
'tooltip-icon': '#A4A4A4',
|
||||
'tooltip-close-button-fg': 'white',
|
||||
'tooltip-close-button-hover-fg': 'black',
|
||||
'tooltip-close-button-hover-bg': 'white',
|
||||
|
||||
/* Modals */
|
||||
'modal-bg': '#32323F',
|
||||
'modal-backdrop': 'rgba(0,0,0,0.6)',
|
||||
'modal-border': '#57575F',
|
||||
'modal-border-dark': '#69697D',
|
||||
'modal-border-hover': '#A4A4A4',
|
||||
'modal-shadow-inner': '#000000',
|
||||
'modal-shadow-outer': '#000000',
|
||||
'modal-close-button-fg': '#A4A4A4',
|
||||
'modal-backdrop-close-button-fg': '#1DA270',
|
||||
'modal-backdrop-close-button-hover-fg': '#157A54',
|
||||
|
||||
/* Popups */
|
||||
'popup-bg': '#32323F',
|
||||
'popup-shadow-inner': '#000000',
|
||||
'popup-shadow-outer': '#000000',
|
||||
'popup-close-button-fg': '#A4A4A4',
|
||||
|
||||
/* Progress Bars */
|
||||
'progress-bar-fg': '#1DA270',
|
||||
'progress-bar-error-fg': '#FF6666',
|
||||
'progress-bar-bg': '#69697D',
|
||||
|
||||
/* Links */
|
||||
'link': '#1DA270',
|
||||
'link-hover': '#1DA270',
|
||||
|
||||
/* Hover */
|
||||
'hover': 'rgba(111,111,117,0.6)',
|
||||
'hover-light': 'rgba(111,111,117,0.4)',
|
||||
|
||||
/* Cell Editor */
|
||||
'cell-editor-fg': '#FFFFFF',
|
||||
'cell-editor-bg': '#32323F',
|
||||
|
||||
/* Cursor */
|
||||
'cursor': '#1DA270',
|
||||
'cursor-inactive': 'rgba(29,162,112,0.5)',
|
||||
'cursor-readonly': '#A4A4A4',
|
||||
|
||||
/* Tables */
|
||||
'table-header-fg': '#EFEFEF',
|
||||
'table-header-selected-fg': '#EFEFEF',
|
||||
'table-header-bg': '#262633',
|
||||
'table-header-selected-bg': '#414358',
|
||||
'table-header-border': '#57575F',
|
||||
'table-header-border-dark': '#69697D',
|
||||
'table-body-bg': '#32323F',
|
||||
'table-body-border': '#69697D',
|
||||
'table-add-new-bg': '#4A4A5D',
|
||||
'table-scroll-shadow': '#000000',
|
||||
'table-frozen-columns-border': '#A4A4A4',
|
||||
'table-drag-drop-indicator': '#A4A4A4',
|
||||
'table-drag-drop-shadow': 'rgba(111,111,117,0.6)',
|
||||
|
||||
/* Cards */
|
||||
'card-compact-widget-bg': '#262633',
|
||||
'card-compact-record-bg': '#32323F',
|
||||
'card-blocks-bg': '#404150',
|
||||
'card-form-label': '#A4A4A4',
|
||||
'card-compact-label': '#A4A4A4',
|
||||
'card-blocks-label': '#A4A4A4',
|
||||
'card-form-border': '#69697D',
|
||||
'card-compact-border': '#69697D',
|
||||
'card-editing-layout-bg': 'rgba(85, 85, 99, 0.2)',
|
||||
'card-editing-layout-border': '#69697D',
|
||||
|
||||
/* Card Lists */
|
||||
'card-list-form-border': '#57575F',
|
||||
'card-list-blocks-border': '#57575F',
|
||||
|
||||
/* Selection */
|
||||
'selection': 'rgba(22,179,120,0.15)',
|
||||
'selection-opaque-fg': 'white',
|
||||
'selection-opaque-bg': '#2F4748',
|
||||
'selection-opaque-dark-bg': '#253E3E',
|
||||
|
||||
/* Widgets */
|
||||
'widget-border': '#57575F',
|
||||
'widget-active-border': '#1DA270',
|
||||
'widget-inactive-stripes-light': '#262633',
|
||||
'widget-inactive-stripes-dark': '#32323F',
|
||||
|
||||
/* Pinned Docs */
|
||||
'pinned-doc-footer-bg': '#32323F',
|
||||
'pinned-doc-border': '#57575F',
|
||||
'pinned-doc-border-hover': '#A4A4A4',
|
||||
'pinned-doc-editor-bg': '#57575F',
|
||||
|
||||
/* Raw Data */
|
||||
'raw-data-table-border': '#57575F',
|
||||
'raw-data-table-border-hover': '#A4A4A4',
|
||||
|
||||
/* Controls */
|
||||
'control-fg': '#1DA270',
|
||||
'control-primary-fg': '#FFFFFF',
|
||||
'control-primary-bg': '#1DA270',
|
||||
'control-secondary-fg': '#A4A4A4',
|
||||
'control-hover-fg': '#157A54',
|
||||
'control-primary-hover-bg': '#157A54',
|
||||
'control-secondary-hover-fg': '#EFEFEF',
|
||||
'control-secondary-hover-bg': '#57575F',
|
||||
'control-disabled-fg': '#A4A4A4',
|
||||
'control-disabled-bg': '#69697D',
|
||||
'control-primary-disabled': '#5F8C7B',
|
||||
'control-border': '#11B683',
|
||||
|
||||
/* Checkboxes */
|
||||
'checkbox-bg': '#32323F',
|
||||
'checkbox-disabled-bg': '#69697D',
|
||||
'checkbox-border': '#69697D',
|
||||
'checkbox-border-hover': '#57575F',
|
||||
|
||||
/* Move Docs */
|
||||
'move-docs-selected-fg': '#FFFFFF',
|
||||
'move-docs-selected-bg': '#1DA270',
|
||||
'move-docs-disabled-bg': '#69697D',
|
||||
|
||||
/* Filter Bar */
|
||||
'filter-bar-button-saved-fg': '#FFFFFF',
|
||||
'filter-bar-button-saved-bg': '#555563',
|
||||
'filter-bar-button-saved-hover-bg': '#69697D',
|
||||
|
||||
/* Icon Buttons */
|
||||
'icon-button-fg': '#FFFFFF',
|
||||
'icon-button-primary-bg': '#1DA270',
|
||||
'icon-button-primary-hover-bg': '#157A54',
|
||||
'icon-button-secondary-bg': '#69697D',
|
||||
'icon-button-secondary-hover-bg': '#A4A4A4',
|
||||
|
||||
/* Left Panel */
|
||||
'left-panel-page-hover-bg': 'rgba(111,111,117,0.25)',
|
||||
'left-panel-active-page-fg': '#EFEFEF',
|
||||
'left-panel-active-page-bg': '#555563',
|
||||
'left-panel-disabled-page-fg': '#69697D',
|
||||
'left-panel-page-options-fg': '#A4A4A4',
|
||||
'left-panel-page-options-hover-fg': '#FFFFFF',
|
||||
'left-panel-page-options-hover-bg': '#69697D',
|
||||
'left-panel-page-options-selected-hover-bg': '#A4A4A4',
|
||||
'left-panel-page-initials-fg': 'white',
|
||||
'left-panel-page-initials-bg': '#929299',
|
||||
|
||||
/* Right Panel */
|
||||
'right-panel-tab-fg': '#EFEFEF',
|
||||
'right-panel-tab-bg': '#262633',
|
||||
'right-panel-tab-icon': '#A4A4A4',
|
||||
'right-panel-tab-icon-hover': '#1DA270',
|
||||
'right-panel-tab-hover-bg': 'rgba(111,111,117,0.6)',
|
||||
'right-panel-tab-selected-fg': '#FFFFFF',
|
||||
'right-panel-tab-selected-bg': '#1DA270',
|
||||
'right-panel-tab-close-button-hover-bg': '#157A54',
|
||||
'right-panel-subtab-fg': '#1DA270',
|
||||
'right-panel-subtab-selected-fg': '#EFEFEF',
|
||||
'right-panel-subtab-selected-underline': '#1DA270',
|
||||
'right-panel-subtab-hover-fg': '#157A54',
|
||||
'right-panel-subtab-hover-underline': '#1DA270',
|
||||
'right-panel-disabled-overlay': '#262633',
|
||||
'right-panel-toggle-button-enabled-fg': '#FFFFFF',
|
||||
'right-panel-toggle-button-enabled-bg': '#555563',
|
||||
'right-panel-toggle-button-enabled-hover-fg': '#D9D9D9',
|
||||
'right-panel-toggle-button-disabled-fg': '#FFFFFF',
|
||||
'right-panel-toggle-button-disabled-bg': '#E8E8E8',
|
||||
'right-panel-field-settings-bg': '#414358',
|
||||
'right-panel-field-settings-button-bg': '#57575F',
|
||||
|
||||
/* Document History */
|
||||
'document-history-snapshot-fg': '#EFEFEF',
|
||||
'document-history-snapshot-selected-fg': '#EFEFEF',
|
||||
'document-history-snapshot-bg': '#32323F',
|
||||
'document-history-snapshot-selected-bg': '#555563',
|
||||
'document-history-snapshot-border': '#69697D',
|
||||
'document-history-activity-text': '#EFEFEF',
|
||||
'document-history-activity-text-light': '#A4A4A4',
|
||||
|
||||
/* Accents */
|
||||
'accent-icon': '#1DA270',
|
||||
'accent-border': '#1DA270',
|
||||
'accent-text': '#1DA270',
|
||||
|
||||
/* Inputs */
|
||||
'input-fg': '#EFEFEF',
|
||||
'input-bg': '#32323F',
|
||||
'input-disabled-fg': '#A4A4A4',
|
||||
'input-disabled-bg': '#262633',
|
||||
'input-placeholder-fg': '#A4A4A4',
|
||||
'input-border': '#69697D',
|
||||
'input-valid': '#1DA270',
|
||||
'input-invalid': '#FF6666',
|
||||
'input-focus': '#5E9ED6',
|
||||
'input-readonly-bg': '#262633',
|
||||
'input-readonly-border': '#69697D',
|
||||
|
||||
/* Choice Entry */
|
||||
'choice-entry-bg': '#32323F',
|
||||
'choice-entry-border': '#69697D',
|
||||
'choice-entry-border-hover': '#A4A4A4',
|
||||
|
||||
/* Select Buttons */
|
||||
'select-button-fg': '#EFEFEF',
|
||||
'select-button-placeholder-fg': '#A4A4A4',
|
||||
'select-button-disabled-fg': '#A4A4A4',
|
||||
'select-button-bg': '#32323F',
|
||||
'select-button-border': '#69697D',
|
||||
'select-button-border-invalid': '#FF6666',
|
||||
|
||||
/* Menus */
|
||||
'menu-text': '#A4A4A4',
|
||||
'menu-light-text': '#A4A4A4',
|
||||
'menu-bg': '#32323F',
|
||||
'menu-subheader-fg': '#EFEFEF',
|
||||
'menu-border': '#69697D',
|
||||
'menu-shadow': '#000000',
|
||||
|
||||
/* Menu Items */
|
||||
'menu-item-fg': '#FFFFFF',
|
||||
'menu-item-selected-fg': '#FFFFFF',
|
||||
'menu-item-selected-bg': '#1DA270',
|
||||
'menu-item-disabled-fg': '#69697D',
|
||||
'menu-item-icon-fg': '#A4A4A4',
|
||||
'menu-item-icon-selected-fg': '#FFFFFF',
|
||||
'menu-item-link-fg': '#1DA270',
|
||||
'menu-item-link-selected-fg': '#157A54',
|
||||
'menu-item-link-selected-bg': '#484859',
|
||||
|
||||
/* Autocomplete */
|
||||
'autocomplete-match-text': '#1DA270',
|
||||
'autocomplete-selected-match-text': '#0A5438',
|
||||
'autocomplete-item-selected-bg': '#69697D',
|
||||
|
||||
/* Search */
|
||||
'search-border': '#69697D',
|
||||
'search-prev-next-button-fg': '#A4A4A4',
|
||||
'search-prev-next-button-bg': '#24242F',
|
||||
|
||||
/* Loading Spinners */
|
||||
'loader-fg': '#1DA270',
|
||||
'loader-bg': '#69697D',
|
||||
|
||||
/* Site Switcher */
|
||||
'site-switcher-active-fg': '#FFFFFF',
|
||||
'site-switcher-active-bg': '#000000',
|
||||
|
||||
/* Doc Menu */
|
||||
'doc-menu-doc-options-fg': '#69697D',
|
||||
'doc-menu-doc-options-hover-fg': '#A4A4A4',
|
||||
'doc-menu-doc-options-hover-bg': '#69697D',
|
||||
|
||||
/* Shortcut Keys */
|
||||
'shortcut-key-fg': '#FFFFFF',
|
||||
'shortcut-key-primary-fg': '#17B378',
|
||||
'shortcut-key-secondary-fg': '#A4A4A4',
|
||||
'shortcut-key-bg': '#32323F',
|
||||
'shortcut-key-border': '#A4A4A4',
|
||||
|
||||
/* Breadcrumbs */
|
||||
'breadcrumbs-tag-fg': 'white',
|
||||
'breadcrumbs-tag-bg': '#929299',
|
||||
'breadcrumbs-tag-alert-bg': '#D0021B',
|
||||
|
||||
/* Page Widget Picker */
|
||||
'widget-picker-primary-bg': '#32323F',
|
||||
'widget-picker-secondary-bg': '#262633',
|
||||
'widget-picker-item-fg': '#FFFFFF',
|
||||
'widget-picker-item-selected-bg': 'rgba(111,111,117,0.6)',
|
||||
'widget-picker-item-disabled-bg': 'rgba(111,111,117,0.6)',
|
||||
'widget-picker-icon': '#A4A4A4',
|
||||
'widget-picker-primary-icon': '#1DA270',
|
||||
'widget-picker-summary-icon': '#1DA270',
|
||||
'widget-picker-border': 'rgba(111,111,117,0.6)',
|
||||
'widget-picker-shadow': '#000000',
|
||||
|
||||
/* Code View */
|
||||
'code-view-text': '#D2D2D2',
|
||||
'code-view-keyword': '#D2D2D2',
|
||||
'code-view-comment': '#888888',
|
||||
'code-view-meta': '#7CD4FF',
|
||||
'code-view-title': '#ED7373',
|
||||
'code-view-params': '#D2D2D2',
|
||||
'code-view-string': '#ED7373',
|
||||
'code-view-number': '#ED7373',
|
||||
|
||||
/* Importer */
|
||||
'importer-table-info-border': '#69697D',
|
||||
'importer-preview-border': '#69697D',
|
||||
'importer-skipped-table-overlay': 'rgba(111,111,117,0.6)',
|
||||
'importer-match-icon': '#69697D',
|
||||
|
||||
/* Menu Toggles */
|
||||
'menu-toggle-fg': '#A4A4A4',
|
||||
'menu-toggle-hover-fg': '#1DA270',
|
||||
'menu-toggle-active-fg': '#157A54',
|
||||
'menu-toggle-bg': '#32323F',
|
||||
'menu-toggle-border': '#A4A4A4',
|
||||
|
||||
/* Button Groups */
|
||||
'button-group-fg': '#EFEFEF',
|
||||
'button-group-light-fg': '#A4A4A4',
|
||||
'button-group-bg': 'unset',
|
||||
'button-group-icon': '#A4A4A4',
|
||||
'button-group-border': '#69697D',
|
||||
'button-group-border-hover': '#555563',
|
||||
'button-group-selected-fg': '#EFEFEF',
|
||||
'button-group-light-selected-fg': '#1DA270',
|
||||
'button-group-selected-bg': '#555563',
|
||||
'button-group-selected-border': '#555563',
|
||||
|
||||
/* Access Rules */
|
||||
'access-rules-table-header-fg': '#EFEFEF',
|
||||
'access-rules-table-header-bg': '#57575F',
|
||||
'access-rules-table-body-fg': '#A4A4A4',
|
||||
'access-rules-table-border': '#A4A4A4',
|
||||
|
||||
/* Cells */
|
||||
'cell-fg': '#FFFFFF',
|
||||
'cell-bg': '#32323F',
|
||||
'cell-zebra-bg': '#262633',
|
||||
|
||||
/* Formula Editor */
|
||||
'formula-editor-bg': '#282A36',
|
||||
|
||||
/* Charts */
|
||||
'chart-fg': '#A4A4A4',
|
||||
'chart-bg': '#32323F',
|
||||
'chart-legend-bg': '#32323F80',
|
||||
'chart-x-axis': '#A4A4A4',
|
||||
'chart-y-axis': '#A4A4A4',
|
||||
};
|
||||
396
app/common/themes/GristLight.ts
Normal file
396
app/common/themes/GristLight.ts
Normal file
@@ -0,0 +1,396 @@
|
||||
import {ThemeColors} from 'app/common/ThemePrefs';
|
||||
|
||||
export const GristLight: ThemeColors = {
|
||||
/* Text */
|
||||
'text': '#262633',
|
||||
'text-light': '#929299',
|
||||
'text-dark': 'black',
|
||||
'text-error': '#D0021B',
|
||||
'text-danger': '#FFA500',
|
||||
'text-disabled': '#929299',
|
||||
|
||||
/* Page */
|
||||
'page-bg': '#F7F7F7',
|
||||
'page-backdrop': 'grey',
|
||||
|
||||
/* Page Panels */
|
||||
'page-panels-main-panel-bg': 'white',
|
||||
'page-panels-left-panel-bg': '#F7F7F7',
|
||||
'page-panels-right-panel-bg': '#F7F7F7',
|
||||
'page-panels-top-header-bg': 'white',
|
||||
'page-panels-bottom-footer-bg': 'white',
|
||||
'page-panels-border': 'rgba(217,217,217,0.6)',
|
||||
'page-panels-border-resizing': '#16B378',
|
||||
'page-panels-side-panel-opener-fg': '#929299',
|
||||
'page-panels-side-panel-opener-active-fg': 'white',
|
||||
'page-panels-side-panel-opener-active-bg': '#16B378',
|
||||
|
||||
/* Add New */
|
||||
'add-new-circle-fg': '#FFFFFF',
|
||||
'add-new-circle-bg': '#009058',
|
||||
'add-new-circle-hover-bg': '#007548',
|
||||
'add-new-circle-small-fg': '#FFFFFF',
|
||||
'add-new-circle-small-bg': '#16B378',
|
||||
'add-new-circle-small-hover-bg': '#009058',
|
||||
|
||||
/* Top Bar */
|
||||
'top-bar-button-primary-fg': '#16B378',
|
||||
'top-bar-button-secondary-fg': '#929299',
|
||||
'top-bar-button-disabled-fg': '#D9D9D9',
|
||||
'top-bar-button-error-fg': '#D0021B',
|
||||
|
||||
/* Notifications */
|
||||
'notifications-panel-header-bg': '#F7F7F7',
|
||||
'notifications-panel-body-bg': 'white',
|
||||
'notifications-panel-border': '#D9D9D9',
|
||||
|
||||
/* Toasts */
|
||||
'toast-text': '#FFFFFF',
|
||||
'toast-text-light': '#929299',
|
||||
'toast-bg': '#040404',
|
||||
'toast-error-icon': '#D0021B',
|
||||
'toast-error-bg': '#D0021B',
|
||||
'toast-success-icon': '#009058',
|
||||
'toast-success-bg': '#009058',
|
||||
'toast-warning-icon': '#F9AE41',
|
||||
'toast-warning-bg': '#DD962C',
|
||||
'toast-info-icon': '#3B82F6',
|
||||
'toast-info-bg': '#3B82F6',
|
||||
'toast-control-fg': '#16B378',
|
||||
'toast-control-info-fg': '#87B2F9',
|
||||
|
||||
/* Tooltips */
|
||||
'tooltip-fg': 'white',
|
||||
'tooltip-bg': 'rgba(0, 0, 0, 0.75)',
|
||||
'tooltip-icon': '#929299',
|
||||
'tooltip-close-button-fg': 'white',
|
||||
'tooltip-close-button-hover-fg': 'black',
|
||||
'tooltip-close-button-hover-bg': 'white',
|
||||
|
||||
/* Modals */
|
||||
'modal-bg': 'white',
|
||||
'modal-backdrop': 'rgba(38,38,51,0.9)',
|
||||
'modal-border': '#E8E8E8',
|
||||
'modal-border-dark': '#D9D9D9',
|
||||
'modal-border-hover': '#929299',
|
||||
'modal-shadow-inner': 'rgba(31,37,50,0.31)',
|
||||
'modal-shadow-outer': 'rgba(76,86,103,0.24)',
|
||||
'modal-close-button-fg': '#929299',
|
||||
'modal-backdrop-close-button-fg': '#16B378',
|
||||
'modal-backdrop-close-button-hover-fg': '#B1FFE2',
|
||||
|
||||
/* Popups */
|
||||
'popup-bg': 'white',
|
||||
'popup-shadow-inner': 'rgba(31, 37, 50, 0.31)',
|
||||
'popup-shadow-outer': 'rgba(76, 86, 103, 0.24)',
|
||||
'popup-close-button-fg': '#929299',
|
||||
|
||||
/* Progress Bars */
|
||||
'progress-bar-fg': '#16B378',
|
||||
'progress-bar-error-fg': '#D0021B',
|
||||
'progress-bar-bg': '#D9D9D9',
|
||||
|
||||
/* Links */
|
||||
'link': '#16B378',
|
||||
'link-hover': '#16B378',
|
||||
|
||||
/* Hover */
|
||||
'hover': 'rgba(217,217,217,0.6)',
|
||||
'hover-light': '#F7F7F7',
|
||||
|
||||
/* Cell Editor */
|
||||
'cell-editor-fg': '#262633',
|
||||
'cell-editor-bg': '#FFFFFF',
|
||||
|
||||
/* Cursor */
|
||||
'cursor': '#16B378',
|
||||
'cursor-inactive': '#A2E1C9',
|
||||
'cursor-readonly': '#929299',
|
||||
|
||||
/* Tables */
|
||||
'table-header-fg': 'unset',
|
||||
'table-header-selected-fg': 'unset',
|
||||
'table-header-bg': '#F7F7F7',
|
||||
'table-header-selected-bg': '#E8E8E8',
|
||||
'table-header-border': 'lightgray',
|
||||
'table-header-border-dark': '#D9D9D9',
|
||||
'table-body-bg': 'unset',
|
||||
'table-body-border': '#D9D9D9',
|
||||
'table-add-new-bg': 'inherit',
|
||||
'table-scroll-shadow': '#444444',
|
||||
'table-frozen-columns-border': '#999999',
|
||||
'table-drag-drop-indicator': 'gray',
|
||||
'table-drag-drop-shadow': '#F0F0F0',
|
||||
|
||||
/* Cards */
|
||||
'card-compact-widget-bg': 'rgba(217,217,217,0.6)',
|
||||
'card-compact-record-bg': 'white',
|
||||
'card-blocks-bg': 'rgba(217,217,217,0.6)',
|
||||
'card-form-label': '#929299',
|
||||
'card-compact-label': '#929299',
|
||||
'card-blocks-label': '#929299',
|
||||
'card-form-border': 'lightgrey',
|
||||
'card-compact-border': '#D9D9D9',
|
||||
'card-editing-layout-bg': 'rgba(192, 192, 192, 0.2)',
|
||||
'card-editing-layout-border': '#D9D9D9',
|
||||
|
||||
/* Card Lists */
|
||||
'card-list-form-border': '#D9D9D9',
|
||||
'card-list-blocks-border': '#D9D9D9',
|
||||
|
||||
/* Selection */
|
||||
'selection': 'rgba(22,179,120,0.15)',
|
||||
'selection-opaque-fg': 'black',
|
||||
'selection-opaque-bg': '#DCF4EB',
|
||||
'selection-opaque-dark-bg': '#D6EEE5',
|
||||
|
||||
/* Widgets */
|
||||
'widget-border': '#D9D9D9',
|
||||
'widget-active-border': '#16B378',
|
||||
'widget-inactive-stripes-light': '#F7F7F7',
|
||||
'widget-inactive-stripes-dark': '#E8E8E8',
|
||||
|
||||
/* Pinned Docs */
|
||||
'pinned-doc-footer-bg': 'white',
|
||||
'pinned-doc-border': 'rgba(217,217,217,0.6)',
|
||||
'pinned-doc-border-hover': '#929299',
|
||||
'pinned-doc-editor-bg': 'rgba(217,217,217,0.6)',
|
||||
|
||||
/* Raw Data */
|
||||
'raw-data-table-border': 'rgba(217,217,217,0.6)',
|
||||
'raw-data-table-border-hover': '#929299',
|
||||
|
||||
/* Controls */
|
||||
'control-fg': '#16B378',
|
||||
'control-primary-fg': '#FFFFFF',
|
||||
'control-primary-bg': '#16B378',
|
||||
'control-secondary-fg': '#929299',
|
||||
'control-hover-fg': '#009058',
|
||||
'control-primary-hover-bg': '#009058',
|
||||
'control-secondary-hover-fg': '#262633',
|
||||
'control-secondary-hover-bg': '#D9D9D9',
|
||||
'control-disabled-fg': '#FFFFFF',
|
||||
'control-disabled-bg': '#929299',
|
||||
'control-primary-disabled': '#A2E1C9',
|
||||
'control-border': '#11B683',
|
||||
|
||||
/* Checkboxes */
|
||||
'checkbox-bg': '#FFFFFF',
|
||||
'checkbox-disabled-bg': '#D9D9D9',
|
||||
'checkbox-border': '#D9D9D9',
|
||||
'checkbox-border-hover': '#BFBFBF',
|
||||
|
||||
/* Move Docs */
|
||||
'move-docs-selected-fg': 'white',
|
||||
'move-docs-selected-bg': '#16B378',
|
||||
'move-docs-disabled-bg': '#D9D9D9',
|
||||
|
||||
/* Filter Bar */
|
||||
'filter-bar-button-saved-fg': '#FFFFFF',
|
||||
'filter-bar-button-saved-bg': '#929299',
|
||||
'filter-bar-button-saved-hover-bg': '#D9D9D9',
|
||||
|
||||
/* Icon Buttons */
|
||||
'icon-button-fg': '#FFFFFF',
|
||||
'icon-button-primary-bg': '#16B378',
|
||||
'icon-button-primary-hover-bg': '#009058',
|
||||
'icon-button-secondary-bg': '#D9D9D9',
|
||||
'icon-button-secondary-hover-bg': '#929299',
|
||||
|
||||
/* Left Panel */
|
||||
'left-panel-page-hover-bg': 'rgba(217,217,217,0.6)',
|
||||
'left-panel-active-page-fg': '#FFFFFF',
|
||||
'left-panel-active-page-bg': '#262633',
|
||||
'left-panel-disabled-page-fg': '#D9D9D9',
|
||||
'left-panel-page-options-fg': '#929299',
|
||||
'left-panel-page-options-hover-fg': 'white',
|
||||
'left-panel-page-options-hover-bg': '#D9D9D9',
|
||||
'left-panel-page-options-selected-hover-bg': '#929299',
|
||||
'left-panel-page-initials-fg': 'white',
|
||||
'left-panel-page-initials-bg': '#929299',
|
||||
|
||||
/* Right Panel */
|
||||
'right-panel-tab-fg': '#262633',
|
||||
'right-panel-tab-bg': '#F7F7F7',
|
||||
'right-panel-tab-icon': '#929299',
|
||||
'right-panel-tab-icon-hover': '#16B378',
|
||||
'right-panel-tab-hover-bg': 'rgba(217,217,217,0.6)',
|
||||
'right-panel-tab-selected-fg': '#FFFFFF',
|
||||
'right-panel-tab-selected-bg': '#16B378',
|
||||
'right-panel-tab-close-button-hover-bg': '#009058',
|
||||
'right-panel-subtab-fg': '#16B378',
|
||||
'right-panel-subtab-selected-fg': '#262633',
|
||||
'right-panel-subtab-selected-underline': '#16B378',
|
||||
'right-panel-subtab-hover-fg': '#009058',
|
||||
'right-panel-subtab-hover-underline': '#16B378',
|
||||
'right-panel-disabled-overlay': 'white',
|
||||
'right-panel-toggle-button-enabled-fg': '#FFFFFF',
|
||||
'right-panel-toggle-button-enabled-bg': '#262633',
|
||||
'right-panel-toggle-button-enabled-hover-fg': '#D9D9D9',
|
||||
'right-panel-toggle-button-disabled-fg': '#FFFFFF',
|
||||
'right-panel-toggle-button-disabled-bg': '#E8E8E8',
|
||||
'right-panel-field-settings-bg': '#E8E8E8',
|
||||
'right-panel-field-settings-button-bg': 'lightgrey',
|
||||
|
||||
/* Document History */
|
||||
'document-history-snapshot-fg': '#262633',
|
||||
'document-history-snapshot-selected-fg': '#FFFFFF',
|
||||
'document-history-snapshot-bg': 'white',
|
||||
'document-history-snapshot-selected-bg': '#262633',
|
||||
'document-history-snapshot-border': 'rgba(217,217,217,0.6)',
|
||||
'document-history-activity-text': '#000000',
|
||||
'document-history-activity-text-light': '#333333',
|
||||
|
||||
/* Accents */
|
||||
'accent-icon': '#16B378',
|
||||
'accent-border': '#16B378',
|
||||
'accent-text': '#16B378',
|
||||
|
||||
/* Inputs */
|
||||
'input-fg': 'black',
|
||||
'input-bg': 'white',
|
||||
'input-disabled-fg': '#929299',
|
||||
'input-disabled-bg': '#F7F7F7',
|
||||
'input-placeholder-fg': '#929299',
|
||||
'input-border': '#D9D9D9',
|
||||
'input-valid': '#16B378',
|
||||
'input-invalid': '#D0021B',
|
||||
'input-focus': '#5E9ED6',
|
||||
'input-readonly-bg': '#F7F7F7',
|
||||
'input-readonly-border': '#E8E8E8',
|
||||
|
||||
/* Choice Entry */
|
||||
'choice-entry-bg': 'white',
|
||||
'choice-entry-border': '#D9D9D9',
|
||||
'choice-entry-border-hover': '#BFBFBF',
|
||||
|
||||
/* Select Buttons */
|
||||
'select-button-fg': '#262633',
|
||||
'select-button-placeholder-fg': '#929299',
|
||||
'select-button-disabled-fg': 'grey',
|
||||
'select-button-bg': 'white',
|
||||
'select-button-border': '#D9D9D9',
|
||||
'select-button-border-invalid': '#D0021B',
|
||||
|
||||
/* Menus */
|
||||
'menu-text': '#929299',
|
||||
'menu-light-text': '#929299',
|
||||
'menu-bg': 'white',
|
||||
'menu-subheader-fg': 'unset',
|
||||
'menu-border': '#E8E8E8',
|
||||
'menu-shadow': 'rgba(38, 38, 51, 0.6)',
|
||||
|
||||
/* Menu Items */
|
||||
'menu-item-fg': 'black',
|
||||
'menu-item-selected-fg': '#FFFFFF',
|
||||
'menu-item-selected-bg': '#16B378',
|
||||
'menu-item-disabled-fg': '#D9D9D9',
|
||||
'menu-item-icon-fg': '#929299',
|
||||
'menu-item-icon-selected-fg': 'white',
|
||||
'menu-item-link-fg': '#16B378',
|
||||
'menu-item-link-selected-fg': '#009058',
|
||||
'menu-item-link-selected-bg': '#E8E8E8',
|
||||
|
||||
/* Autocomplete */
|
||||
'autocomplete-match-text': '#16B378',
|
||||
'autocomplete-selected-match-text': '#B1FFE2',
|
||||
'autocomplete-item-selected-bg': '#E8E8E8',
|
||||
|
||||
/* Search */
|
||||
'search-border': 'grey',
|
||||
'search-prev-next-button-fg': '#929299',
|
||||
'search-prev-next-button-bg': 'rgba(217,217,217,0.6)',
|
||||
|
||||
/* Loaders */
|
||||
'loader-fg': '#16B378',
|
||||
'loader-bg': '#D9D9D9',
|
||||
|
||||
/* Site Switcher */
|
||||
'site-switcher-active-fg': '#FFFFFF',
|
||||
'site-switcher-active-bg': '#262633',
|
||||
|
||||
/* Doc Menu */
|
||||
'doc-menu-doc-options-fg': '#D9D9D9',
|
||||
'doc-menu-doc-options-hover-fg': '#929299',
|
||||
'doc-menu-doc-options-hover-bg': '#D9D9D9',
|
||||
|
||||
/* Shortcut Keys */
|
||||
'shortcut-key-fg': 'black',
|
||||
'shortcut-key-primary-fg': '#009058',
|
||||
'shortcut-key-secondary-fg': '#929299',
|
||||
'shortcut-key-bg': 'white',
|
||||
'shortcut-key-border': '#929299',
|
||||
|
||||
/* Breadcrumbs */
|
||||
'breadcrumbs-tag-fg': 'white',
|
||||
'breadcrumbs-tag-bg': '#929299',
|
||||
'breadcrumbs-tag-alert-bg': '#D0021B',
|
||||
|
||||
/* Page Widget Picker */
|
||||
'widget-picker-primary-bg': 'white',
|
||||
'widget-picker-secondary-bg': '#F7F7F7',
|
||||
'widget-picker-item-fg': 'black',
|
||||
'widget-picker-item-selected-bg': 'rgba(217,217,217,0.6)',
|
||||
'widget-picker-item-disabled-bg': 'rgba(217,217,217,0.6)',
|
||||
'widget-picker-icon': '#929299',
|
||||
'widget-picker-primary-icon': '#16B378',
|
||||
'widget-picker-summary-icon': '#009058',
|
||||
'widget-picker-border': 'rgba(217,217,217,0.6)',
|
||||
'widget-picker-shadow': 'rgba(38,38,51,0.20)',
|
||||
|
||||
/* Code View */
|
||||
'code-view-text': '#444',
|
||||
'code-view-keyword': '#444',
|
||||
'code-view-comment': '#888888',
|
||||
'code-view-meta': '#1F7199',
|
||||
'code-view-title': '#880000',
|
||||
'code-view-params': '#444',
|
||||
'code-view-string': '#880000',
|
||||
'code-view-number': '#880000',
|
||||
|
||||
/* Importer */
|
||||
'importer-table-info-border': '#D9D9D9',
|
||||
'importer-preview-border': '#D9D9D9',
|
||||
'importer-skipped-table-overlay': 'rgba(217,217,217,0.6)',
|
||||
'importer-match-icon': '#D9D9D9',
|
||||
|
||||
/* Menu Toggles */
|
||||
'menu-toggle-fg': '#929299',
|
||||
'menu-toggle-hover-fg': '#009058',
|
||||
'menu-toggle-active-fg': '#007548',
|
||||
'menu-toggle-bg': 'white',
|
||||
'menu-toggle-border': '#929299',
|
||||
|
||||
/* Button Groups */
|
||||
'button-group-fg': '#262633',
|
||||
'button-group-light-fg': '#929299',
|
||||
'button-group-bg': 'unset',
|
||||
'button-group-icon': '#929299',
|
||||
'button-group-border': '#D9D9D9',
|
||||
'button-group-border-hover': '#BFBFBF',
|
||||
'button-group-selected-fg': '#FFFFFF',
|
||||
'button-group-light-selected-fg': '#16B378',
|
||||
'button-group-selected-bg': '#262633',
|
||||
'button-group-selected-border': '#262633',
|
||||
|
||||
/* Access Rules */
|
||||
'access-rules-table-header-fg': '#262633',
|
||||
'access-rules-table-header-bg': 'rgba(217,217,217,0.6)',
|
||||
'access-rules-table-body-fg': '#929299',
|
||||
'access-rules-table-border': '#929299',
|
||||
|
||||
/* Cells */
|
||||
'cell-fg': 'black',
|
||||
'cell-bg': 'white',
|
||||
'cell-zebra-bg': '#F8F8F8',
|
||||
|
||||
/* Formula Editor */
|
||||
'formula-editor-bg': 'white',
|
||||
|
||||
/* Charts */
|
||||
'chart-fg': '#444',
|
||||
'chart-bg': '#fff',
|
||||
'chart-legend-bg': '#FFFFFF80',
|
||||
'chart-x-axis': '#444',
|
||||
'chart-y-axis': '#444',
|
||||
};
|
||||
Reference in New Issue
Block a user