@orchestrator-ui/orchestrator-ui-components
Version:
Library of UI Components used to display the workflow orchestrator frontend
130 lines (126 loc) • 4.18 kB
text/typescript
import type { EuiThemeComputed, EuiThemeModifications } from '@elastic/eui';
export type WfoThemeExtraColors = {
colors: {
header: string;
};
};
export type WfoThemeComputed = EuiThemeComputed<WfoThemeExtraColors>;
export const defaultOrchestratorTheme: EuiThemeModifications<WfoThemeExtraColors> =
{
base: 16,
breakpoint: {
xs: 0,
s: 575,
m: 768,
l: 992,
xl: 1200,
xxl: 1600,
},
size: {
base: '16px',
xxs: '2px',
xs: '4px',
s: '8px',
m: '12px',
l: '24px',
xl: '32px',
xxl: '40px',
xxxl: '48px',
xxxxl: '64px',
},
colors: {
DARK: {
primary: '#0077C8',
accent: '#E67300',
success: '#13B054',
warning: '#FFC514',
danger: '#FF4F46',
primaryText: '#1F8DD8',
textPrimary: '#1F8DD8',
accentText: '#E67300',
textAccent: '#E67300',
successText: '#13B054',
textSuccess: '#13B054',
warningText: '#FFC514',
textWarning: '#FFC514',
dangerText: '#FF4F46',
textDanger: '#FF4F46',
emptyShade: '#101827',
backgroundBasePlain: '#101827',
lightestShade: '#1F2937',
backgroundBaseSubdued: '#1F2937',
lightShade: '#374151',
borderBaseSubdued: '#374151',
mediumShade: '#4B5563',
borderBasePlain: '#4B5563',
darkShade: '#64758B',
darkestShade: '#F1F5F9',
fullShade: '#ffffff',
text: '#9CA3AF',
title: '#ffffff',
subduedText: '#9CA3AF',
textSubdued: '#9CA3AF',
link: '#1F8DD8',
body: '#1F2937',
highlight: '#51482F',
disabled: '#4B5563',
backgroundBaseDisabled: '#4B5563',
disabledText: '#4B5563',
textDisabled: '#4B5563',
shadow: '#000000',
},
LIGHT: {
primary: '#0077C8',
accent: '#E67300',
success: '#008939',
warning: '#FFC514',
danger: '#BD271F',
primaryText: '#0067AC',
textPrimary: '#0067AC',
accentText: '#B05200',
textAccent: '#B05200',
successText: '#007832',
textSuccess: '#007832',
warningText: '#8E6A00',
textWarning: '#8E6A00',
dangerText: '#AC0A01',
textDanger: '#AC0A01',
emptyShade: '#FFFFFF',
backgroundBasePlain: '#FFFFFF',
lightestShade: '#F1F5F9',
backgroundBaseSubdued: '#F1F5F9',
lightShade: '#CCD5E2',
borderBaseSubdued: '#CCD5E2',
mediumShade: '#94A4B8',
borderBasePlain: '#94A4B8',
darkShade: '#64758B',
darkestShade: '#334255',
fullShade: '#0F172B',
text: '#334255',
textParagraph: '#334255',
title: '#0F172B',
subduedText: '#64758B',
textSubdued: '#64758B',
link: '#0067AC',
body: '#F1F5F9',
highlight: '#FFF6DE',
disabled: '#94A4B8',
backgroundBaseDisabled: '#94A4B8',
disabledText: '#94A4B8',
textDisabled: '#94A4B8',
shadow: '#000000',
},
header: '#04385F',
},
font: {
weight: {
regular: 400,
medium: 500,
semiBold: 600,
bold: 700,
},
},
border: {
thin: 'solid 1px #ddd',
},
};