From a4cb082cff5f30b8ea4783013713928021246c37 Mon Sep 17 00:00:00 2001 From: Dallin Romney Date: Mon, 23 Dec 2024 07:27:21 -0800 Subject: [PATCH 1/8] explicit colors start --- gui/src/components/modelSelection/ModelSelectionListbox.tsx | 2 +- gui/tailwind.config.cjs | 2 ++ 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/gui/src/components/modelSelection/ModelSelectionListbox.tsx b/gui/src/components/modelSelection/ModelSelectionListbox.tsx index d043632b98..0179ade8d2 100644 --- a/gui/src/components/modelSelection/ModelSelectionListbox.tsx +++ b/gui/src/components/modelSelection/ModelSelectionListbox.tsx @@ -180,7 +180,7 @@ function ModelSelectionListbox({ )} {topOptions.length > 0 && otherOptions.length > 0 && ( -
+
)} {otherOptions.length > 0 && ( diff --git a/gui/tailwind.config.cjs b/gui/tailwind.config.cjs index c837eea756..c19b8dcfe2 100644 --- a/gui/tailwind.config.cjs +++ b/gui/tailwind.config.cjs @@ -25,6 +25,8 @@ module.exports = { "spin-slow": "spin 6s linear infinite", }, colors: { + // All vscode variables https://gist.github.com/estruyf/ba49203e1a7d6868e9320a4ea480c27a + // Examples for vscode https://github.com/githubocto/tailwind-vscode/blob/main/index.js lightgray: "#999998", "vsc-background": "rgb(var(--vsc-background) / )", "secondary-dark": "rgb(var(--secondary-dark) / )", From ab330a7ebcec24b9db2ca340d9391737483b98f1 Mon Sep 17 00:00:00 2001 From: Dallin Romney Date: Wed, 1 Jan 2025 17:35:22 +0100 Subject: [PATCH 2/8] theme stuff p2 --- core/autocomplete/filtering/test/testCases.ts | 4 ++-- gui/src/App.tsx | 8 ++++++-- gui/src/components/History/HistoryTableRow.tsx | 4 ++-- gui/src/components/Layout.tsx | 2 +- gui/src/components/gui/Alert.tsx | 2 +- gui/src/components/mainInput/ContextItemsPeek.tsx | 6 +++--- .../StepContainerPreToolbar/ApplyActions.tsx | 2 +- .../markdown/StepContainerPreToolbar/CopyButton.tsx | 2 +- .../StepContainerPreToolbar/RunInTerminalButton.tsx | 2 +- gui/src/index.css | 9 --------- gui/src/pages/config-error/index.tsx | 2 +- gui/src/pages/error.tsx | 12 ++++++------ gui/src/pages/theme.tsx | 5 +++++ gui/src/util/navigation.ts | 1 + gui/tailwind.config.cjs | 8 ++++++++ 15 files changed, 39 insertions(+), 30 deletions(-) create mode 100644 gui/src/pages/theme.tsx diff --git a/core/autocomplete/filtering/test/testCases.ts b/core/autocomplete/filtering/test/testCases.ts index f83de16073..3ec71c8da8 100644 --- a/core/autocomplete/filtering/test/testCases.ts +++ b/core/autocomplete/filtering/test/testCases.ts @@ -650,10 +650,10 @@ export const Button = ({ <|fim|> ); };`, - llmOutput: ``, - expectedCompletion: ``, filename: "Button.tsx", diff --git a/gui/src/App.tsx b/gui/src/App.tsx index 18df91b868..b07bb1bdf9 100644 --- a/gui/src/App.tsx +++ b/gui/src/App.tsx @@ -1,4 +1,3 @@ -import { useDispatch } from "react-redux"; import { RouterProvider, createMemoryRouter } from "react-router-dom"; import Layout from "./components/Layout"; import { VscThemeProvider } from "./context/VscTheme"; @@ -13,10 +12,11 @@ import MorePage from "./pages/More"; import Stats from "./pages/stats"; import { ROUTES } from "./util/navigation"; import { SubmenuContextProvidersProvider } from "./context/SubmenuContextProviders"; +import ThemePage from "./pages/theme"; const router = createMemoryRouter([ { - path: ROUTES.HOME, + path: ROUTES.THEME, element: , errorElement: , children: [ @@ -56,6 +56,10 @@ const router = createMemoryRouter([ path: "/migration", element: , }, + { + path: ROUTES.THEME, + element: , + }, ], }, ]); diff --git a/gui/src/components/History/HistoryTableRow.tsx b/gui/src/components/History/HistoryTableRow.tsx index 11a5a36df3..a48d269855 100644 --- a/gui/src/components/History/HistoryTableRow.tsx +++ b/gui/src/components/History/HistoryTableRow.tsx @@ -88,7 +88,7 @@ export function HistoryTableRow({ >
{editing ? ( -
+
) : ( - + {sessionMetadata.title} )} diff --git a/gui/src/components/Layout.tsx b/gui/src/components/Layout.tsx index e8a0deb129..27334e2c20 100644 --- a/gui/src/components/Layout.tsx +++ b/gui/src/components/Layout.tsx @@ -301,7 +301,7 @@ const Layout = () => { {hasFatalErrors && pathname !== ROUTES.CONFIG_ERROR && (
navigate(ROUTES.CONFIG_ERROR)} > diff --git a/gui/src/components/gui/Alert.tsx b/gui/src/components/gui/Alert.tsx index cc1e5c9d10..ccc6ba4f82 100644 --- a/gui/src/components/gui/Alert.tsx +++ b/gui/src/components/gui/Alert.tsx @@ -39,7 +39,7 @@ function Alert({ children, type = "info" }: AlertProps) { const { Icon } = ALERT_CONFIGS[type]; return ( -
+
{getContextItemIcon()} @@ -164,12 +164,12 @@ function ContextItemsPeek({ >
diff --git a/gui/src/components/markdown/StepContainerPreToolbar/ApplyActions.tsx b/gui/src/components/markdown/StepContainerPreToolbar/ApplyActions.tsx index d71d258c55..7188fe4493 100644 --- a/gui/src/components/markdown/StepContainerPreToolbar/ApplyActions.tsx +++ b/gui/src/components/markdown/StepContainerPreToolbar/ApplyActions.tsx @@ -36,7 +36,7 @@ export default function ApplyActions(props: ApplyActionsProps) { const applyButton = (text: string) => ( -

+

Report the issue on GitHub or Discord:

-
+
openUrl(GITHUB_LINK)} - className="flex w-full items-center justify-center space-x-2 rounded-lg px-4 py-2 text-base text-white" + className="flex items-center justify-center" > GitHub openUrl(DISCORD_LINK)} - className="flex w-full items-center justify-center rounded-lg text-base" + className="flex items-center justify-center" > Discord diff --git a/gui/src/pages/theme.tsx b/gui/src/pages/theme.tsx new file mode 100644 index 0000000000..02c99cc158 --- /dev/null +++ b/gui/src/pages/theme.tsx @@ -0,0 +1,5 @@ +const ThemePage = () => { + return
ThemePage
; +}; + +export default ThemePage; diff --git a/gui/src/util/navigation.ts b/gui/src/util/navigation.ts index 2416226d8a..1884c6fb72 100644 --- a/gui/src/util/navigation.ts +++ b/gui/src/util/navigation.ts @@ -3,5 +3,6 @@ export const ROUTES = { HOME: "/", CONFIG_ERROR: "/config-error", MORE: "/more", + THEME: "/theme", // EXAMPLE_ROUTE_WITH_PARAMS: (params: ParamsType) => `/route/${params}`, }; diff --git a/gui/tailwind.config.cjs b/gui/tailwind.config.cjs index c19b8dcfe2..0f22883b5a 100644 --- a/gui/tailwind.config.cjs +++ b/gui/tailwind.config.cjs @@ -58,6 +58,14 @@ module.exports = { "var(--vscode-descriptionForeground, #999)", "vsc-input-placeholder-foreground": "var(--vscode-input-placeholderForeground, #999)", + error: "var(--vscode-errorBackground, #f00)", + "error-foreground": "var(--vscode-errorForeground, #fff)", + + // --vscode-errorForeground /* Text color for error messages */ + // --vscode-errorBackground /* Background color for error messages */ + // --vscode-editorError-foreground /* Color for error squiggles in editor */ + // --vscode-inputValidation-errorBackground /* Background for error validation */ + // --vscode-inputValidation-errorBorder /* Border color for error validation */ }, }, }, From 9ce69f047c32011559787b93a27c0dbdc7af82e4 Mon Sep 17 00:00:00 2001 From: Dallin Romney Date: Sat, 4 Jan 2025 17:29:26 +0100 Subject: [PATCH 3/8] theme page --- gui/src/App.tsx | 2 +- gui/src/pages/More/More.tsx | 10 + gui/src/pages/theme.tsx | 5 - gui/src/pages/theme/index.tsx | 79 ++++ gui/src/pages/theme/vscode-classes.ts | 516 ++++++++++++++++++++++++++ 5 files changed, 606 insertions(+), 6 deletions(-) delete mode 100644 gui/src/pages/theme.tsx create mode 100644 gui/src/pages/theme/index.tsx create mode 100644 gui/src/pages/theme/vscode-classes.ts diff --git a/gui/src/App.tsx b/gui/src/App.tsx index b07bb1bdf9..40894e4199 100644 --- a/gui/src/App.tsx +++ b/gui/src/App.tsx @@ -16,7 +16,7 @@ import ThemePage from "./pages/theme"; const router = createMemoryRouter([ { - path: ROUTES.THEME, + path: ROUTES.HOME, element: , errorElement: , children: [ diff --git a/gui/src/pages/More/More.tsx b/gui/src/pages/More/More.tsx index cc399a3fdc..347f28d2b9 100644 --- a/gui/src/pages/More/More.tsx +++ b/gui/src/pages/More/More.tsx @@ -103,6 +103,16 @@ function MorePage() {

Keyboard shortcuts

+ {process.env.NODE_ENV === "development" && ( +
+ navigate("/theme")} + > + Themes + +
+ )}
); diff --git a/gui/src/pages/theme.tsx b/gui/src/pages/theme.tsx deleted file mode 100644 index 02c99cc158..0000000000 --- a/gui/src/pages/theme.tsx +++ /dev/null @@ -1,5 +0,0 @@ -const ThemePage = () => { - return
ThemePage
; -}; - -export default ThemePage; diff --git a/gui/src/pages/theme/index.tsx b/gui/src/pages/theme/index.tsx new file mode 100644 index 0000000000..7b58f0158e --- /dev/null +++ b/gui/src/pages/theme/index.tsx @@ -0,0 +1,79 @@ +import { useNavigate } from "react-router-dom"; +import { CheckIcon, XIcon } from "@heroicons/react/solid"; +import { vscodeCssClasses } from "./vscode-classes"; + +interface ThemeExampleProps { + className: string; +} + +// const classes = [ +// "lightgray", +// "vsc-background", +// "secondary-dark", +// "vsc-input-background", +// "vsc-quick-input-background", +// "vsc-background", +// "vsc-foreground", +// "vsc-button-background", +// "vsc-button-foreground", +// "vsc-editor-background", +// "vsc-list-active-background", +// "vsc-focus-border", +// "vsc-list-active-foreground", +// "vsc-input-border", +// "vsc-input-border-focus", +// "vsc-badge-background", +// "vsc-badge-foreground", +// "vsc-sidebar-border", +// "vsc-find-match", +// "vsc-find-match-selected", +// "vsc-foreground-muted", +// "vsc-description-foreground", +// "vsc-input-placeholder-foreground", +// "error", +// "error-foreground", +// ]; + +const ThemeExample = ({ className }: ThemeExampleProps) => { + // const exists = window + // .getComputedStyle(document.documentElement) + // .getPropertyValue(`--${className}`) + // .trim(); + const exists = true; + return ( +
+ {className} +
+ {/*{exists ? ( + + ) : ( + + )} */} +
+ ); +}; + +export default function ThemePage() { + const navigate = useNavigate(); + return ( +
+ navigate("/more")} + > + Back to more page + +

More pretty than this

+
+ {vscodeCssClasses.map((c) => ( + + ))} +
+
+ ); +} diff --git a/gui/src/pages/theme/vscode-classes.ts b/gui/src/pages/theme/vscode-classes.ts new file mode 100644 index 0000000000..e2ece42638 --- /dev/null +++ b/gui/src/pages/theme/vscode-classes.ts @@ -0,0 +1,516 @@ +export const vscodeCssClasses = [ + "vscode-font-weight", + "vscode-font-size", + "vscode-editor-font-family", + "vscode-editor-font-weight", + "vscode-editor-font-size", + "vscode-foreground", + "vscode-errorForeground", + "vscode-descriptionForeground", + "vscode-icon-foreground", + "vscode-focusBorder", + "vscode-selection-background", + "vscode-textSeparator-foreground", + "vscode-textLink-foreground", + "vscode-textLink-activeForeground", + "vscode-textPreformat-foreground", + "vscode-textBlockQuote-background", + "vscode-textBlockQuote-border", + "vscode-textCodeBlock-background", + "vscode-widget-shadow", + "vscode-input-background", + "vscode-input-foreground", + "vscode-inputOption-activeBorder", + "vscode-inputOption-hoverBackground", + "vscode-inputOption-activeBackground", + "vscode-inputOption-activeForeground", + "vscode-input-placeholderForeground", + "vscode-inputValidation-infoBackground", + "vscode-inputValidation-infoBorder", + "vscode-inputValidation-warningBackground", + "vscode-inputValidation-warningBorder", + "vscode-inputValidation-errorBackground", + "vscode-inputValidation-errorBorder", + "vscode-dropdown-background", + "vscode-dropdown-foreground", + "vscode-dropdown-border", + "vscode-checkbox-background", + "vscode-checkbox-foreground", + "vscode-checkbox-border", + "vscode-button-foreground", + "vscode-button-background", + "vscode-button-hoverBackground", + "vscode-button-secondaryForeground", + "vscode-button-secondaryBackground", + "vscode-button-secondaryHoverBackground", + "vscode-badge-background", + "vscode-badge-foreground", + "vscode-scrollbar-shadow", + "vscode-scrollbarSlider-background", + "vscode-scrollbarSlider-hoverBackground", + "vscode-scrollbarSlider-activeBackground", + "vscode-progressBar-background", + "vscode-editorError-foreground", + "vscode-editorWarning-foreground", + "vscode-editorInfo-foreground", + "vscode-editorHint-foreground", + "vscode-sash-hoverBorder", + "vscode-editor-background", + "vscode-editor-foreground", + "vscode-editorWidget-background", + "vscode-editorWidget-foreground", + "vscode-editorWidget-border", + "vscode-quickInput-background", + "vscode-quickInput-foreground", + "vscode-quickInputTitle-background", + "vscode-pickerGroup-foreground", + "vscode-pickerGroup-border", + "vscode-keybindingLabel-background", + "vscode-keybindingLabel-foreground", + "vscode-keybindingLabel-border", + "vscode-keybindingLabel-bottomBorder", + "vscode-editor-selectionBackground", + "vscode-editor-selectionForeground", + "vscode-editor-inactiveSelectionBackground", + "vscode-editor-selectionHighlightBackground", + "vscode-editor-findMatchBackground", + "vscode-editor-findMatchHighlightBackground", + "vscode-editor-findRangeHighlightBackground", + "vscode-editor-findMatchBorder", + "vscode-searchEditor-findMatchBackground", + "vscode-editor-hoverHighlightBackground", + "vscode-editorHoverWidget-background", + "vscode-editorHoverWidget-foreground", + "vscode-editorHoverWidget-border", + "vscode-editorHoverWidget-statusBarBackground", + "vscode-editorLink-activeForeground", + "vscode-editorInlayHint-foreground", + "vscode-editorInlayHint-background", + "vscode-editorInlayHint-typeForeground", + "vscode-editorInlayHint-typeBackground", + "vscode-editorInlayHint-parameterForeground", + "vscode-editorInlayHint-parameterBackground", + "vscode-editorLightBulb-foreground", + "vscode-editorLightBulbAutoFix-foreground", + "vscode-diffEditor-insertedTextBackground", + "vscode-diffEditor-removedTextBackground", + "vscode-diffEditor-diagonalFill", + "vscode-list-focusOutline", + "vscode-list-activeSelectionBackground", + "vscode-list-activeSelectionForeground", + "vscode-list-inactiveSelectionBackground", + "vscode-list-inactiveSelectionForeground", + "vscode-list-inactiveFocusOutline", + "vscode-list-hoverBackground", + "vscode-list-dropBackground", + "vscode-list-highlightForeground", + "vscode-list-focusHighlightForeground", + "vscode-list-invalidItemForeground", + "vscode-list-errorForeground", + "vscode-list-warningForeground", + "vscode-listFilterWidget-background", + "vscode-listFilterWidget-outline", + "vscode-listFilterWidget-noMatchesOutline", + "vscode-list-filterMatchBackground", + "vscode-tree-indentGuidesStroke", + "vscode-tree-tableColumnsBorder", + "vscode-tree-tableOddRowsBackground", + "vscode-list-deemphasizedForeground", + "vscode-quickInputList-focusForeground", + "vscode-quickInputList-focusBackground", + "vscode-menu-border", + "vscode-menu-foreground", + "vscode-menu-background", + "vscode-menu-selectionForeground", + "vscode-menu-selectionBackground", + "vscode-menu-separatorBackground", + "vscode-toolbar-hoverBackground", + "vscode-toolbar-activeBackground", + "vscode-editor-snippetTabstopHighlightBackground", + "vscode-editor-snippetFinalTabstopHighlightBorder", + "vscode-breadcrumb-foreground", + "vscode-breadcrumb-background", + "vscode-breadcrumb-focusForeground", + "vscode-breadcrumb-activeSelectionForeground", + "vscode-breadcrumbPicker-background", + "vscode-merge-currentHeaderBackground", + "vscode-merge-currentContentBackground", + "vscode-merge-incomingHeaderBackground", + "vscode-merge-incomingContentBackground", + "vscode-merge-commonHeaderBackground", + "vscode-merge-commonContentBackground", + "vscode-editorOverviewRuler-currentContentForeground", + "vscode-editorOverviewRuler-incomingContentForeground", + "vscode-editorOverviewRuler-commonContentForeground", + "vscode-editorOverviewRuler-findMatchForeground", + "vscode-editorOverviewRuler-selectionHighlightForeground", + "vscode-editorOverviewRuler-unicodeForeground", + "vscode-minimap-findMatchHighlight", + "vscode-minimap-selectionOccurrenceHighlight", + "vscode-minimap-selectionHighlight", + "vscode-minimap-errorHighlight", + "vscode-minimap-warningHighlight", + "vscode-minimap-foregroundOpacity", + "vscode-minimap-unicodeHighlight", + "vscode-minimapSlider-background", + "vscode-minimapSlider-hoverBackground", + "vscode-minimapSlider-activeBackground", + "vscode-problemsErrorIcon-foreground", + "vscode-problemsWarningIcon-foreground", + "vscode-problemsInfoIcon-foreground", + "vscode-charts-foreground", + "vscode-charts-lines", + "vscode-charts-red", + "vscode-charts-blue", + "vscode-charts-yellow", + "vscode-charts-orange", + "vscode-charts-green", + "vscode-charts-purple", + "vscode-editor-lineHighlightBackground", + "vscode-editor-lineHighlightBorder", + "vscode-editor-rangeHighlightBackground", + "vscode-editor-symbolHighlightBackground", + "vscode-editorCursor-foreground", + "vscode-editorWhitespace-foreground", + "vscode-editorIndentGuide-background", + "vscode-editorIndentGuide-activeBackground", + "vscode-editorLineNumber-foreground", + "vscode-editorActiveLineNumber-foreground", + "vscode-editorLineNumber-activeForeground", + "vscode-editorRuler-foreground", + "vscode-editorCodeLens-foreground", + "vscode-editorBracketMatch-background", + "vscode-editorBracketMatch-border", + "vscode-editorOverviewRuler-border", + "vscode-editorGutter-background", + "vscode-editorUnnecessaryCode-opacity", + "vscode-editorGhostText-foreground", + "vscode-editorOverviewRuler-rangeHighlightForeground", + "vscode-editorOverviewRuler-errorForeground", + "vscode-editorOverviewRuler-warningForeground", + "vscode-editorOverviewRuler-infoForeground", + "vscode-editorBracketHighlight-foreground1", + "vscode-editorBracketHighlight-foreground2", + "vscode-editorBracketHighlight-foreground3", + "vscode-editorBracketHighlight-foreground4", + "vscode-editorBracketHighlight-foreground5", + "vscode-editorBracketHighlight-foreground6", + "vscode-editorBracketHighlight-unexpectedBracket.foreground", + "vscode-editorBracketPairGuide-background1", + "vscode-editorBracketPairGuide-background2", + "vscode-editorBracketPairGuide-background3", + "vscode-editorBracketPairGuide-background4", + "vscode-editorBracketPairGuide-background5", + "vscode-editorBracketPairGuide-background6", + "vscode-editorBracketPairGuide-activeBackground1", + "vscode-editorBracketPairGuide-activeBackground2", + "vscode-editorBracketPairGuide-activeBackground3", + "vscode-editorBracketPairGuide-activeBackground4", + "vscode-editorBracketPairGuide-activeBackground5", + "vscode-editorBracketPairGuide-activeBackground6", + "vscode-editorUnicodeHighlight-border", + "vscode-symbolIcon-arrayForeground", + "vscode-symbolIcon-booleanForeground", + "vscode-symbolIcon-classForeground", + "vscode-symbolIcon-colorForeground", + "vscode-symbolIcon-constantForeground", + "vscode-symbolIcon-constructorForeground", + "vscode-symbolIcon-enumeratorForeground", + "vscode-symbolIcon-enumeratorMemberForeground", + "vscode-symbolIcon-eventForeground", + "vscode-symbolIcon-fieldForeground", + "vscode-symbolIcon-fileForeground", + "vscode-symbolIcon-folderForeground", + "vscode-symbolIcon-functionForeground", + "vscode-symbolIcon-interfaceForeground", + "vscode-symbolIcon-keyForeground", + "vscode-symbolIcon-keywordForeground", + "vscode-symbolIcon-methodForeground", + "vscode-symbolIcon-moduleForeground", + "vscode-symbolIcon-namespaceForeground", + "vscode-symbolIcon-nullForeground", + "vscode-symbolIcon-numberForeground", + "vscode-symbolIcon-objectForeground", + "vscode-symbolIcon-operatorForeground", + "vscode-symbolIcon-packageForeground", + "vscode-symbolIcon-propertyForeground", + "vscode-symbolIcon-referenceForeground", + "vscode-symbolIcon-snippetForeground", + "vscode-symbolIcon-stringForeground", + "vscode-symbolIcon-structForeground", + "vscode-symbolIcon-textForeground", + "vscode-symbolIcon-typeParameterForeground", + "vscode-symbolIcon-unitForeground", + "vscode-symbolIcon-variableForeground", + "vscode-editorHoverWidget-highlightForeground", + "vscode-editorOverviewRuler-bracketMatchForeground", + "vscode-editor-foldBackground", + "vscode-editorGutter-foldingControlForeground", + "vscode-editor-linkedEditingBackground", + "vscode-editorSuggestWidget-background", + "vscode-editorSuggestWidget-border", + "vscode-editorSuggestWidget-foreground", + "vscode-editorSuggestWidget-selectedForeground", + "vscode-editorSuggestWidget-selectedBackground", + "vscode-editorSuggestWidget-highlightForeground", + "vscode-editorSuggestWidget-focusHighlightForeground", + "vscode-editorSuggestWidgetStatus-foreground", + "vscode-editor-wordHighlightBackground", + "vscode-editor-wordHighlightStrongBackground", + "vscode-editorOverviewRuler-wordHighlightForeground", + "vscode-editorOverviewRuler-wordHighlightStrongForeground", + "vscode-peekViewTitle-background", + "vscode-peekViewTitleLabel-foreground", + "vscode-peekViewTitleDescription-foreground", + "vscode-peekView-border", + "vscode-peekViewResult-background", + "vscode-peekViewResult-lineForeground", + "vscode-peekViewResult-fileForeground", + "vscode-peekViewResult-selectionBackground", + "vscode-peekViewResult-selectionForeground", + "vscode-peekViewEditor-background", + "vscode-peekViewEditorGutter-background", + "vscode-peekViewResult-matchHighlightBackground", + "vscode-peekViewEditor-matchHighlightBackground", + "vscode-editorMarkerNavigationError-background", + "vscode-editorMarkerNavigationError-headerBackground", + "vscode-editorMarkerNavigationWarning-background", + "vscode-editorMarkerNavigationWarning-headerBackground", + "vscode-editorMarkerNavigationInfo-background", + "vscode-editorMarkerNavigationInfo-headerBackground", + "vscode-editorMarkerNavigation-background", + "vscode-tab-activeBackground", + "vscode-tab-unfocusedActiveBackground", + "vscode-tab-inactiveBackground", + "vscode-tab-unfocusedInactiveBackground", + "vscode-tab-activeForeground", + "vscode-tab-inactiveForeground", + "vscode-tab-unfocusedActiveForeground", + "vscode-tab-unfocusedInactiveForeground", + "vscode-tab-border", + "vscode-tab-lastPinnedBorder", + "vscode-tab-activeModifiedBorder", + "vscode-tab-inactiveModifiedBorder", + "vscode-tab-unfocusedActiveModifiedBorder", + "vscode-tab-unfocusedInactiveModifiedBorder", + "vscode-editorPane-background", + "vscode-editorGroupHeader-tabsBackground", + "vscode-editorGroupHeader-tabsBorder", + "vscode-editorGroupHeader-noTabsBackground", + "vscode-editorGroup-border", + "vscode-editorGroup-dropBackground", + "vscode-sideBySideEditor-horizontalBorder", + "vscode-sideBySideEditor-verticalBorder", + "vscode-panel-background", + "vscode-panel-border", + "vscode-panelTitle-activeForeground", + "vscode-panelTitle-inactiveForeground", + "vscode-panelTitle-activeBorder", + "vscode-panel-dropBorder", + "vscode-panelSection-dropBackground", + "vscode-panelSectionHeader-background", + "vscode-panelSection-border", + "vscode-banner-background", + "vscode-banner-foreground", + "vscode-banner-iconForeground", + "vscode-statusBar-foreground", + "vscode-statusBar-noFolderForeground", + "vscode-statusBar-background", + "vscode-statusBar-noFolderBackground", + "vscode-statusBar-border", + "vscode-statusBar-noFolderBorder", + "vscode-statusBarItem-activeBackground", + "vscode-statusBarItem-hoverBackground", + "vscode-statusBarItem-prominentForeground", + "vscode-statusBarItem-prominentBackground", + "vscode-statusBarItem-prominentHoverBackground", + "vscode-statusBarItem-errorBackground", + "vscode-statusBarItem-errorForeground", + "vscode-statusBarItem-warningBackground", + "vscode-statusBarItem-warningForeground", + "vscode-activityBar-background", + "vscode-activityBar-foreground", + "vscode-activityBar-inactiveForeground", + "vscode-activityBar-border", + "vscode-activityBar-activeBorder", + "vscode-activityBar-activeFocusBorder", + "vscode-activityBar-activeBackground", + "vscode-activityBar-dropBorder", + "vscode-activityBarBadge-background", + "vscode-activityBarBadge-foreground", + "vscode-statusBarItem-remoteBackground", + "vscode-statusBarItem-remoteForeground", + "vscode-extensionBadge-remoteBackground", + "vscode-extensionBadge-remoteForeground", + "vscode-sideBar-background", + "vscode-sideBar-foreground", + "vscode-sideBar-border", + "vscode-sideBarTitle-foreground", + "vscode-sideBar-dropBackground", + "vscode-sideBarSectionHeader-background", + "vscode-sideBarSectionHeader-foreground", + "vscode-sideBarSectionHeader-border", + "vscode-titleBar-activeForeground", + "vscode-titleBar-inactiveForeground", + "vscode-titleBar-activeBackground", + "vscode-titleBar-inactiveBackground", + "vscode-menubar-selectionForeground", + "vscode-menubar-selectionBackground", + "vscode-notificationCenter-border", + "vscode-notificationToast-border", + "vscode-notifications-foreground", + "vscode-notifications-background", + "vscode-notificationLink-foreground", + "vscode-notificationCenterHeader-foreground", + "vscode-notificationCenterHeader-background", + "vscode-notifications-border", + "vscode-notificationsErrorIcon-foreground", + "vscode-notificationsWarningIcon-foreground", + "vscode-notificationsInfoIcon-foreground", + "vscode-editorGutter-commentRangeForeground", + "vscode-debugToolBar-background", + "vscode-debugToolBar-border", + "vscode-debugIcon-startForeground", + "vscode-editor-stackFrameHighlightBackground", + "vscode-editor-focusedStackFrameHighlightBackground", + "vscode-settings-headerForeground", + "vscode-settings-modifiedItemIndicator", + "vscode-settings-dropdownBackground", + "vscode-settings-dropdownForeground", + "vscode-settings-dropdownBorder", + "vscode-settings-dropdownListBorder", + "vscode-settings-checkboxBackground", + "vscode-settings-checkboxForeground", + "vscode-settings-checkboxBorder", + "vscode-settings-textInputBackground", + "vscode-settings-textInputForeground", + "vscode-settings-numberInputBackground", + "vscode-settings-numberInputForeground", + "vscode-settings-focusedRowBackground", + "vscode-settings-rowHoverBackground", + "vscode-settings-focusedRowBorder", + "vscode-terminal-background", + "vscode-terminal-foreground", + "vscode-terminal-selectionBackground", + "vscode-terminal-border", + "vscode-terminal-dropBackground", + "vscode-testing-iconFailed", + "vscode-testing-iconErrored", + "vscode-testing-iconPassed", + "vscode-testing-runAction", + "vscode-testing-iconQueued", + "vscode-testing-iconUnset", + "vscode-testing-iconSkipped", + "vscode-testing-peekBorder", + "vscode-testing-peekHeaderBackground", + "vscode-testing-message.error.decorationForeground", + "vscode-testing-message.error.lineBackground", + "vscode-testing-message.info.decorationForeground", + "vscode-welcomePage-tileBackground", + "vscode-welcomePage-tileHoverBackground", + "vscode-welcomePage-tileShadow", + "vscode-welcomePage-progress.background", + "vscode-welcomePage-progress.foreground", + "vscode-statusBar-debuggingBackground", + "vscode-statusBar-debuggingForeground", + "vscode-statusBar-debuggingBorder", + "vscode-debugExceptionWidget-border", + "vscode-debugExceptionWidget-background", + "vscode-ports-iconRunningProcessForeground", + "vscode-editor-inlineValuesForeground", + "vscode-editor-inlineValuesBackground", + "vscode-editorGutter-modifiedBackground", + "vscode-editorGutter-addedBackground", + "vscode-editorGutter-deletedBackground", + "vscode-minimapGutter-modifiedBackground", + "vscode-minimapGutter-addedBackground", + "vscode-minimapGutter-deletedBackground", + "vscode-editorOverviewRuler-modifiedForeground", + "vscode-editorOverviewRuler-addedForeground", + "vscode-editorOverviewRuler-deletedForeground", + "vscode-debugIcon-breakpointForeground", + "vscode-debugIcon-breakpointDisabledForeground", + "vscode-debugIcon-breakpointUnverifiedForeground", + "vscode-debugIcon-breakpointCurrentStackframeForeground", + "vscode-debugIcon-breakpointStackframeForeground", + "vscode-keybindingTable-headerBackground", + "vscode-keybindingTable-rowsBackground", + "vscode-notebook-cellBorderColor", + "vscode-notebook-focusedEditorBorder", + "vscode-notebookStatusSuccessIcon-foreground", + "vscode-notebookStatusErrorIcon-foreground", + "vscode-notebookStatusRunningIcon-foreground", + "vscode-notebook-cellToolbarSeparator", + "vscode-notebook-selectedCellBackground", + "vscode-notebook-selectedCellBorder", + "vscode-notebook-focusedCellBorder", + "vscode-notebook-inactiveFocusedCellBorder", + "vscode-notebook-cellStatusBarItemHoverBackground", + "vscode-notebook-cellInsertionIndicator", + "vscode-notebookScrollbarSlider-background", + "vscode-notebookScrollbarSlider-hoverBackground", + "vscode-notebookScrollbarSlider-activeBackground", + "vscode-notebook-symbolHighlightBackground", + "vscode-notebook-cellEditorBackground", + "vscode-scm-providerBorder", + "vscode-debugTokenExpression-name", + "vscode-debugTokenExpression-value", + "vscode-debugTokenExpression-string", + "vscode-debugTokenExpression-boolean", + "vscode-debugTokenExpression-number", + "vscode-debugTokenExpression-error", + "vscode-debugView-exceptionLabelForeground", + "vscode-debugView-exceptionLabelBackground", + "vscode-debugView-stateLabelForeground", + "vscode-debugView-stateLabelBackground", + "vscode-debugView-valueChangedHighlight", + "vscode-debugConsole-infoForeground", + "vscode-debugConsole-warningForeground", + "vscode-debugConsole-errorForeground", + "vscode-debugConsole-sourceForeground", + "vscode-debugConsoleInputIcon-foreground", + "vscode-debugIcon-pauseForeground", + "vscode-debugIcon-stopForeground", + "vscode-debugIcon-disconnectForeground", + "vscode-debugIcon-restartForeground", + "vscode-debugIcon-stepOverForeground", + "vscode-debugIcon-stepIntoForeground", + "vscode-debugIcon-stepOutForeground", + "vscode-debugIcon-continueForeground", + "vscode-debugIcon-stepBackForeground", + "vscode-extensionButton-prominentBackground", + "vscode-extensionButton-prominentForeground", + "vscode-extensionButton-prominentHoverBackground", + "vscode-extensionIcon-starForeground", + "vscode-extensionIcon-verifiedForeground", + "vscode-extensionIcon-preReleaseForeground", + "vscode-terminal-ansiBlack", + "vscode-terminal-ansiRed", + "vscode-terminal-ansiGreen", + "vscode-terminal-ansiYellow", + "vscode-terminal-ansiBlue", + "vscode-terminal-ansiMagenta", + "vscode-terminal-ansiCyan", + "vscode-terminal-ansiWhite", + "vscode-terminal-ansiBrightBlack", + "vscode-terminal-ansiBrightRed", + "vscode-terminal-ansiBrightGreen", + "vscode-terminal-ansiBrightYellow", + "vscode-terminal-ansiBrightBlue", + "vscode-terminal-ansiBrightMagenta", + "vscode-terminal-ansiBrightCyan", + "vscode-terminal-ansiBrightWhite", + "vscode-interactive-activeCodeBorder", + "vscode-interactive-inactiveCodeBorder", + "vscode-gitDecoration-addedResourceForeground", + "vscode-gitDecoration-modifiedResourceForeground", + "vscode-gitDecoration-deletedResourceForeground", + "vscode-gitDecoration-renamedResourceForeground", + "vscode-gitDecoration-untrackedResourceForeground", + "vscode-gitDecoration-ignoredResourceForeground", + "vscode-gitDecoration-stageModifiedResourceForeground", + "vscode-gitDecoration-stageDeletedResourceForeground", + "vscode-gitDecoration-conflictingResourceForeground", + "vscode-gitDecoration-submoduleResourceForeground", + "vscode-testExplorer-errorDecorationBackground", +]; From c015704cd49be4ae23309507c4c9428241fcdf2e Mon Sep 17 00:00:00 2001 From: Dallin Romney Date: Mon, 6 Jan 2025 00:14:06 +0100 Subject: [PATCH 4/8] remove light gray --- gui/src/components/AccountDialog.tsx | 4 +- .../CodeToEditCard/AddFileButton.tsx | 6 +- .../CodeToEditCard/AddFileCombobox.tsx | 6 +- .../CodeToEditCard/CodeToEditCard.tsx | 6 +- .../CodeToEditCard/CodeToEditListItem.tsx | 10 ++-- .../components/BestExperienceConfigForm.tsx | 6 +- gui/src/components/ProfileSwitcher.tsx | 10 ++-- .../components/dialogs/ConfirmationDialog.tsx | 2 +- gui/src/components/dialogs/index.tsx | 5 +- gui/src/components/gui/TimelineItem.tsx | 4 +- gui/src/components/index.ts | 33 +++++++---- .../components/mainInput/ContextItemsPeek.tsx | 6 +- gui/src/components/mainInput/InputToolbar.tsx | 5 +- .../InputToolbar/ToggleToolsButton.tsx | 12 ++-- gui/src/components/mainInput/MentionList.tsx | 7 ++- .../components/mainInput/NewSessionButton.tsx | 7 ++- gui/src/components/mainInput/TipTapEditor.css | 2 +- gui/src/components/mainInput/TipTapEditor.tsx | 5 +- gui/src/components/mainInput/TutorialCard.tsx | 13 ++-- .../markdown/CodeSnippetPreview.tsx | 6 +- .../StepContainerPreToolbar/ApplyActions.tsx | 4 +- .../StepContainerPreToolbar/CopyButton.tsx | 8 +-- .../RunInTerminalButton.tsx | 4 +- .../StepContainerPreToolbar.tsx | 4 +- .../ToolbarButtonWithTooltip.tsx | 4 +- .../components/modelSelection/ModelCard.tsx | 21 +++---- .../components/modelSelection/ModelSelect.tsx | 16 ++--- .../modelSelection/ModelSelectionListbox.tsx | 4 +- .../modelSelection/ModelSettings.tsx | 4 +- gui/src/components/modelSelection/Toggle.tsx | 7 ++- gui/src/pages/AddNewModel/AddNewModel.tsx | 10 ++-- .../pages/AddNewModel/ConfigureProvider.tsx | 6 +- gui/src/pages/More/KeyboardShortcuts.tsx | 4 +- gui/src/pages/More/MoreHelpRow.tsx | 4 +- gui/src/pages/gui/Chat.tsx | 15 ++--- .../gui/ToolCallDiv/ToolCallButtonsDiv.tsx | 8 +-- gui/src/pages/stats.tsx | 10 ++-- gui/src/pages/theme/index.tsx | 59 +++++++++---------- gui/tailwind.config.cjs | 3 +- ....timestamp-1736117228991-d8b5a5bce8bef.mjs | 27 +++++++++ 40 files changed, 202 insertions(+), 175 deletions(-) create mode 100644 gui/vite.config.ts.timestamp-1736117228991-d8b5a5bce8bef.mjs diff --git a/gui/src/components/AccountDialog.tsx b/gui/src/components/AccountDialog.tsx index c555205747..36112f1f9c 100644 --- a/gui/src/components/AccountDialog.tsx +++ b/gui/src/components/AccountDialog.tsx @@ -43,7 +43,7 @@ export default function AccountDialog() { return (

Account

- + Signed out diff --git a/gui/src/pages/gui/ToolCallDiv/ToolCallButtonsDiv.tsx b/gui/src/pages/gui/ToolCallDiv/ToolCallButtonsDiv.tsx index 9d4528f33c..9cece16c57 100644 --- a/gui/src/pages/gui/ToolCallDiv/ToolCallButtonsDiv.tsx +++ b/gui/src/pages/gui/ToolCallDiv/ToolCallButtonsDiv.tsx @@ -2,7 +2,7 @@ import { useSelector } from "react-redux"; import styled from "styled-components"; import { defaultBorderRadius, - lightGray, + vscBorder, vscButtonBackground, vscButtonForeground, } from "../../../components"; @@ -42,8 +42,8 @@ const AcceptButton = styled(Button)` `; const RejectButton = styled(Button)` - color: ${lightGray}; - border: 1px solid ${lightGray}; + color: ${vscBorder}; + border: 1px solid ${vscBorder}; background-color: transparent; `; @@ -64,7 +64,7 @@ export function ToolCallButtons(props: ToolCallButtonsProps) {
diff --git a/gui/src/pages/stats.tsx b/gui/src/pages/stats.tsx index 21c2481b68..087f232b46 100644 --- a/gui/src/pages/stats.tsx +++ b/gui/src/pages/stats.tsx @@ -3,7 +3,7 @@ import { useContext, useEffect, useState } from "react"; import { useNavigate } from "react-router-dom"; import styled from "styled-components"; import { table } from "table"; -import { lightGray, vscBackground, vscInputBackground } from "../components"; +import { vscBorder, vscBackground, vscInputBackground } from "../components"; import { CopyIconButton } from "../components/gui/CopyIconButton"; import { IdeMessengerContext } from "../context/IdeMessenger"; import { useNavigationListener } from "../hooks/useNavigationListener"; @@ -11,7 +11,7 @@ import { useNavigationListener } from "../hooks/useNavigationListener"; const Th = styled.th` padding: 0.5rem; text-align: left; - border: 1px solid ${lightGray}; + border: 1px solid ${vscBorder}; `; const Tr = styled.tr` @@ -21,12 +21,12 @@ const Tr = styled.tr` overflow-wrap: anywhere; - border: 1px solid ${lightGray}; + border: 1px solid ${vscBorder}; `; const Td = styled.td` padding: 0.5rem; - border: 1px solid ${lightGray}; + border: 1px solid ${vscBorder}; `; function generateTable(data: unknown[][]) { @@ -69,7 +69,7 @@ function Stats() { onClick={() => navigate(-1)} className="sticky top-0 m-0 flex cursor-pointer items-center p-0" style={{ - borderBottom: `0.5px solid ${lightGray}`, + borderBottom: `0.5px solid ${vscBorder}`, backgroundColor: vscBackground, }} > diff --git a/gui/src/pages/theme/index.tsx b/gui/src/pages/theme/index.tsx index 7b58f0158e..f927f0ee2b 100644 --- a/gui/src/pages/theme/index.tsx +++ b/gui/src/pages/theme/index.tsx @@ -1,52 +1,51 @@ import { useNavigate } from "react-router-dom"; import { CheckIcon, XIcon } from "@heroicons/react/solid"; import { vscodeCssClasses } from "./vscode-classes"; +import { VSC_THEME_COLOR_VARS } from "../../components"; interface ThemeExampleProps { className: string; } -// const classes = [ -// "lightgray", -// "vsc-background", -// "secondary-dark", -// "vsc-input-background", -// "vsc-quick-input-background", -// "vsc-background", -// "vsc-foreground", -// "vsc-button-background", -// "vsc-button-foreground", -// "vsc-editor-background", -// "vsc-list-active-background", -// "vsc-focus-border", -// "vsc-list-active-foreground", -// "vsc-input-border", -// "vsc-input-border-focus", -// "vsc-badge-background", -// "vsc-badge-foreground", -// "vsc-sidebar-border", -// "vsc-find-match", -// "vsc-find-match-selected", -// "vsc-foreground-muted", -// "vsc-description-foreground", -// "vsc-input-placeholder-foreground", -// "error", -// "error-foreground", -// ]; +const TAILWIND_CLASSES = [ + "vsc-background", + "secondary-dark", + "vsc-input-background", + "vsc-quick-input-background", + "vsc-background", + "vsc-foreground", + "vsc-button-background", + "vsc-button-foreground", + "vsc-editor-background", + "vsc-list-active-background", + "vsc-focus-border", + "vsc-list-active-foreground", + "vsc-input-border", + "vsc-input-border-focus", + "vsc-badge-background", + "vsc-badge-foreground", + "vsc-sidebar-border", + "vsc-find-match", + "vsc-find-match-selected", + "vsc-foreground-muted", + "vsc-description-foreground", + "vsc-input-placeholder-foreground", + "error", + "error-foreground", +]; const ThemeExample = ({ className }: ThemeExampleProps) => { // const exists = window // .getComputedStyle(document.documentElement) // .getPropertyValue(`--${className}`) // .trim(); - const exists = true; return (
{className}
{/*{exists ? ( @@ -70,7 +69,7 @@ export default function ThemePage() {

More pretty than this

- {vscodeCssClasses.map((c) => ( + {VSC_THEME_COLOR_VARS.map((c) => ( ))}
diff --git a/gui/tailwind.config.cjs b/gui/tailwind.config.cjs index 0f22883b5a..6628e3f3f6 100644 --- a/gui/tailwind.config.cjs +++ b/gui/tailwind.config.cjs @@ -27,7 +27,6 @@ module.exports = { colors: { // All vscode variables https://gist.github.com/estruyf/ba49203e1a7d6868e9320a4ea480c27a // Examples for vscode https://github.com/githubocto/tailwind-vscode/blob/main/index.js - lightgray: "#999998", "vsc-background": "rgb(var(--vsc-background) / )", "secondary-dark": "rgb(var(--secondary-dark) / )", "vsc-input-background": "var(--vscode-input-background, rgb(45 45 45))", @@ -60,6 +59,8 @@ module.exports = { "var(--vscode-input-placeholderForeground, #999)", error: "var(--vscode-errorBackground, #f00)", "error-foreground": "var(--vscode-errorForeground, #fff)", + border: "var(--vscode-sideBar-border, #999998)", + description: "var(--vscode-descriptionForeground, #999)", // --vscode-errorForeground /* Text color for error messages */ // --vscode-errorBackground /* Background color for error messages */ diff --git a/gui/vite.config.ts.timestamp-1736117228991-d8b5a5bce8bef.mjs b/gui/vite.config.ts.timestamp-1736117228991-d8b5a5bce8bef.mjs new file mode 100644 index 0000000000..30c661fa74 --- /dev/null +++ b/gui/vite.config.ts.timestamp-1736117228991-d8b5a5bce8bef.mjs @@ -0,0 +1,27 @@ +// vite.config.ts +import react from "file:///Users/dallin/Documents/code/continue/gui/node_modules/@vitejs/plugin-react-swc/index.mjs"; +import tailwindcss from "file:///Users/dallin/Documents/code/continue/gui/node_modules/tailwindcss/lib/index.js"; +import { defineConfig } from "file:///Users/dallin/Documents/code/continue/gui/node_modules/vitest/dist/config.js"; +var vite_config_default = defineConfig({ + plugins: [react(), tailwindcss()], + build: { + // Change the output .js filename to not include a hash + rollupOptions: { + // external: ["vscode-webview"], + output: { + entryFileNames: `assets/[name].js`, + chunkFileNames: `assets/[name].js`, + assetFileNames: `assets/[name].[ext]` + } + } + }, + test: { + globals: true, + environment: "jsdom", + setupFiles: "./src/util/test/setupTests.ts" + } +}); +export { + vite_config_default as default +}; +//# sourceMappingURL=data:application/json;base64,ewogICJ2ZXJzaW9uIjogMywKICAic291cmNlcyI6IFsidml0ZS5jb25maWcudHMiXSwKICAic291cmNlc0NvbnRlbnQiOiBbImNvbnN0IF9fdml0ZV9pbmplY3RlZF9vcmlnaW5hbF9kaXJuYW1lID0gXCIvVXNlcnMvZGFsbGluL0RvY3VtZW50cy9jb2RlL2NvbnRpbnVlL2d1aVwiO2NvbnN0IF9fdml0ZV9pbmplY3RlZF9vcmlnaW5hbF9maWxlbmFtZSA9IFwiL1VzZXJzL2RhbGxpbi9Eb2N1bWVudHMvY29kZS9jb250aW51ZS9ndWkvdml0ZS5jb25maWcudHNcIjtjb25zdCBfX3ZpdGVfaW5qZWN0ZWRfb3JpZ2luYWxfaW1wb3J0X21ldGFfdXJsID0gXCJmaWxlOi8vL1VzZXJzL2RhbGxpbi9Eb2N1bWVudHMvY29kZS9jb250aW51ZS9ndWkvdml0ZS5jb25maWcudHNcIjtpbXBvcnQgcmVhY3QgZnJvbSBcIkB2aXRlanMvcGx1Z2luLXJlYWN0LXN3Y1wiO1xuaW1wb3J0IHRhaWx3aW5kY3NzIGZyb20gXCJ0YWlsd2luZGNzc1wiO1xuaW1wb3J0IHsgZGVmaW5lQ29uZmlnIH0gZnJvbSBcInZpdGVzdC9jb25maWdcIjtcblxuLy8gaHR0cHM6Ly92aXRlanMuZGV2L2NvbmZpZy9cbmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbmZpZyh7XG4gIHBsdWdpbnM6IFtyZWFjdCgpLCB0YWlsd2luZGNzcygpXSxcbiAgYnVpbGQ6IHtcbiAgICAvLyBDaGFuZ2UgdGhlIG91dHB1dCAuanMgZmlsZW5hbWUgdG8gbm90IGluY2x1ZGUgYSBoYXNoXG4gICAgcm9sbHVwT3B0aW9uczoge1xuICAgICAgLy8gZXh0ZXJuYWw6IFtcInZzY29kZS13ZWJ2aWV3XCJdLFxuICAgICAgb3V0cHV0OiB7XG4gICAgICAgIGVudHJ5RmlsZU5hbWVzOiBgYXNzZXRzL1tuYW1lXS5qc2AsXG4gICAgICAgIGNodW5rRmlsZU5hbWVzOiBgYXNzZXRzL1tuYW1lXS5qc2AsXG4gICAgICAgIGFzc2V0RmlsZU5hbWVzOiBgYXNzZXRzL1tuYW1lXS5bZXh0XWAsXG4gICAgICB9LFxuICAgIH0sXG4gIH0sXG4gIHRlc3Q6IHtcbiAgICBnbG9iYWxzOiB0cnVlLFxuICAgIGVudmlyb25tZW50OiBcImpzZG9tXCIsXG4gICAgc2V0dXBGaWxlczogXCIuL3NyYy91dGlsL3Rlc3Qvc2V0dXBUZXN0cy50c1wiLFxuICB9LFxufSk7XG4iXSwKICAibWFwcGluZ3MiOiAiO0FBQTZTLE9BQU8sV0FBVztBQUMvVCxPQUFPLGlCQUFpQjtBQUN4QixTQUFTLG9CQUFvQjtBQUc3QixJQUFPLHNCQUFRLGFBQWE7QUFBQSxFQUMxQixTQUFTLENBQUMsTUFBTSxHQUFHLFlBQVksQ0FBQztBQUFBLEVBQ2hDLE9BQU87QUFBQTtBQUFBLElBRUwsZUFBZTtBQUFBO0FBQUEsTUFFYixRQUFRO0FBQUEsUUFDTixnQkFBZ0I7QUFBQSxRQUNoQixnQkFBZ0I7QUFBQSxRQUNoQixnQkFBZ0I7QUFBQSxNQUNsQjtBQUFBLElBQ0Y7QUFBQSxFQUNGO0FBQUEsRUFDQSxNQUFNO0FBQUEsSUFDSixTQUFTO0FBQUEsSUFDVCxhQUFhO0FBQUEsSUFDYixZQUFZO0FBQUEsRUFDZDtBQUNGLENBQUM7IiwKICAibmFtZXMiOiBbXQp9Cg== From 01a68f3fca60cf36b0b34886bcb177f2658b6a54 Mon Sep 17 00:00:00 2001 From: Dallin Romney Date: Mon, 6 Jan 2025 12:48:33 +0100 Subject: [PATCH 5/8] more replacements --- .../StepContainer/AcceptRejectAllButtons.tsx | 2 +- gui/src/pages/error.tsx | 2 +- gui/src/pages/gui/Chat.tsx | 1 + gui/src/pages/theme/index.tsx | 30 ++++++++++--------- 4 files changed, 19 insertions(+), 16 deletions(-) diff --git a/gui/src/components/StepContainer/AcceptRejectAllButtons.tsx b/gui/src/components/StepContainer/AcceptRejectAllButtons.tsx index 532593c18e..9bb1ceb418 100644 --- a/gui/src/components/StepContainer/AcceptRejectAllButtons.tsx +++ b/gui/src/components/StepContainer/AcceptRejectAllButtons.tsx @@ -39,7 +39,7 @@ export default function AcceptRejectAllButtons({ className="flex cursor-pointer items-center border-none bg-transparent px-2 py-1 text-xs text-gray-300 opacity-80 hover:opacity-100 hover:brightness-125" onClick={() => handleAcceptOrReject("rejectDiff")} > - + {isSingleRangeEdit ? ( Reject ({getMetaKeyLabel()}⇧⌫) ) : ( diff --git a/gui/src/pages/error.tsx b/gui/src/pages/error.tsx index 55d64af537..62c4a0801f 100644 --- a/gui/src/pages/error.tsx +++ b/gui/src/pages/error.tsx @@ -50,7 +50,7 @@ const ErrorPage: React.FC = () => { }} > {initialLoad ? ( - + ) : ( )} diff --git a/gui/src/pages/gui/Chat.tsx b/gui/src/pages/gui/Chat.tsx index f774dc9b3e..b3581e42c2 100644 --- a/gui/src/pages/gui/Chat.tsx +++ b/gui/src/pages/gui/Chat.tsx @@ -18,6 +18,7 @@ import { defaultBorderRadius, vscBackground, vscBorder, + vscError, } from "../../components"; import { ChatScrollAnchor } from "../../components/ChatScrollAnchor"; import CodeToEditCard from "../../components/CodeToEditCard"; diff --git a/gui/src/pages/theme/index.tsx b/gui/src/pages/theme/index.tsx index f927f0ee2b..f6f24e89f1 100644 --- a/gui/src/pages/theme/index.tsx +++ b/gui/src/pages/theme/index.tsx @@ -31,28 +31,27 @@ const TAILWIND_CLASSES = [ "vsc-description-foreground", "vsc-input-placeholder-foreground", "error", - "error-foreground", ]; -const ThemeExample = ({ className }: ThemeExampleProps) => { - // const exists = window - // .getComputedStyle(document.documentElement) - // .getPropertyValue(`--${className}`) - // .trim(); +const ThemeVariableExample = ({ varName }: { varName: string }) => { return (
- {className} + {varName}
- {/*{exists ? ( - - ) : ( - - )} */} +
+ ); +}; + +const ThemeTailwindClassExample = ({ className }: { className: string }) => { + return ( +
+ {className} +
); }; @@ -70,7 +69,10 @@ export default function ThemePage() {

More pretty than this

{VSC_THEME_COLOR_VARS.map((c) => ( - + + ))} + {TAILWIND_CLASSES.map((c) => ( + ))}
From 24dc52af1ebea69345d2b8bcbc7a17364495293f Mon Sep 17 00:00:00 2001 From: Dallin Romney Date: Mon, 6 Jan 2025 17:50:25 +0100 Subject: [PATCH 6/8] color updates continued --- .../editor/InlineEditAction.kt | 4 +-- .../CodeToEditCard/AddFileCombobox.tsx | 2 +- gui/src/components/Footer.tsx | 2 +- gui/src/components/InfoHover.tsx | 2 +- .../components/OllamaCompletedStep.tsx | 2 +- gui/src/components/ProfileSwitcher.tsx | 2 +- .../StepContainer/AcceptRejectAllButtons.tsx | 2 +- .../components/StepContainer/EditActions.tsx | 6 ++-- .../StepContainer/FeedbackButtons.tsx | 4 +-- .../StepContainer/ResponseActions.tsx | 10 +++--- gui/src/components/gui/CopyIconButton.tsx | 4 +-- gui/src/components/gui/Spinner.tsx | 2 +- .../components/indexing/ChatIndexingPeeks.tsx | 2 +- .../indexing/DocsIndexingStatus.tsx | 2 +- .../loaders/FreeTrialProgressBar.tsx | 4 +-- .../components/mainInput/ContextItemsPeek.tsx | 6 ++-- gui/src/components/mainInput/InputToolbar.tsx | 4 +-- .../InputToolbar/ToggleToolsButton.tsx | 8 ++--- .../InputToolbar/ToolDropdownItem.tsx | 6 ++-- .../StepContainerPreActionButtons.tsx | 6 ++-- .../StepContainerPreToolbar/ApplyActions.tsx | 12 +++---- .../StepContainerPreToolbar/CopyButton.tsx | 4 +-- .../GeneratingCodeLoader.tsx | 2 +- .../RunInTerminalButton.tsx | 4 +-- .../StepContainerPreToolbar.tsx | 2 +- .../components/modelSelection/ModelSelect.tsx | 2 +- .../modelSelection/ModelSelectionListbox.tsx | 10 +++--- gui/src/forms/AddModelForm.tsx | 2 +- .../IndexingProgress/IndexingProgressBar.tsx | 2 +- gui/src/pages/config-error/index.tsx | 6 ++-- gui/src/pages/gui/ConfigError.tsx | 2 +- gui/src/pages/gui/StreamError.tsx | 2 +- gui/src/pages/gui/ToolCallDiv/index.tsx | 4 +-- gui/src/pages/theme/index.tsx | 23 +------------ gui/tailwind.config.cjs | 34 ++++++++----------- 35 files changed, 83 insertions(+), 108 deletions(-) diff --git a/extensions/intellij/src/main/kotlin/com/github/continuedev/continueintellijextension/editor/InlineEditAction.kt b/extensions/intellij/src/main/kotlin/com/github/continuedev/continueintellijextension/editor/InlineEditAction.kt index 714cd6417e..39b7ac2a86 100644 --- a/extensions/intellij/src/main/kotlin/com/github/continuedev/continueintellijextension/editor/InlineEditAction.kt +++ b/extensions/intellij/src/main/kotlin/com/github/continuedev/continueintellijextension/editor/InlineEditAction.kt @@ -479,7 +479,7 @@ class CustomPanel( JPanel(MigLayout("insets 0, fillx")).apply { val leftLabel = JLabel("Type to re-prompt").apply { - foreground = Color(156, 163, 175) // text-gray-400 + foreground = Color(156, 163, 175) // text-description font = UIUtil.getFontWithFallback("Arial", Font.PLAIN, 11) border = EmptyBorder(0, 4, 0, 0) } @@ -737,7 +737,7 @@ class TransparentArrowButtonUI : BasicComboBoxUI() { if (item != null) { val c = renderer.getListCellRendererComponent(listBox, item, -1, false, false) c.font = comboBox.font - c.foreground = Color(156, 163, 175) // text-gray-400 + c.foreground = Color(156, 163, 175) // text-description c.background = comboBox.background if (c is JComponent) { diff --git a/gui/src/components/CodeToEditCard/AddFileCombobox.tsx b/gui/src/components/CodeToEditCard/AddFileCombobox.tsx index 2817cd820a..97e3d60097 100644 --- a/gui/src/components/CodeToEditCard/AddFileCombobox.tsx +++ b/gui/src/components/CodeToEditCard/AddFileCombobox.tsx @@ -114,7 +114,7 @@ export default function AddFileCombobox({ )) ) : ( -
+
No results
)} diff --git a/gui/src/components/Footer.tsx b/gui/src/components/Footer.tsx index 9b5a6840c9..8a49fa0b4c 100644 --- a/gui/src/components/Footer.tsx +++ b/gui/src/components/Footer.tsx @@ -8,7 +8,7 @@ function Footer() { if (defaultModel?.provider === "free-trial") { return ( -