mirror of
https://github.com/gristlabs/grist-core.git
synced 2024-09-28 14:10:58 +00:00
ec157dc469
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
35 lines
831 B
TypeScript
35 lines
831 B
TypeScript
import {theme} from 'app/client/ui2018/cssVars';
|
|
import {icon} from 'app/client/ui2018/icons';
|
|
import {styled} from 'grainjs';
|
|
|
|
export const cssHoverCircle = styled('div', `
|
|
width: 32px;
|
|
height: 32px;
|
|
background: none;
|
|
border-radius: 16px;
|
|
|
|
&:hover, &.weasel-popup-open {
|
|
background-color: ${theme.hover};
|
|
}
|
|
|
|
&-disabled:hover {
|
|
background: none;
|
|
}
|
|
`);
|
|
|
|
export const cssTopBarBtn = styled(icon, `
|
|
width: 32px;
|
|
height: 32px;
|
|
padding: 8px 8px;
|
|
cursor: pointer;
|
|
-webkit-mask-size: 16px 16px;
|
|
background-color: ${theme.topBarButtonPrimaryFg};
|
|
|
|
.${cssHoverCircle.className}-disabled & {
|
|
background-color: ${theme.topBarButtonDisabledFg};
|
|
cursor: default;
|
|
}
|
|
&-slate { background-color: ${theme.topBarButtonSecondaryFg}; }
|
|
&-error { background-color: ${theme.topBarButtonErrorFg}; }
|
|
`);
|