From cbc1614b8441dc3dcf35cf4f2e6b3c3457045fcb Mon Sep 17 00:00:00 2001 From: Miguel Solorio Date: Sat, 31 May 2025 11:10:52 -0700 Subject: Update default & ANSI theme names (#637) --- packages/cli/src/ui/themes/ansi-light.ts | 130 ++++++++++++++++++++++++ packages/cli/src/ui/themes/ansi.ts | 6 +- packages/cli/src/ui/themes/default-light.ts | 106 ++++++++++++++++++++ packages/cli/src/ui/themes/default.ts | 149 ++++++++++++++++++++++++++++ packages/cli/src/ui/themes/theme-manager.ts | 16 +-- packages/cli/src/ui/themes/theme.ts | 2 +- packages/cli/src/ui/themes/vs.ts | 106 -------------------- packages/cli/src/ui/themes/vs2015.ts | 149 ---------------------------- 8 files changed, 397 insertions(+), 267 deletions(-) create mode 100644 packages/cli/src/ui/themes/ansi-light.ts create mode 100644 packages/cli/src/ui/themes/default-light.ts create mode 100644 packages/cli/src/ui/themes/default.ts delete mode 100644 packages/cli/src/ui/themes/vs.ts delete mode 100644 packages/cli/src/ui/themes/vs2015.ts (limited to 'packages/cli/src/ui/themes') diff --git a/packages/cli/src/ui/themes/ansi-light.ts b/packages/cli/src/ui/themes/ansi-light.ts new file mode 100644 index 00000000..dae9eecd --- /dev/null +++ b/packages/cli/src/ui/themes/ansi-light.ts @@ -0,0 +1,130 @@ +/** + * @license + * Copyright 2025 Google LLC + * SPDX-License-Identifier: Apache-2.0 + */ + +import { lightTheme, Theme } from './theme.js'; + +export const ANSILight: Theme = new Theme( + 'ANSI Light', + 'light', + { + hljs: { + display: 'block', + overflowX: 'auto', + padding: '0.5em', + background: 'white', + color: 'black', + }, + 'hljs-keyword': { + color: 'blue', + }, + 'hljs-literal': { + color: 'blue', + }, + 'hljs-symbol': { + color: 'blue', + }, + 'hljs-name': { + color: 'blue', + }, + 'hljs-link': { + color: 'blue', + }, + 'hljs-built_in': { + color: 'cyan', + }, + 'hljs-type': { + color: 'cyan', + }, + 'hljs-number': { + color: 'green', + }, + 'hljs-class': { + color: 'green', + }, + 'hljs-string': { + color: 'red', + }, + 'hljs-meta-string': { + color: 'red', + }, + 'hljs-regexp': { + color: 'magenta', + }, + 'hljs-template-tag': { + color: 'magenta', + }, + 'hljs-subst': { + color: 'black', + }, + 'hljs-function': { + color: 'black', + }, + 'hljs-title': { + color: 'black', + }, + 'hljs-params': { + color: 'black', + }, + 'hljs-formula': { + color: 'black', + }, + 'hljs-comment': { + color: 'gray', + }, + 'hljs-quote': { + color: 'gray', + }, + 'hljs-doctag': { + color: 'gray', + }, + 'hljs-meta': { + color: 'gray', + }, + 'hljs-meta-keyword': { + color: 'gray', + }, + 'hljs-tag': { + color: 'gray', + }, + 'hljs-variable': { + color: 'purple', + }, + 'hljs-template-variable': { + color: 'purple', + }, + 'hljs-attr': { + color: 'blue', + }, + 'hljs-attribute': { + color: 'blue', + }, + 'hljs-builtin-name': { + color: 'blue', + }, + 'hljs-section': { + color: 'orange', + }, + 'hljs-bullet': { + color: 'orange', + }, + 'hljs-selector-tag': { + color: 'orange', + }, + 'hljs-selector-id': { + color: 'orange', + }, + 'hljs-selector-class': { + color: 'orange', + }, + 'hljs-selector-attr': { + color: 'orange', + }, + 'hljs-selector-pseudo': { + color: 'orange', + }, + }, + lightTheme, +); diff --git a/packages/cli/src/ui/themes/ansi.ts b/packages/cli/src/ui/themes/ansi.ts index b5e2015e..bfc43495 100644 --- a/packages/cli/src/ui/themes/ansi.ts +++ b/packages/cli/src/ui/themes/ansi.ts @@ -4,11 +4,11 @@ * SPDX-License-Identifier: Apache-2.0 */ -import { ansiTheme, Theme } from './theme.js'; +import { darkTheme, Theme } from './theme.js'; export const ANSI: Theme = new Theme( 'ANSI', - 'ansi', + 'dark', { hljs: { display: 'block', @@ -135,5 +135,5 @@ export const ANSI: Theme = new Theme( color: 'yellow', // Mapped from #D7BA7D }, }, - ansiTheme, + darkTheme, ); diff --git a/packages/cli/src/ui/themes/default-light.ts b/packages/cli/src/ui/themes/default-light.ts new file mode 100644 index 00000000..b86af6f3 --- /dev/null +++ b/packages/cli/src/ui/themes/default-light.ts @@ -0,0 +1,106 @@ +/** + * @license + * Copyright 2025 Google LLC + * SPDX-License-Identifier: Apache-2.0 + */ + +import { lightTheme, Theme } from './theme.js'; + +export const DefaultLight: Theme = new Theme( + 'Default Light', + 'light', + { + hljs: { + display: 'block', + overflowX: 'auto', + padding: '0.5em', + background: 'white', + color: 'black', + }, + 'hljs-comment': { + color: '#008000', + }, + 'hljs-quote': { + color: '#008000', + }, + 'hljs-variable': { + color: '#008000', + }, + 'hljs-keyword': { + color: '#00f', + }, + 'hljs-selector-tag': { + color: '#00f', + }, + 'hljs-built_in': { + color: '#00f', + }, + 'hljs-name': { + color: '#00f', + }, + 'hljs-tag': { + color: '#00f', + }, + 'hljs-string': { + color: '#a31515', + }, + 'hljs-title': { + color: '#a31515', + }, + 'hljs-section': { + color: '#a31515', + }, + 'hljs-attribute': { + color: '#a31515', + }, + 'hljs-literal': { + color: '#a31515', + }, + 'hljs-template-tag': { + color: '#a31515', + }, + 'hljs-template-variable': { + color: '#a31515', + }, + 'hljs-type': { + color: '#a31515', + }, + 'hljs-addition': { + color: '#a31515', + }, + 'hljs-deletion': { + color: '#2b91af', + }, + 'hljs-selector-attr': { + color: '#2b91af', + }, + 'hljs-selector-pseudo': { + color: '#2b91af', + }, + 'hljs-meta': { + color: '#2b91af', + }, + 'hljs-doctag': { + color: '#808080', + }, + 'hljs-attr': { + color: '#f00', + }, + 'hljs-symbol': { + color: '#00b0e8', + }, + 'hljs-bullet': { + color: '#00b0e8', + }, + 'hljs-link': { + color: '#00b0e8', + }, + 'hljs-emphasis': { + fontStyle: 'italic', + }, + 'hljs-strong': { + fontWeight: 'bold', + }, + }, + lightTheme, +); diff --git a/packages/cli/src/ui/themes/default.ts b/packages/cli/src/ui/themes/default.ts new file mode 100644 index 00000000..f3c8cbcd --- /dev/null +++ b/packages/cli/src/ui/themes/default.ts @@ -0,0 +1,149 @@ +/** + * @license + * Copyright 2025 Google LLC + * SPDX-License-Identifier: Apache-2.0 + */ + +import { darkTheme, Theme } from './theme.js'; + +export const DefaultDark: Theme = new Theme( + 'Default', + 'dark', + { + hljs: { + display: 'block', + overflowX: 'auto', + padding: '0.5em', + background: '#1E1E1E', + color: '#DCDCDC', + }, + 'hljs-keyword': { + color: '#569CD6', + }, + 'hljs-literal': { + color: '#569CD6', + }, + 'hljs-symbol': { + color: '#569CD6', + }, + 'hljs-name': { + color: '#569CD6', + }, + 'hljs-link': { + color: '#569CD6', + textDecoration: 'underline', + }, + 'hljs-built_in': { + color: '#4EC9B0', + }, + 'hljs-type': { + color: '#4EC9B0', + }, + 'hljs-number': { + color: '#B8D7A3', + }, + 'hljs-class': { + color: '#B8D7A3', + }, + 'hljs-string': { + color: '#D69D85', + }, + 'hljs-meta-string': { + color: '#D69D85', + }, + 'hljs-regexp': { + color: '#9A5334', + }, + 'hljs-template-tag': { + color: '#9A5334', + }, + 'hljs-subst': { + color: '#DCDCDC', + }, + 'hljs-function': { + color: '#DCDCDC', + }, + 'hljs-title': { + color: '#DCDCDC', + }, + 'hljs-params': { + color: '#DCDCDC', + }, + 'hljs-formula': { + color: '#DCDCDC', + }, + 'hljs-comment': { + color: '#57A64A', + fontStyle: 'italic', + }, + 'hljs-quote': { + color: '#57A64A', + fontStyle: 'italic', + }, + 'hljs-doctag': { + color: '#608B4E', + }, + 'hljs-meta': { + color: '#9B9B9B', + }, + 'hljs-meta-keyword': { + color: '#9B9B9B', + }, + 'hljs-tag': { + color: '#9B9B9B', + }, + 'hljs-variable': { + color: '#BD63C5', + }, + 'hljs-template-variable': { + color: '#BD63C5', + }, + 'hljs-attr': { + color: '#9CDCFE', + }, + 'hljs-attribute': { + color: '#9CDCFE', + }, + 'hljs-builtin-name': { + color: '#9CDCFE', + }, + 'hljs-section': { + color: 'gold', + }, + 'hljs-emphasis': { + fontStyle: 'italic', + }, + 'hljs-strong': { + fontWeight: 'bold', + }, + 'hljs-bullet': { + color: '#D7BA7D', + }, + 'hljs-selector-tag': { + color: '#D7BA7D', + }, + 'hljs-selector-id': { + color: '#D7BA7D', + }, + 'hljs-selector-class': { + color: '#D7BA7D', + }, + 'hljs-selector-attr': { + color: '#D7BA7D', + }, + 'hljs-selector-pseudo': { + color: '#D7BA7D', + }, + 'hljs-addition': { + backgroundColor: '#144212', + display: 'inline-block', + width: '100%', + }, + 'hljs-deletion': { + backgroundColor: '#600', + display: 'inline-block', + width: '100%', + }, + }, + darkTheme, +); diff --git a/packages/cli/src/ui/themes/theme-manager.ts b/packages/cli/src/ui/themes/theme-manager.ts index e17fa5b7..2b12a4c1 100644 --- a/packages/cli/src/ui/themes/theme-manager.ts +++ b/packages/cli/src/ui/themes/theme-manager.ts @@ -8,18 +8,19 @@ import { AtomOneDark } from './atom-one-dark.js'; import { Dracula } from './dracula.js'; import { GitHub } from './github.js'; import { GoogleCode } from './googlecode.js'; -import { VS } from './vs.js'; -import { VS2015 } from './vs2015.js'; +import { DefaultLight } from './default-light.js'; +import { DefaultDark } from './default.js'; import { XCode } from './xcode.js'; import { Theme, ThemeType } from './theme.js'; import { ANSI } from './ansi.js'; +import { ANSILight } from './ansi-light.js'; export interface ThemeDisplay { name: string; type: ThemeType; } -export const DEFAULT_THEME: Theme = VS2015; +export const DEFAULT_THEME: Theme = DefaultDark; class ThemeManager { private readonly availableThemes: Theme[]; @@ -29,12 +30,13 @@ class ThemeManager { this.availableThemes = [ AtomOneDark, Dracula, - VS, // Light mode. - VS2015, + DefaultLight, // Light mode. + DefaultDark, GitHub, GoogleCode, XCode, ANSI, + ANSILight, ]; this.activeTheme = DEFAULT_THEME; } @@ -50,10 +52,8 @@ class ThemeManager { return 1; case 'light': return 2; - case 'ansi': - return 3; default: - return 4; + return 3; } }; diff --git a/packages/cli/src/ui/themes/theme.ts b/packages/cli/src/ui/themes/theme.ts index 582d2e9e..abe9b101 100644 --- a/packages/cli/src/ui/themes/theme.ts +++ b/packages/cli/src/ui/themes/theme.ts @@ -63,7 +63,7 @@ export const ansiTheme: ColorsTheme = { LightBlue: 'blue', AccentBlue: 'blue', AccentPurple: 'magenta', - AccentCyan: 'cynan', + AccentCyan: 'cyan', AccentGreen: 'green', AccentYellow: 'yellow', AccentRed: 'red', diff --git a/packages/cli/src/ui/themes/vs.ts b/packages/cli/src/ui/themes/vs.ts deleted file mode 100644 index 2faf02a7..00000000 --- a/packages/cli/src/ui/themes/vs.ts +++ /dev/null @@ -1,106 +0,0 @@ -/** - * @license - * Copyright 2025 Google LLC - * SPDX-License-Identifier: Apache-2.0 - */ - -import { lightTheme, Theme } from './theme.js'; - -export const VS: Theme = new Theme( - 'VS', - 'light', - { - hljs: { - display: 'block', - overflowX: 'auto', - padding: '0.5em', - background: 'white', - color: 'black', - }, - 'hljs-comment': { - color: '#008000', - }, - 'hljs-quote': { - color: '#008000', - }, - 'hljs-variable': { - color: '#008000', - }, - 'hljs-keyword': { - color: '#00f', - }, - 'hljs-selector-tag': { - color: '#00f', - }, - 'hljs-built_in': { - color: '#00f', - }, - 'hljs-name': { - color: '#00f', - }, - 'hljs-tag': { - color: '#00f', - }, - 'hljs-string': { - color: '#a31515', - }, - 'hljs-title': { - color: '#a31515', - }, - 'hljs-section': { - color: '#a31515', - }, - 'hljs-attribute': { - color: '#a31515', - }, - 'hljs-literal': { - color: '#a31515', - }, - 'hljs-template-tag': { - color: '#a31515', - }, - 'hljs-template-variable': { - color: '#a31515', - }, - 'hljs-type': { - color: '#a31515', - }, - 'hljs-addition': { - color: '#a31515', - }, - 'hljs-deletion': { - color: '#2b91af', - }, - 'hljs-selector-attr': { - color: '#2b91af', - }, - 'hljs-selector-pseudo': { - color: '#2b91af', - }, - 'hljs-meta': { - color: '#2b91af', - }, - 'hljs-doctag': { - color: '#808080', - }, - 'hljs-attr': { - color: '#f00', - }, - 'hljs-symbol': { - color: '#00b0e8', - }, - 'hljs-bullet': { - color: '#00b0e8', - }, - 'hljs-link': { - color: '#00b0e8', - }, - 'hljs-emphasis': { - fontStyle: 'italic', - }, - 'hljs-strong': { - fontWeight: 'bold', - }, - }, - lightTheme, -); diff --git a/packages/cli/src/ui/themes/vs2015.ts b/packages/cli/src/ui/themes/vs2015.ts deleted file mode 100644 index 34431abf..00000000 --- a/packages/cli/src/ui/themes/vs2015.ts +++ /dev/null @@ -1,149 +0,0 @@ -/** - * @license - * Copyright 2025 Google LLC - * SPDX-License-Identifier: Apache-2.0 - */ - -import { darkTheme, Theme } from './theme.js'; - -export const VS2015: Theme = new Theme( - 'VS2015', - 'dark', - { - hljs: { - display: 'block', - overflowX: 'auto', - padding: '0.5em', - background: '#1E1E1E', - color: '#DCDCDC', - }, - 'hljs-keyword': { - color: '#569CD6', - }, - 'hljs-literal': { - color: '#569CD6', - }, - 'hljs-symbol': { - color: '#569CD6', - }, - 'hljs-name': { - color: '#569CD6', - }, - 'hljs-link': { - color: '#569CD6', - textDecoration: 'underline', - }, - 'hljs-built_in': { - color: '#4EC9B0', - }, - 'hljs-type': { - color: '#4EC9B0', - }, - 'hljs-number': { - color: '#B8D7A3', - }, - 'hljs-class': { - color: '#B8D7A3', - }, - 'hljs-string': { - color: '#D69D85', - }, - 'hljs-meta-string': { - color: '#D69D85', - }, - 'hljs-regexp': { - color: '#9A5334', - }, - 'hljs-template-tag': { - color: '#9A5334', - }, - 'hljs-subst': { - color: '#DCDCDC', - }, - 'hljs-function': { - color: '#DCDCDC', - }, - 'hljs-title': { - color: '#DCDCDC', - }, - 'hljs-params': { - color: '#DCDCDC', - }, - 'hljs-formula': { - color: '#DCDCDC', - }, - 'hljs-comment': { - color: '#57A64A', - fontStyle: 'italic', - }, - 'hljs-quote': { - color: '#57A64A', - fontStyle: 'italic', - }, - 'hljs-doctag': { - color: '#608B4E', - }, - 'hljs-meta': { - color: '#9B9B9B', - }, - 'hljs-meta-keyword': { - color: '#9B9B9B', - }, - 'hljs-tag': { - color: '#9B9B9B', - }, - 'hljs-variable': { - color: '#BD63C5', - }, - 'hljs-template-variable': { - color: '#BD63C5', - }, - 'hljs-attr': { - color: '#9CDCFE', - }, - 'hljs-attribute': { - color: '#9CDCFE', - }, - 'hljs-builtin-name': { - color: '#9CDCFE', - }, - 'hljs-section': { - color: 'gold', - }, - 'hljs-emphasis': { - fontStyle: 'italic', - }, - 'hljs-strong': { - fontWeight: 'bold', - }, - 'hljs-bullet': { - color: '#D7BA7D', - }, - 'hljs-selector-tag': { - color: '#D7BA7D', - }, - 'hljs-selector-id': { - color: '#D7BA7D', - }, - 'hljs-selector-class': { - color: '#D7BA7D', - }, - 'hljs-selector-attr': { - color: '#D7BA7D', - }, - 'hljs-selector-pseudo': { - color: '#D7BA7D', - }, - 'hljs-addition': { - backgroundColor: '#144212', - display: 'inline-block', - width: '100%', - }, - 'hljs-deletion': { - backgroundColor: '#600', - display: 'inline-block', - width: '100%', - }, - }, - darkTheme, -); -- cgit v1.2.3