Files
react/components/styles/themes/dark.ts

65 lines
1.5 KiB
TypeScript

import { ZeitUIThemes, ZeitUIThemesPalette, ZeitUIThemesExpressiveness } from './index'
import { defaultFont, defaultBreakpoints, defaultLayout } from './shared'
export const palette: ZeitUIThemesPalette = {
/* eslint-disable @typescript-eslint/camelcase */
accents_1: '#111',
accents_2: '#333',
accents_3: '#444',
accents_4: '#666',
accents_5: '#888',
accents_6: '#999',
accents_7: '#eaeaea',
accents_8: '#fafafa',
/* eslint-enable camelcase */
background: '#000',
foreground: '#fff',
selection: '#f81ce5',
secondary: '#888',
code: '#79ffe1',
border: '#333',
error: '#ff0000',
errorLight: '#ff1a1a',
errorDark: '#c00',
success: '#0070f3',
successLight: '#3291ff',
successDark: '#0366d6',
warning: '#f5a623',
warningLight: '#f7b955',
warningDark: '#f49b0b',
cyan: '#79ffe1',
purple: '#f81ce5',
alert: '#ff0080',
violet: '#7928ca',
link: '#3291ff',
}
export const expressiveness: ZeitUIThemesExpressiveness = {
linkStyle: 'none',
linkHoverStyle: 'none',
dropdownBoxShadow: '0 0 0 1px #333',
scrollerStart: 'rgba(255, 255, 255, 1)',
scrollerEnd: 'rgba(255, 255, 255, 0)',
shadowSmall: '0 0 0 1px #333',
shadowMedium: '0 0 0 1px #333',
shadowLarge: '0 0 0 1px #333',
portalOpacity: 0.75,
}
export const font = defaultFont
export const breakpoints = defaultBreakpoints
export const layout = defaultLayout
export const themes: ZeitUIThemes = {
type: 'dark',
font,
layout,
palette,
breakpoints,
expressiveness,
}
export default themes