40 lines
1.4 KiB
TypeScript
40 lines
1.4 KiB
TypeScript
import { css } from "@design.estate/dees-element";
|
|
import * as plugins from "./plugins.js";
|
|
|
|
export const dedocumentSharedStyle = css`
|
|
:host {
|
|
/* Primitive colors */
|
|
--color-light: #ffffff;
|
|
--color-dark: #333333;
|
|
--color-grey: #dddddd;
|
|
--color-grey-100: #dddddd;
|
|
--color-red: #e4002b;
|
|
|
|
/* Semantic colors */
|
|
--color-primary-fg: var(--theme-color-primary-fg, var(--color-dark));
|
|
--color-primary-bg: var(--theme-color-primary-bg, var(--color-light));
|
|
--color-accent-fg: var(--theme-color-accent-fg, var(--color-light));
|
|
--color-accent-bg: var(--theme-color-accent-bg, var(--color-red));
|
|
|
|
/* Functional colors */
|
|
--text-fg-color: var(--color-primary-fg);
|
|
--text-bg-color: var(--color-primary-bg);
|
|
--label-fg: var(--color-dark);
|
|
--label-bg: var(--color-grey);
|
|
--footer-separator-bg-color: var(--color-accent);
|
|
--footer-separator-fg-color: var(--color-light);
|
|
|
|
/* Functional variables */
|
|
--DPI-FACTOR: ${plugins.shared.cmToPx(1)}px;
|
|
--RIGHT-MARGIN: ${plugins.shared.cmToPx(2)}px;
|
|
--LEFT-MARGIN: ${plugins.shared.cmToPx(2)}px;
|
|
--text-font-family: var(--theme-text-font-family, "Exo 2");
|
|
--text-font-size: var(--theme-text-font-size, 12px);
|
|
|
|
color: var(--text-fg-color);
|
|
background: var(--text-bg-color);
|
|
font-family: var(--text-font-family);
|
|
font-size: var(--text-font-size);
|
|
}
|
|
`;
|