diff options
Diffstat (limited to 'packages/cli/src/ui/themes')
| -rw-r--r-- | packages/cli/src/ui/themes/ansi-light.ts | 20 | ||||
| -rw-r--r-- | packages/cli/src/ui/themes/ansi.ts | 22 | ||||
| -rw-r--r-- | packages/cli/src/ui/themes/atom-one-dark.ts | 88 | ||||
| -rw-r--r-- | packages/cli/src/ui/themes/ayu-light.ts | 82 | ||||
| -rw-r--r-- | packages/cli/src/ui/themes/ayu.ts | 64 | ||||
| -rw-r--r-- | packages/cli/src/ui/themes/default-light.ts | 56 | ||||
| -rw-r--r-- | packages/cli/src/ui/themes/default.ts | 76 | ||||
| -rw-r--r-- | packages/cli/src/ui/themes/dracula.ts | 68 | ||||
| -rw-r--r-- | packages/cli/src/ui/themes/github-dark.ts | 82 | ||||
| -rw-r--r-- | packages/cli/src/ui/themes/github-light.ts | 78 | ||||
| -rw-r--r-- | packages/cli/src/ui/themes/googlecode.ts | 82 | ||||
| -rw-r--r-- | packages/cli/src/ui/themes/theme.ts | 12 | ||||
| -rw-r--r-- | packages/cli/src/ui/themes/xcode.ts | 88 |
13 files changed, 489 insertions, 329 deletions
diff --git a/packages/cli/src/ui/themes/ansi-light.ts b/packages/cli/src/ui/themes/ansi-light.ts index dae9eecd..fc35e434 100644 --- a/packages/cli/src/ui/themes/ansi-light.ts +++ b/packages/cli/src/ui/themes/ansi-light.ts @@ -4,7 +4,23 @@ * SPDX-License-Identifier: Apache-2.0 */ -import { lightTheme, Theme } from './theme.js'; +import { lightTheme, Theme, type ColorsTheme } from './theme.js'; + +const ansiLightColors: ColorsTheme = { + type: 'light', + Background: 'white', + Foreground: 'black', + LightBlue: 'blue', + AccentBlue: 'blue', + AccentPurple: 'purple', + AccentCyan: 'cyan', + AccentGreen: 'green', + AccentYellow: 'orange', + AccentRed: 'red', + Comment: 'gray', + Gray: 'gray', + GradientColors: lightTheme.GradientColors, +}; export const ANSILight: Theme = new Theme( 'ANSI Light', @@ -126,5 +142,5 @@ export const ANSILight: Theme = new Theme( color: 'orange', }, }, - lightTheme, + ansiLightColors, ); diff --git a/packages/cli/src/ui/themes/ansi.ts b/packages/cli/src/ui/themes/ansi.ts index bfc43495..9a8feb33 100644 --- a/packages/cli/src/ui/themes/ansi.ts +++ b/packages/cli/src/ui/themes/ansi.ts @@ -4,11 +4,27 @@ * SPDX-License-Identifier: Apache-2.0 */ -import { darkTheme, Theme } from './theme.js'; +import { darkTheme, Theme, type ColorsTheme } from './theme.js'; + +const ansiColors: ColorsTheme = { + type: 'dark', + Background: 'black', + Foreground: 'white', + LightBlue: 'bluebright', + AccentBlue: '#0000FF', + AccentPurple: 'magenta', + AccentCyan: 'cyan', + AccentGreen: 'green', + AccentYellow: 'yellow', + AccentRed: 'red', + Comment: 'gray', + Gray: 'gray', + GradientColors: darkTheme.GradientColors, // Fallback +}; export const ANSI: Theme = new Theme( 'ANSI', - 'dark', + 'dark', // Consistent with its color palette base { hljs: { display: 'block', @@ -135,5 +151,5 @@ export const ANSI: Theme = new Theme( color: 'yellow', // Mapped from #D7BA7D }, }, - darkTheme, + ansiColors, ); diff --git a/packages/cli/src/ui/themes/atom-one-dark.ts b/packages/cli/src/ui/themes/atom-one-dark.ts index d38fbcbd..84849a54 100644 --- a/packages/cli/src/ui/themes/atom-one-dark.ts +++ b/packages/cli/src/ui/themes/atom-one-dark.ts @@ -4,7 +4,23 @@ * SPDX-License-Identifier: Apache-2.0 */ -import { darkTheme, Theme } from './theme.js'; +import { darkTheme, Theme, type ColorsTheme } from './theme.js'; + +const atomOneDarkColors: ColorsTheme = { + type: 'dark', + Background: '#282c34', + Foreground: '#abb2bf', + LightBlue: '#61aeee', + AccentBlue: '#61aeee', + AccentPurple: '#c678dd', + AccentCyan: '#56b6c2', + AccentGreen: '#98c379', + AccentYellow: '#e6c07b', + AccentRed: '#e06c75', + Comment: '#5c6370', + Gray: '#5c6370', + GradientColors: darkTheme.GradientColors, +}; export const AtomOneDark: Theme = new Theme( 'Atom One', @@ -14,107 +30,107 @@ export const AtomOneDark: Theme = new Theme( display: 'block', overflowX: 'auto', padding: '0.5em', - color: '#abb2bf', - background: '#282c34', + color: atomOneDarkColors.Foreground, + background: atomOneDarkColors.Background, }, 'hljs-comment': { - color: '#5c6370', + color: atomOneDarkColors.Comment, fontStyle: 'italic', }, 'hljs-quote': { - color: '#5c6370', + color: atomOneDarkColors.Comment, fontStyle: 'italic', }, 'hljs-doctag': { - color: '#c678dd', + color: atomOneDarkColors.AccentPurple, }, 'hljs-keyword': { - color: '#c678dd', + color: atomOneDarkColors.AccentPurple, }, 'hljs-formula': { - color: '#c678dd', + color: atomOneDarkColors.AccentPurple, }, 'hljs-section': { - color: '#e06c75', + color: atomOneDarkColors.AccentRed, }, 'hljs-name': { - color: '#e06c75', + color: atomOneDarkColors.AccentRed, }, 'hljs-selector-tag': { - color: '#e06c75', + color: atomOneDarkColors.AccentRed, }, 'hljs-deletion': { - color: '#e06c75', + color: atomOneDarkColors.AccentRed, }, 'hljs-subst': { - color: '#e06c75', + color: atomOneDarkColors.AccentRed, }, 'hljs-literal': { - color: '#56b6c2', + color: atomOneDarkColors.AccentCyan, }, 'hljs-string': { - color: '#98c379', + color: atomOneDarkColors.AccentGreen, }, 'hljs-regexp': { - color: '#98c379', + color: atomOneDarkColors.AccentGreen, }, 'hljs-addition': { - color: '#98c379', + color: atomOneDarkColors.AccentGreen, }, 'hljs-attribute': { - color: '#98c379', + color: atomOneDarkColors.AccentGreen, }, 'hljs-meta-string': { - color: '#98c379', + color: atomOneDarkColors.AccentGreen, }, 'hljs-built_in': { - color: '#e6c07b', + color: atomOneDarkColors.AccentYellow, }, 'hljs-class .hljs-title': { - color: '#e6c07b', + color: atomOneDarkColors.AccentYellow, }, 'hljs-attr': { - color: '#d19a66', + color: atomOneDarkColors.AccentYellow, }, 'hljs-variable': { - color: '#d19a66', + color: atomOneDarkColors.AccentYellow, }, 'hljs-template-variable': { - color: '#d19a66', + color: atomOneDarkColors.AccentYellow, }, 'hljs-type': { - color: '#d19a66', + color: atomOneDarkColors.AccentYellow, }, 'hljs-selector-class': { - color: '#d19a66', + color: atomOneDarkColors.AccentYellow, }, 'hljs-selector-attr': { - color: '#d19a66', + color: atomOneDarkColors.AccentYellow, }, 'hljs-selector-pseudo': { - color: '#d19a66', + color: atomOneDarkColors.AccentYellow, }, 'hljs-number': { - color: '#d19a66', + color: atomOneDarkColors.AccentYellow, }, 'hljs-symbol': { - color: '#61aeee', + color: atomOneDarkColors.AccentBlue, }, 'hljs-bullet': { - color: '#61aeee', + color: atomOneDarkColors.AccentBlue, }, 'hljs-link': { - color: '#61aeee', + color: atomOneDarkColors.AccentBlue, textDecoration: 'underline', }, 'hljs-meta': { - color: '#61aeee', + color: atomOneDarkColors.AccentBlue, }, 'hljs-selector-id': { - color: '#61aeee', + color: atomOneDarkColors.AccentBlue, }, 'hljs-title': { - color: '#61aeee', + color: atomOneDarkColors.AccentBlue, }, 'hljs-emphasis': { fontStyle: 'italic', @@ -123,5 +139,5 @@ export const AtomOneDark: Theme = new Theme( fontWeight: 'bold', }, }, - darkTheme, + atomOneDarkColors, ); diff --git a/packages/cli/src/ui/themes/ayu-light.ts b/packages/cli/src/ui/themes/ayu-light.ts index b2a1c60d..9d91e509 100644 --- a/packages/cli/src/ui/themes/ayu-light.ts +++ b/packages/cli/src/ui/themes/ayu-light.ts @@ -4,7 +4,23 @@ * SPDX-License-Identifier: Apache-2.0 */ -import { lightTheme, Theme } from './theme.js'; +import { lightTheme, Theme, type ColorsTheme } from './theme.js'; + +const ayuLightColors: ColorsTheme = { + type: 'light', + Background: '#f8f9fa', + Foreground: '#5c6166', + LightBlue: '#55b4d4', + AccentBlue: '#399ee6', + AccentPurple: '#a37acc', + AccentCyan: '#4cbf99', + AccentGreen: '#86b300', + AccentYellow: '#f2ae49', + AccentRed: '#f07171', + Comment: '#ABADB1', + Gray: '#CCCFD3', + GradientColors: lightTheme.GradientColors, +}; export const AyuLight: Theme = new Theme( 'Ayu Light', @@ -14,84 +30,84 @@ export const AyuLight: Theme = new Theme( display: 'block', overflowX: 'auto', padding: '0.5em', - background: '#f8f9fa', - color: '#5c6166', + background: ayuLightColors.Background, + color: ayuLightColors.Foreground, }, 'hljs-comment': { - color: '#787b80', + color: ayuLightColors.Comment, fontStyle: 'italic', }, 'hljs-quote': { - color: '#4cbf99', + color: ayuLightColors.AccentCyan, fontStyle: 'italic', }, 'hljs-string': { - color: '#86b300', + color: ayuLightColors.AccentGreen, }, 'hljs-constant': { - color: '#4cbf99', + color: ayuLightColors.AccentCyan, }, 'hljs-number': { - color: '#a37acc', + color: ayuLightColors.AccentPurple, }, 'hljs-keyword': { - color: '#fa8d3e', + color: ayuLightColors.AccentYellow, }, 'hljs-selector-tag': { - color: '#fa8d3e', + color: ayuLightColors.AccentYellow, }, 'hljs-attribute': { - color: '#f2ae49', + color: ayuLightColors.AccentYellow, }, 'hljs-variable': { - color: '#5c6166', + color: ayuLightColors.Foreground, }, 'hljs-variable.language': { - color: '#55b4d4', + color: ayuLightColors.LightBlue, fontStyle: 'italic', }, 'hljs-title': { - color: '#399ee6', + color: ayuLightColors.AccentBlue, }, 'hljs-section': { - color: '#86b300', + color: ayuLightColors.AccentGreen, fontWeight: 'bold', }, 'hljs-type': { - color: '#55b4d4', + color: ayuLightColors.LightBlue, }, 'hljs-class .hljs-title': { - color: '#399ee6', + color: ayuLightColors.AccentBlue, }, 'hljs-tag': { - color: '#55b4d4', + color: ayuLightColors.LightBlue, }, 'hljs-name': { - color: '#399ee6', + color: ayuLightColors.AccentBlue, }, 'hljs-builtin-name': { - color: '#f2ae49', + color: ayuLightColors.AccentYellow, }, 'hljs-meta': { - color: '#e6ba7e', + color: ayuLightColors.AccentYellow, }, 'hljs-symbol': { - color: '#f07171', + color: ayuLightColors.AccentRed, }, 'hljs-bullet': { - color: '#f2ae49', + color: ayuLightColors.AccentYellow, }, 'hljs-regexp': { - color: '#4cbf99', + color: ayuLightColors.AccentCyan, }, 'hljs-link': { - color: '#55b4d4', + color: ayuLightColors.LightBlue, }, 'hljs-deletion': { - color: '#ff7383', + color: ayuLightColors.AccentRed, }, 'hljs-addition': { - color: '#6cbf43', + color: ayuLightColors.AccentGreen, }, 'hljs-emphasis': { fontStyle: 'italic', @@ -100,20 +116,20 @@ export const AyuLight: Theme = new Theme( fontWeight: 'bold', }, 'hljs-literal': { - color: '#4cbf99', + color: ayuLightColors.AccentCyan, }, 'hljs-built_in': { - color: '#f07171', + color: ayuLightColors.AccentRed, }, 'hljs-doctag': { - color: '#d14', + color: ayuLightColors.AccentRed, }, 'hljs-template-variable': { - color: '#008080', + color: ayuLightColors.AccentCyan, }, 'hljs-selector-id': { - color: '#900', + color: ayuLightColors.AccentRed, }, }, - lightTheme, + ayuLightColors, ); diff --git a/packages/cli/src/ui/themes/ayu.ts b/packages/cli/src/ui/themes/ayu.ts index a87a1ee3..738d4dae 100644 --- a/packages/cli/src/ui/themes/ayu.ts +++ b/packages/cli/src/ui/themes/ayu.ts @@ -4,7 +4,23 @@ * SPDX-License-Identifier: Apache-2.0 */ -import { darkTheme, Theme } from './theme.js'; +import { darkTheme, Theme, type ColorsTheme } from './theme.js'; + +const ayuDarkColors: ColorsTheme = { + type: 'dark', + Background: '#0b0e14', + Foreground: '#bfbdb6', + LightBlue: '#59C2FF', + AccentBlue: '#39BAE6', + AccentPurple: '#D2A6FF', + AccentCyan: '#95E6CB', + AccentGreen: '#AAD94C', + AccentYellow: '#FFB454', + AccentRed: '#F26D78', + Comment: '#646A71', + Gray: '##3D4149', + GradientColors: darkTheme.GradientColors, +}; export const AyuDark: Theme = new Theme( 'Ayu', @@ -14,70 +30,70 @@ export const AyuDark: Theme = new Theme( display: 'block', overflowX: 'auto', padding: '0.5em', - background: '#0b0e14', - color: '#bfbdb6', + background: ayuDarkColors.Background, + color: ayuDarkColors.Foreground, }, 'hljs-keyword': { - color: '#FF8F40', + color: ayuDarkColors.AccentYellow, }, 'hljs-literal': { - color: '#D2A6FF', + color: ayuDarkColors.AccentPurple, }, 'hljs-symbol': { - color: '#95E6CB', + color: ayuDarkColors.AccentCyan, }, 'hljs-name': { - color: '#59C2FF', + color: ayuDarkColors.LightBlue, }, 'hljs-link': { - color: '#39BAE6', + color: ayuDarkColors.AccentBlue, }, 'hljs-function .hljs-keyword': { - color: '#FFB454', + color: ayuDarkColors.AccentYellow, }, 'hljs-subst': { - color: '#BFBDB6', + color: ayuDarkColors.Foreground, }, 'hljs-string': { - color: '#AAD94C', + color: ayuDarkColors.AccentGreen, }, 'hljs-title': { - color: '#FFB454', + color: ayuDarkColors.AccentYellow, }, 'hljs-type': { - color: '#39BAE6', + color: ayuDarkColors.AccentBlue, }, 'hljs-attribute': { - color: '#FFB454', + color: ayuDarkColors.AccentYellow, }, 'hljs-bullet': { - color: '#FFB454', + color: ayuDarkColors.AccentYellow, }, 'hljs-addition': { - color: '#7FD962', + color: ayuDarkColors.AccentGreen, }, 'hljs-variable': { - color: '#BFBDB6', + color: ayuDarkColors.Foreground, }, 'hljs-template-tag': { - color: '#FF8F40', + color: ayuDarkColors.AccentYellow, }, 'hljs-template-variable': { - color: '#FF8F40', + color: ayuDarkColors.AccentYellow, }, 'hljs-comment': { - color: '#ACB6BF8C', + color: ayuDarkColors.Comment, fontStyle: 'italic', }, 'hljs-quote': { - color: '#95E6CB', + color: ayuDarkColors.AccentCyan, fontStyle: 'italic', }, 'hljs-deletion': { - color: '#F26D78', + color: ayuDarkColors.AccentRed, }, 'hljs-meta': { - color: '#E6B673', + color: ayuDarkColors.AccentYellow, }, 'hljs-doctag': { fontWeight: 'bold', @@ -89,5 +105,5 @@ export const AyuDark: Theme = new Theme( fontStyle: 'italic', }, }, - darkTheme, + ayuDarkColors, ); diff --git a/packages/cli/src/ui/themes/default-light.ts b/packages/cli/src/ui/themes/default-light.ts index b86af6f3..1803e7fa 100644 --- a/packages/cli/src/ui/themes/default-light.ts +++ b/packages/cli/src/ui/themes/default-light.ts @@ -14,86 +14,86 @@ export const DefaultLight: Theme = new Theme( display: 'block', overflowX: 'auto', padding: '0.5em', - background: 'white', - color: 'black', + background: lightTheme.Background, + color: lightTheme.Foreground, }, 'hljs-comment': { - color: '#008000', + color: lightTheme.Comment, }, 'hljs-quote': { - color: '#008000', + color: lightTheme.Comment, }, 'hljs-variable': { - color: '#008000', + color: lightTheme.Foreground, }, 'hljs-keyword': { - color: '#00f', + color: lightTheme.AccentBlue, }, 'hljs-selector-tag': { - color: '#00f', + color: lightTheme.AccentBlue, }, 'hljs-built_in': { - color: '#00f', + color: lightTheme.AccentBlue, }, 'hljs-name': { - color: '#00f', + color: lightTheme.AccentBlue, }, 'hljs-tag': { - color: '#00f', + color: lightTheme.AccentBlue, }, 'hljs-string': { - color: '#a31515', + color: lightTheme.AccentRed, }, 'hljs-title': { - color: '#a31515', + color: lightTheme.AccentRed, }, 'hljs-section': { - color: '#a31515', + color: lightTheme.AccentRed, }, 'hljs-attribute': { - color: '#a31515', + color: lightTheme.AccentRed, }, 'hljs-literal': { - color: '#a31515', + color: lightTheme.AccentRed, }, 'hljs-template-tag': { - color: '#a31515', + color: lightTheme.AccentRed, }, 'hljs-template-variable': { - color: '#a31515', + color: lightTheme.AccentRed, }, 'hljs-type': { - color: '#a31515', + color: lightTheme.AccentRed, }, 'hljs-addition': { - color: '#a31515', + color: lightTheme.AccentGreen, }, 'hljs-deletion': { - color: '#2b91af', + color: lightTheme.AccentRed, }, 'hljs-selector-attr': { - color: '#2b91af', + color: lightTheme.AccentCyan, }, 'hljs-selector-pseudo': { - color: '#2b91af', + color: lightTheme.AccentCyan, }, 'hljs-meta': { - color: '#2b91af', + color: lightTheme.AccentCyan, }, 'hljs-doctag': { - color: '#808080', + color: lightTheme.Gray, }, 'hljs-attr': { - color: '#f00', + color: lightTheme.AccentRed, }, 'hljs-symbol': { - color: '#00b0e8', + color: lightTheme.AccentCyan, }, 'hljs-bullet': { - color: '#00b0e8', + color: lightTheme.AccentCyan, }, 'hljs-link': { - color: '#00b0e8', + color: lightTheme.AccentCyan, }, 'hljs-emphasis': { fontStyle: 'italic', diff --git a/packages/cli/src/ui/themes/default.ts b/packages/cli/src/ui/themes/default.ts index f3c8cbcd..e1d0247c 100644 --- a/packages/cli/src/ui/themes/default.ts +++ b/packages/cli/src/ui/themes/default.ts @@ -14,101 +14,101 @@ export const DefaultDark: Theme = new Theme( display: 'block', overflowX: 'auto', padding: '0.5em', - background: '#1E1E1E', - color: '#DCDCDC', + background: darkTheme.Background, + color: darkTheme.Foreground, }, 'hljs-keyword': { - color: '#569CD6', + color: darkTheme.AccentBlue, }, 'hljs-literal': { - color: '#569CD6', + color: darkTheme.AccentBlue, }, 'hljs-symbol': { - color: '#569CD6', + color: darkTheme.AccentBlue, }, 'hljs-name': { - color: '#569CD6', + color: darkTheme.AccentBlue, }, 'hljs-link': { - color: '#569CD6', + color: darkTheme.AccentBlue, textDecoration: 'underline', }, 'hljs-built_in': { - color: '#4EC9B0', + color: darkTheme.AccentCyan, }, 'hljs-type': { - color: '#4EC9B0', + color: darkTheme.AccentCyan, }, 'hljs-number': { - color: '#B8D7A3', + color: darkTheme.AccentGreen, }, 'hljs-class': { - color: '#B8D7A3', + color: darkTheme.AccentGreen, }, 'hljs-string': { - color: '#D69D85', + color: darkTheme.AccentYellow, }, 'hljs-meta-string': { - color: '#D69D85', + color: darkTheme.AccentYellow, }, 'hljs-regexp': { - color: '#9A5334', + color: darkTheme.AccentRed, }, 'hljs-template-tag': { - color: '#9A5334', + color: darkTheme.AccentRed, }, 'hljs-subst': { - color: '#DCDCDC', + color: darkTheme.Foreground, }, 'hljs-function': { - color: '#DCDCDC', + color: darkTheme.Foreground, }, 'hljs-title': { - color: '#DCDCDC', + color: darkTheme.Foreground, }, 'hljs-params': { - color: '#DCDCDC', + color: darkTheme.Foreground, }, 'hljs-formula': { - color: '#DCDCDC', + color: darkTheme.Foreground, }, 'hljs-comment': { - color: '#57A64A', + color: darkTheme.Comment, fontStyle: 'italic', }, 'hljs-quote': { - color: '#57A64A', + color: darkTheme.Comment, fontStyle: 'italic', }, 'hljs-doctag': { - color: '#608B4E', + color: darkTheme.Comment, }, 'hljs-meta': { - color: '#9B9B9B', + color: darkTheme.Gray, }, 'hljs-meta-keyword': { - color: '#9B9B9B', + color: darkTheme.Gray, }, 'hljs-tag': { - color: '#9B9B9B', + color: darkTheme.Gray, }, 'hljs-variable': { - color: '#BD63C5', + color: darkTheme.AccentPurple, }, 'hljs-template-variable': { - color: '#BD63C5', + color: darkTheme.AccentPurple, }, 'hljs-attr': { - color: '#9CDCFE', + color: darkTheme.LightBlue, }, 'hljs-attribute': { - color: '#9CDCFE', + color: darkTheme.LightBlue, }, 'hljs-builtin-name': { - color: '#9CDCFE', + color: darkTheme.LightBlue, }, 'hljs-section': { - color: 'gold', + color: darkTheme.AccentYellow, }, 'hljs-emphasis': { fontStyle: 'italic', @@ -117,22 +117,22 @@ export const DefaultDark: Theme = new Theme( fontWeight: 'bold', }, 'hljs-bullet': { - color: '#D7BA7D', + color: darkTheme.AccentYellow, }, 'hljs-selector-tag': { - color: '#D7BA7D', + color: darkTheme.AccentYellow, }, 'hljs-selector-id': { - color: '#D7BA7D', + color: darkTheme.AccentYellow, }, 'hljs-selector-class': { - color: '#D7BA7D', + color: darkTheme.AccentYellow, }, 'hljs-selector-attr': { - color: '#D7BA7D', + color: darkTheme.AccentYellow, }, 'hljs-selector-pseudo': { - color: '#D7BA7D', + color: darkTheme.AccentYellow, }, 'hljs-addition': { backgroundColor: '#144212', diff --git a/packages/cli/src/ui/themes/dracula.ts b/packages/cli/src/ui/themes/dracula.ts index 9597e005..101f1942 100644 --- a/packages/cli/src/ui/themes/dracula.ts +++ b/packages/cli/src/ui/themes/dracula.ts @@ -4,7 +4,23 @@ * SPDX-License-Identifier: Apache-2.0 */ -import { darkTheme, Theme } from './theme.js'; +import { darkTheme, Theme, type ColorsTheme } from './theme.js'; + +const draculaColors: ColorsTheme = { + type: 'dark', + Background: '#282a36', + Foreground: '#f8f8f2', + LightBlue: '#8be9fd', + AccentBlue: '#8be9fd', + AccentPurple: '#ff79c6', + AccentCyan: '#8be9fd', + AccentGreen: '#50fa7b', + AccentYellow: '#f1fa8c', + AccentRed: '#ff5555', + Comment: '#6272a4', + Gray: '#6272a4', + GradientColors: darkTheme.GradientColors, +}; export const Dracula: Theme = new Theme( 'Dracula', @@ -14,81 +30,81 @@ export const Dracula: Theme = new Theme( display: 'block', overflowX: 'auto', padding: '0.5em', - background: '#282a36', - color: '#f8f8f2', + background: draculaColors.Background, + color: draculaColors.Foreground, }, 'hljs-keyword': { - color: '#8be9fd', + color: draculaColors.AccentBlue, fontWeight: 'bold', }, 'hljs-selector-tag': { - color: '#8be9fd', + color: draculaColors.AccentBlue, fontWeight: 'bold', }, 'hljs-literal': { - color: '#8be9fd', + color: draculaColors.AccentBlue, fontWeight: 'bold', }, 'hljs-section': { - color: '#8be9fd', + color: draculaColors.AccentBlue, fontWeight: 'bold', }, 'hljs-link': { - color: '#8be9fd', + color: draculaColors.AccentBlue, }, 'hljs-function .hljs-keyword': { - color: '#ff79c6', + color: draculaColors.AccentPurple, }, 'hljs-subst': { - color: '#f8f8f2', + color: draculaColors.Foreground, }, 'hljs-string': { - color: '#f1fa8c', + color: draculaColors.AccentYellow, }, 'hljs-title': { - color: '#f1fa8c', + color: draculaColors.AccentYellow, fontWeight: 'bold', }, 'hljs-name': { - color: '#f1fa8c', + color: draculaColors.AccentYellow, fontWeight: 'bold', }, 'hljs-type': { - color: '#f1fa8c', + color: draculaColors.AccentYellow, fontWeight: 'bold', }, 'hljs-attribute': { - color: '#f1fa8c', + color: draculaColors.AccentYellow, }, 'hljs-symbol': { - color: '#f1fa8c', + color: draculaColors.AccentYellow, }, 'hljs-bullet': { - color: '#f1fa8c', + color: draculaColors.AccentYellow, }, 'hljs-addition': { - color: '#f1fa8c', + color: draculaColors.AccentGreen, }, 'hljs-variable': { - color: '#f1fa8c', + color: draculaColors.AccentYellow, }, 'hljs-template-tag': { - color: '#f1fa8c', + color: draculaColors.AccentYellow, }, 'hljs-template-variable': { - color: '#f1fa8c', + color: draculaColors.AccentYellow, }, 'hljs-comment': { - color: '#6272a4', + color: draculaColors.Comment, }, 'hljs-quote': { - color: '#6272a4', + color: draculaColors.Comment, }, 'hljs-deletion': { - color: '#6272a4', + color: draculaColors.AccentRed, }, 'hljs-meta': { - color: '#6272a4', + color: draculaColors.Comment, }, 'hljs-doctag': { fontWeight: 'bold', @@ -100,5 +116,5 @@ export const Dracula: Theme = new Theme( fontStyle: 'italic', }, }, - darkTheme, + draculaColors, ); diff --git a/packages/cli/src/ui/themes/github-dark.ts b/packages/cli/src/ui/themes/github-dark.ts index 42f36db1..1333f945 100644 --- a/packages/cli/src/ui/themes/github-dark.ts +++ b/packages/cli/src/ui/themes/github-dark.ts @@ -4,7 +4,23 @@ * SPDX-License-Identifier: Apache-2.0 */ -import { darkTheme, Theme } from './theme.js'; +import { darkTheme, Theme, type ColorsTheme } from './theme.js'; + +const githubDarkColors: ColorsTheme = { + type: 'dark', + Background: '#24292e', + Foreground: '#d1d5da', + LightBlue: '#79B8FF', + AccentBlue: '#79B8FF', + AccentPurple: '#B392F0', + AccentCyan: '#9ECBFF', + AccentGreen: '#85E89D', + AccentYellow: '#FFAB70', + AccentRed: '#F97583', + Comment: '#6A737D', + Gray: '#6A737D', + GradientColors: darkTheme.GradientColors, +}; export const GitHubDark: Theme = new Theme( 'GitHub', @@ -14,107 +30,107 @@ export const GitHubDark: Theme = new Theme( display: 'block', overflowX: 'auto', padding: '0.5em', - color: '#d1d5da', - background: '#24292e', + color: githubDarkColors.Foreground, + background: githubDarkColors.Background, }, 'hljs-comment': { - color: '#6A737D', + color: githubDarkColors.Comment, fontStyle: 'italic', }, 'hljs-quote': { - color: '#6A737D', + color: githubDarkColors.Comment, fontStyle: 'italic', }, 'hljs-keyword': { - color: '#F97583', + color: githubDarkColors.AccentRed, fontWeight: 'bold', }, 'hljs-selector-tag': { - color: '#F97583', + color: githubDarkColors.AccentRed, fontWeight: 'bold', }, 'hljs-subst': { - color: '#e1e4e8', + color: githubDarkColors.Foreground, }, 'hljs-number': { - color: '#79B8FF', + color: githubDarkColors.LightBlue, }, 'hljs-literal': { - color: '#79B8FF', + color: githubDarkColors.LightBlue, }, 'hljs-variable': { - color: '#FFAB70', + color: githubDarkColors.AccentYellow, }, 'hljs-template-variable': { - color: '#FFAB70', + color: githubDarkColors.AccentYellow, }, 'hljs-tag .hljs-attr': { - color: '#FFAB70', + color: githubDarkColors.AccentYellow, }, 'hljs-string': { - color: '#9ECBFF', + color: githubDarkColors.AccentCyan, }, 'hljs-doctag': { - color: '#9ECBFF', + color: githubDarkColors.AccentCyan, }, 'hljs-title': { - color: '#B392F0', + color: githubDarkColors.AccentPurple, fontWeight: 'bold', }, 'hljs-section': { - color: '#B392F0', + color: githubDarkColors.AccentPurple, fontWeight: 'bold', }, 'hljs-selector-id': { - color: '#B392F0', + color: githubDarkColors.AccentPurple, fontWeight: 'bold', }, 'hljs-type': { - color: '#85E89D', + color: githubDarkColors.AccentGreen, fontWeight: 'bold', }, 'hljs-class .hljs-title': { - color: '#85E89D', + color: githubDarkColors.AccentGreen, fontWeight: 'bold', }, 'hljs-tag': { - color: '#85E89D', + color: githubDarkColors.AccentGreen, }, 'hljs-name': { - color: '#85E89D', + color: githubDarkColors.AccentGreen, }, 'hljs-attribute': { - color: '#79B8FF', + color: githubDarkColors.LightBlue, }, 'hljs-regexp': { - color: '#DBEDFF', + color: githubDarkColors.AccentCyan, }, 'hljs-link': { - color: '#DBEDFF', + color: githubDarkColors.AccentCyan, }, 'hljs-symbol': { - color: '#990073', + color: githubDarkColors.AccentPurple, }, 'hljs-bullet': { - color: '#990073', + color: githubDarkColors.AccentPurple, }, 'hljs-built_in': { - color: '#79B8FF', + color: githubDarkColors.LightBlue, }, 'hljs-builtin-name': { - color: '#79B8FF', + color: githubDarkColors.LightBlue, }, 'hljs-meta': { - color: '#79B8FF', + color: githubDarkColors.LightBlue, fontWeight: 'bold', }, 'hljs-deletion': { background: '#86181D', - color: '#FDAEB7', + color: githubDarkColors.AccentRed, }, 'hljs-addition': { background: '#144620', - color: '#85E89D', + color: githubDarkColors.AccentGreen, }, 'hljs-emphasis': { fontStyle: 'italic', @@ -123,5 +139,5 @@ export const GitHubDark: Theme = new Theme( fontWeight: 'bold', }, }, - darkTheme, + githubDarkColors, ); diff --git a/packages/cli/src/ui/themes/github-light.ts b/packages/cli/src/ui/themes/github-light.ts index f66f8558..15a9249d 100644 --- a/packages/cli/src/ui/themes/github-light.ts +++ b/packages/cli/src/ui/themes/github-light.ts @@ -4,7 +4,23 @@ * SPDX-License-Identifier: Apache-2.0 */ -import { lightTheme, Theme } from './theme.js'; +import { lightTheme, Theme, type ColorsTheme } from './theme.js'; + +const githubLightColors: ColorsTheme = { + type: 'light', + Background: '#f8f8f8', + Foreground: '#24292E', + LightBlue: '#0086b3', + AccentBlue: '#458', + AccentPurple: '#900', + AccentCyan: '#009926', + AccentGreen: '#008080', + AccentYellow: '#990073', + AccentRed: '#d14', + Comment: '#998', + Gray: '#999', + GradientColors: lightTheme.GradientColors, +}; export const GitHubLight: Theme = new Theme( 'GitHub Light', @@ -14,102 +30,102 @@ export const GitHubLight: Theme = new Theme( display: 'block', overflowX: 'auto', padding: '0.5em', - color: '#24292E', - background: '#f8f8f8', + color: githubLightColors.Foreground, + background: githubLightColors.Background, }, 'hljs-comment': { - color: '#998', + color: githubLightColors.Comment, fontStyle: 'italic', }, 'hljs-quote': { - color: '#998', + color: githubLightColors.Comment, fontStyle: 'italic', }, 'hljs-keyword': { - color: '#333', + color: githubLightColors.Foreground, fontWeight: 'bold', }, 'hljs-selector-tag': { - color: '#333', + color: githubLightColors.Foreground, fontWeight: 'bold', }, 'hljs-subst': { - color: '#333', + color: githubLightColors.Foreground, fontWeight: 'normal', }, 'hljs-number': { - color: '#008080', + color: githubLightColors.AccentGreen, }, 'hljs-literal': { - color: '#008080', + color: githubLightColors.AccentGreen, }, 'hljs-variable': { - color: '#008080', + color: githubLightColors.AccentGreen, }, 'hljs-template-variable': { - color: '#008080', + color: githubLightColors.AccentGreen, }, 'hljs-tag .hljs-attr': { - color: '#008080', + color: githubLightColors.AccentGreen, }, 'hljs-string': { - color: '#d14', + color: githubLightColors.AccentRed, }, 'hljs-doctag': { - color: '#d14', + color: githubLightColors.AccentRed, }, 'hljs-title': { - color: '#900', + color: githubLightColors.AccentPurple, fontWeight: 'bold', }, 'hljs-section': { - color: '#900', + color: githubLightColors.AccentPurple, fontWeight: 'bold', }, 'hljs-selector-id': { - color: '#900', + color: githubLightColors.AccentPurple, fontWeight: 'bold', }, 'hljs-type': { - color: '#458', + color: githubLightColors.AccentBlue, fontWeight: 'bold', }, 'hljs-class .hljs-title': { - color: '#458', + color: githubLightColors.AccentBlue, fontWeight: 'bold', }, 'hljs-tag': { - color: '#000080', + color: githubLightColors.AccentBlue, fontWeight: 'normal', }, 'hljs-name': { - color: '#000080', + color: githubLightColors.AccentBlue, fontWeight: 'normal', }, 'hljs-attribute': { - color: '#000080', + color: githubLightColors.AccentBlue, fontWeight: 'normal', }, 'hljs-regexp': { - color: '#009926', + color: githubLightColors.AccentCyan, }, 'hljs-link': { - color: '#009926', + color: githubLightColors.AccentCyan, }, 'hljs-symbol': { - color: '#990073', + color: githubLightColors.AccentYellow, }, 'hljs-bullet': { - color: '#990073', + color: githubLightColors.AccentYellow, }, 'hljs-built_in': { - color: '#0086b3', + color: githubLightColors.LightBlue, }, 'hljs-builtin-name': { - color: '#0086b3', + color: githubLightColors.LightBlue, }, 'hljs-meta': { - color: '#999', + color: githubLightColors.Gray, fontWeight: 'bold', }, 'hljs-deletion': { @@ -125,5 +141,5 @@ export const GitHubLight: Theme = new Theme( fontWeight: 'bold', }, }, - lightTheme, + githubLightColors, ); diff --git a/packages/cli/src/ui/themes/googlecode.ts b/packages/cli/src/ui/themes/googlecode.ts index 0729d67a..a7895bb8 100644 --- a/packages/cli/src/ui/themes/googlecode.ts +++ b/packages/cli/src/ui/themes/googlecode.ts @@ -4,7 +4,23 @@ * SPDX-License-Identifier: Apache-2.0 */ -import { lightTheme, Theme } from './theme.js'; +import { lightTheme, Theme, type ColorsTheme } from './theme.js'; + +const googleCodeColors: ColorsTheme = { + type: 'light', + Background: 'white', + Foreground: 'black', + LightBlue: '#066', + AccentBlue: '#008', + AccentPurple: '#606', + AccentCyan: '#066', + AccentGreen: '#080', + AccentYellow: '#660', + AccentRed: '#800', + Comment: '#5f6368', + Gray: lightTheme.Gray, + GradientColors: lightTheme.GradientColors, +}; export const GoogleCode: Theme = new Theme( 'Google Code', @@ -14,100 +30,100 @@ export const GoogleCode: Theme = new Theme( display: 'block', overflowX: 'auto', padding: '0.5em', - background: 'white', - color: 'black', + background: googleCodeColors.Background, + color: googleCodeColors.Foreground, }, 'hljs-comment': { - color: '#800', + color: googleCodeColors.AccentRed, }, 'hljs-quote': { - color: '#800', + color: googleCodeColors.AccentRed, }, 'hljs-keyword': { - color: '#008', + color: googleCodeColors.AccentBlue, }, 'hljs-selector-tag': { - color: '#008', + color: googleCodeColors.AccentBlue, }, 'hljs-section': { - color: '#008', + color: googleCodeColors.AccentBlue, }, 'hljs-title': { - color: '#606', + color: googleCodeColors.AccentPurple, }, 'hljs-name': { - color: '#008', + color: googleCodeColors.AccentBlue, }, 'hljs-variable': { - color: '#660', + color: googleCodeColors.AccentYellow, }, 'hljs-template-variable': { - color: '#660', + color: googleCodeColors.AccentYellow, }, 'hljs-string': { - color: '#080', + color: googleCodeColors.AccentGreen, }, 'hljs-selector-attr': { - color: '#080', + color: googleCodeColors.AccentGreen, }, 'hljs-selector-pseudo': { - color: '#080', + color: googleCodeColors.AccentGreen, }, 'hljs-regexp': { - color: '#080', + color: googleCodeColors.AccentGreen, }, 'hljs-literal': { - color: '#066', + color: googleCodeColors.AccentCyan, }, 'hljs-symbol': { - color: '#066', + color: googleCodeColors.AccentCyan, }, 'hljs-bullet': { - color: '#066', + color: googleCodeColors.AccentCyan, }, 'hljs-meta': { - color: '#066', + color: googleCodeColors.AccentCyan, }, 'hljs-number': { - color: '#066', + color: googleCodeColors.AccentCyan, }, 'hljs-link': { - color: '#066', + color: googleCodeColors.AccentCyan, }, 'hljs-doctag': { - color: '#606', + color: googleCodeColors.AccentPurple, fontWeight: 'bold', }, 'hljs-type': { - color: '#606', + color: googleCodeColors.AccentPurple, }, 'hljs-attr': { - color: '#606', + color: googleCodeColors.AccentPurple, }, 'hljs-built_in': { - color: '#606', + color: googleCodeColors.AccentPurple, }, 'hljs-builtin-name': { - color: '#606', + color: googleCodeColors.AccentPurple, }, 'hljs-params': { - color: '#606', + color: googleCodeColors.AccentPurple, }, 'hljs-attribute': { - color: '#000', + color: googleCodeColors.Foreground, }, 'hljs-subst': { - color: '#000', + color: googleCodeColors.Foreground, }, 'hljs-formula': { backgroundColor: '#eee', fontStyle: 'italic', }, 'hljs-selector-id': { - color: '#9B703F', + color: googleCodeColors.AccentYellow, }, 'hljs-selector-class': { - color: '#9B703F', + color: googleCodeColors.AccentYellow, }, 'hljs-addition': { backgroundColor: '#baeeba', @@ -122,5 +138,5 @@ export const GoogleCode: Theme = new Theme( fontStyle: 'italic', }, }, - lightTheme, + googleCodeColors, ); diff --git a/packages/cli/src/ui/themes/theme.ts b/packages/cli/src/ui/themes/theme.ts index 4b280ec4..9b04da52 100644 --- a/packages/cli/src/ui/themes/theme.ts +++ b/packages/cli/src/ui/themes/theme.ts @@ -19,7 +19,7 @@ export interface ColorsTheme { AccentGreen: string; AccentYellow: string; AccentRed: string; - SubtleComment: string; + Comment: string; Gray: string; GradientColors?: string[]; } @@ -35,8 +35,8 @@ export const lightTheme: ColorsTheme = { AccentGreen: '#3CA84B', AccentYellow: '#D5A40A', AccentRed: '#DD4C4C', - SubtleComment: '#9CA3AF', - Gray: 'gray', + Comment: '#008000', + Gray: '#B7BECC', GradientColors: ['#4796E4', '#847ACE', '#C3677F'], }; @@ -51,8 +51,8 @@ export const darkTheme: ColorsTheme = { AccentGreen: '#A6E3A1', AccentYellow: '#F9E2AF', AccentRed: '#F38BA8', - SubtleComment: '#6C7086', - Gray: 'gray', + Comment: '#6C7086', + Gray: '#6C7086', GradientColors: ['#4796E4', '#847ACE', '#C3677F'], }; @@ -67,7 +67,7 @@ export const ansiTheme: ColorsTheme = { AccentGreen: 'green', AccentYellow: 'yellow', AccentRed: 'red', - SubtleComment: 'gray', + Comment: 'gray', Gray: 'gray', }; diff --git a/packages/cli/src/ui/themes/xcode.ts b/packages/cli/src/ui/themes/xcode.ts index 26b8cf72..d73c664a 100644 --- a/packages/cli/src/ui/themes/xcode.ts +++ b/packages/cli/src/ui/themes/xcode.ts @@ -4,105 +4,121 @@ * SPDX-License-Identifier: Apache-2.0 */ -import { lightTheme, Theme } from './theme.js'; +import { darkTheme, Theme, type ColorsTheme } from './theme.js'; + +const xcodeColors: ColorsTheme = { + type: 'light', + Background: '#fff', + Foreground: 'black', + LightBlue: '#0E0EFF', + AccentBlue: '#1c00cf', + AccentPurple: '#aa0d91', + AccentCyan: '#3F6E74', + AccentGreen: '#007400', + AccentYellow: '#836C28', + AccentRed: '#c41a16', + Comment: '#007400', + Gray: '#c0c0c0', + GradientColors: darkTheme.GradientColors, +}; export const XCode: Theme = new Theme( - 'XCode', + 'Xcode', 'light', { hljs: { display: 'block', overflowX: 'auto', padding: '0.5em', - background: '#fff', - color: 'black', + background: xcodeColors.Background, + color: xcodeColors.Foreground, }, 'xml .hljs-meta': { - color: '#c0c0c0', + color: xcodeColors.Gray, }, 'hljs-comment': { - color: '#007400', + color: xcodeColors.Comment, }, 'hljs-quote': { - color: '#007400', + color: xcodeColors.Comment, }, 'hljs-tag': { - color: '#aa0d91', + color: xcodeColors.AccentPurple, }, 'hljs-attribute': { - color: '#aa0d91', + color: xcodeColors.AccentPurple, }, 'hljs-keyword': { - color: '#aa0d91', + color: xcodeColors.AccentPurple, }, 'hljs-selector-tag': { - color: '#aa0d91', + color: xcodeColors.AccentPurple, }, 'hljs-literal': { - color: '#aa0d91', + color: xcodeColors.AccentPurple, }, 'hljs-name': { - color: '#aa0d91', + color: xcodeColors.AccentPurple, }, 'hljs-variable': { - color: '#3F6E74', + color: xcodeColors.AccentCyan, }, 'hljs-template-variable': { - color: '#3F6E74', + color: xcodeColors.AccentCyan, }, 'hljs-code': { - color: '#c41a16', + color: xcodeColors.AccentRed, }, 'hljs-string': { - color: '#c41a16', + color: xcodeColors.AccentRed, }, 'hljs-meta-string': { - color: '#c41a16', + color: xcodeColors.AccentRed, }, 'hljs-regexp': { - color: '#0E0EFF', + color: xcodeColors.LightBlue, }, 'hljs-link': { - color: '#0E0EFF', + color: xcodeColors.LightBlue, }, 'hljs-title': { - color: '#1c00cf', + color: xcodeColors.AccentBlue, }, 'hljs-symbol': { - color: '#1c00cf', + color: xcodeColors.AccentBlue, }, 'hljs-bullet': { - color: '#1c00cf', + color: xcodeColors.AccentBlue, }, 'hljs-number': { - color: '#1c00cf', + color: xcodeColors.AccentBlue, }, 'hljs-section': { - color: '#643820', + color: xcodeColors.AccentYellow, }, 'hljs-meta': { - color: '#643820', + color: xcodeColors.AccentYellow, }, 'hljs-class .hljs-title': { - color: '#5c2699', + color: xcodeColors.AccentPurple, }, 'hljs-type': { - color: '#5c2699', + color: xcodeColors.AccentPurple, }, 'hljs-built_in': { - color: '#5c2699', + color: xcodeColors.AccentPurple, }, 'hljs-builtin-name': { - color: '#5c2699', + color: xcodeColors.AccentPurple, }, 'hljs-params': { - color: '#5c2699', + color: xcodeColors.AccentPurple, }, 'hljs-attr': { - color: '#836C28', + color: xcodeColors.AccentYellow, }, 'hljs-subst': { - color: '#000', + color: xcodeColors.Foreground, }, 'hljs-formula': { backgroundColor: '#eee', @@ -115,10 +131,10 @@ export const XCode: Theme = new Theme( backgroundColor: '#ffc8bd', }, 'hljs-selector-id': { - color: '#9b703f', + color: xcodeColors.AccentYellow, }, 'hljs-selector-class': { - color: '#9b703f', + color: xcodeColors.AccentYellow, }, 'hljs-doctag': { fontWeight: 'bold', @@ -130,5 +146,5 @@ export const XCode: Theme = new Theme( fontStyle: 'italic', }, }, - lightTheme, + xcodeColors, ); |