Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit db71c0f

Browse files
aslilacaslilac
authored
refactor: remove theme "color palettes" (coder#11314)
1 parent 5cfa34b commit db71c0f

File tree

24 files changed

+574
-1225
lines changed

24 files changed

+574
-1225
lines changed

‎site/src/AppRouter.tsx

+7-1
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,8 @@ import WorkspacesPage from "./pages/WorkspacesPage/WorkspacesPage";
2121
import UserSettingsLayout from "./pages/UserSettingsPage/Layout";
2222
import { TemplateSettingsLayout } from "./pages/TemplateSettingsPage/TemplateSettingsLayout";
2323
import { WorkspaceSettingsLayout } from "./pages/WorkspaceSettingsPage/WorkspaceSettingsLayout";
24+
import { ThemeOverride } from "contexts/ThemeProvider";
25+
import themes from "theme";
2426

2527
// Lazy load pages
2628
// - Pages that are secondary, not in the main navigation or not usually accessed
@@ -412,7 +414,11 @@ export const AppRouter: FC = () => {
412414
/>
413415
<Route
414416
path="/:username/:workspace/terminal"
415-
element={<TerminalPage />}
417+
element={
418+
<ThemeOverride theme={themes.dark}>
419+
<TerminalPage />
420+
</ThemeOverride>
421+
}
416422
/>
417423
<Route path="/cli-auth" element={<CliAuthenticationPage />} />
418424
<Route path="/icons" element={<IconsPage />} />

‎site/src/components/Dashboard/DeploymentBanner/DeploymentBannerView.tsx

+4-3
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,7 @@ import { TerminalIcon } from "components/Icons/TerminalIcon";
3636
import { RocketIcon } from "components/Icons/RocketIcon";
3737
import ErrorIcon from "@mui/icons-material/ErrorOutline";
3838
import { MONOSPACE_FONT_FAMILY } from "theme/constants";
39+
import colors from "theme/tailwindColors";
3940
import { getDisplayWorkspaceStatus } from "utils/workspace";
4041
import { HelpTooltipTitle } from "components/HelpTooltip/HelpTooltip";
4142
import { Stack } from "components/Stack/Stack";
@@ -439,9 +440,9 @@ const styles = {
439440
height: 16px;
440441
}
441442
`,
442-
unhealthy: (theme) => css`
443-
background-color: ${theme.colors.red[10]};
444-
`,
443+
unhealthy: {
444+
backgroundColor: colors.red[700],
445+
},
445446
group: css`
446447
display: flex;
447448
align-items: center;

‎site/src/components/IconField/IconField.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -102,8 +102,8 @@ const IconField: FC<IconFieldProps> = ({ onPickEmoji, ...textFieldProps }) => {
102102
styles={css`
103103
em-emoji-picker {
104104
--rgb-background: ${theme.palette.background.paper};
105-
--rgb-input: ${theme.colors.gray[17]};
106-
--rgb-color: ${theme.colors.gray[4]};
105+
--rgb-input: ${theme.palette.primary.main};
106+
--rgb-color: ${theme.palette.text.primary};
107107
108108
// Hack to prevent the right side from being cut off
109109
width: 350px;

‎site/src/components/Markdown/Markdown.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import { type FC, memo } from "react";
1111
import ReactMarkdown, { type Options } from "react-markdown";
1212
import { Prism as SyntaxHighlighter } from "react-syntax-highlighter";
1313
import gfm from "remark-gfm";
14-
import colors from "theme/tailwind";
14+
import colors from "theme/tailwindColors";
1515
import { dracula } from "react-syntax-highlighter/dist/cjs/styles/prism";
1616

1717
interface MarkdownProps {

‎site/src/pages/AuditPage/AuditLogRow/AuditLogDiff/AuditLogDiff.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { type Interpolation, type Theme } from "@emotion/react";
22
import { type FC } from "react";
33
import type { AuditLog } from "api/typesGenerated";
4-
import colors from "theme/tailwind";
4+
import colors from "theme/tailwindColors";
55
import { MONOSPACE_FONT_FAMILY } from "theme/constants";
66

77
const getDiffValue = (value: unknown): string => {

‎site/src/pages/DeploySettingsPage/AppearanceSettingsPage/AppearanceSettingsPageView.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ import {
1919
import { Fieldset } from "components/DeploySettingsLayout/Fieldset";
2020
import { Stack } from "components/Stack/Stack";
2121
import { getFormHelpers } from "utils/formUtils";
22-
import colors from "theme/tailwind";
22+
import colors from "theme/tailwindColors";
2323

2424
export type AppearanceSettingsPageViewProps = {
2525
appearance: UpdateAppearanceConfig;

‎site/src/pages/TemplatePage/TemplateInsightsPage/TemplateInsightsPage.tsx

+4-1
Original file line numberDiff line numberDiff line change
@@ -420,7 +420,10 @@ const TemplateUsagePanel: FC<TemplateUsagePanelProps> = ({
420420
const totalInSeconds =
421421
validUsage?.reduce((total, usage) => total + usage.seconds, 0) ?? 1;
422422
const usageColors = chroma
423-
.scale([theme.colors.green[8], theme.colors.blue[8]])
423+
.scale([
424+
theme.experimental.roles.success.fill,
425+
theme.experimental.roles.notice.fill,
426+
])
424427
.mode("lch")
425428
.colors(validUsage?.length ?? 0);
426429
// The API returns a row for each app, even if the user didn't use it.

‎site/src/pages/TerminalPage/TerminalPage.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -108,7 +108,7 @@ const TerminalPage: FC = () => {
108108
fontFamily: MONOSPACE_FONT_FAMILY,
109109
fontSize: 16,
110110
theme: {
111-
background: theme.colors.gray[16],
111+
background: theme.palette.background.default,
112112
},
113113
});
114114
if (renderer === "webgl") {

‎site/src/pages/WorkspacesPage/LastUsed.tsx

+3-4
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@ export const LastUsed: FC<LastUsedProps> = ({ lastUsedAt }) => {
4040
);
4141

4242
if (t.isAfter(now.subtract(1, "hour"))) {
43-
circle = <Circle color={theme.colors.green[9]} />;
43+
circle = <Circle color={theme.experimental.roles.success.fill} />;
4444
// Since the agent reports on a 10m interval,
4545
// the last_used_at can be inaccurate when recent.
4646
message = "Now";
@@ -49,15 +49,14 @@ export const LastUsed: FC<LastUsedProps> = ({ lastUsedAt }) => {
4949
} else if (t.isAfter(now.subtract(1, "month"))) {
5050
circle = <Circle color={theme.palette.warning.light} />;
5151
} else if (t.isAfter(now.subtract(100, "year"))) {
52-
circle = <Circle color={theme.colors.red[10]} />;
52+
circle = <Circle color={theme.experimental.roles.error.fill} />;
5353
} else {
54-
// color = theme.palette.error.light
5554
message = "Never";
5655
}
5756

5857
return (
5958
<Stack
60-
css={{ color: theme.palette.text.secondary }}
59+
style={{ color: theme.palette.text.secondary }}
6160
direction="row"
6261
spacing={1}
6362
alignItems="center"

‎site/src/theme/colors.ts

-60
This file was deleted.

‎site/src/theme/dark/colors.ts

-62
This file was deleted.

‎site/src/theme/dark/experimental.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { type NewTheme } from "../experimental";
2-
import colors from "../tailwind";
2+
import colors from "../tailwindColors";
33

44
export default {
55
l1: {

‎site/src/theme/dark/index.ts

-2
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,9 @@
1-
import colors from "./colors";
21
import experimental from "./experimental";
32
import monaco from "./monaco";
43
import muiTheme from "./mui";
54

65
export default {
76
...muiTheme,
8-
colors,
97
experimental,
108
monaco,
119
};

0 commit comments

Comments
 (0)