5import { tags as t } from '@lezer/highlight';
6import { createTheme } from './theme-helper.mjs';

8const hex = ['rgb(75, 130, 247)', 'rgb(47, 108, 246)', 'rgb(255, 255, 255)', 'rgba(255, 255, 255,.3)'];
9
10export const settings = {
11  background: hex[0],
12  lineBackground: 'transparent',
13  foreground: hex[2],
14  muted: hex[3],
15  selection: hex[3],
16  selectionMatch: hex[0],
17  gutterBackground: hex[0],
18  gutterForeground: hex[2],
19  gutterBorder: 'transparent',
20  lineHighlight: hex[1],
21};
22
23export default createTheme({
24  theme: 'dark',
25  settings,
26  styles: [
27    {
28      tag: [t.function(t.variableName), t.function(t.propertyName), t.url, t.processingInstruction],
29      color: hex[2],
30    },
31    { tag: [t.atom, t.bool, t.special(t.variableName)], color: hex[2] },
32    { tag: [t.comment, t.bracket, t.brace, t.compareOperator], color: hex[3] },
33    { tag: [t.variableName, t.propertyName, t.labelName], color: hex[2] },
34    { tag: [t.attributeName, t.number], color: hex[2] },
35    { tag: t.keyword, color: hex[2] },
36    { tag: [t.string, t.regexp, t.special(t.propertyName)], color: hex[2] },
37  ],
38});