diff --git a/site/src/components/BorderedMenu/BorderedMenu.tsx b/site/src/components/BorderedMenu/BorderedMenu.tsx index 88eeef7867ade..2a65e47b487d2 100644 --- a/site/src/components/BorderedMenu/BorderedMenu.tsx +++ b/site/src/components/BorderedMenu/BorderedMenu.tsx @@ -31,8 +31,8 @@ const useStyles = makeStyles((theme) => ({ }, paperRoot: { width: "292px", - border: `2px solid ${theme.palette.primary.main}`, + border: `2px solid ${theme.palette.secondary.dark}`, borderRadius: 7, - boxShadow: `4px 4px 0px ${fade(theme.palette.primary.main, 0.2)}`, + boxShadow: `4px 4px 0px ${fade(theme.palette.secondary.dark, 0.2)}`, }, })) diff --git a/site/src/components/BorderedMenuRow/BorderedMenuRow.tsx b/site/src/components/BorderedMenuRow/BorderedMenuRow.tsx index 6147108299d9f..9aa449d623a57 100644 --- a/site/src/components/BorderedMenuRow/BorderedMenuRow.tsx +++ b/site/src/components/BorderedMenuRow/BorderedMenuRow.tsx @@ -78,12 +78,12 @@ const useStyles = makeStyles((theme) => ({ }, "&[data-status='active']": { - color: theme.palette.primary.main, + color: theme.palette.secondary.dark, "& .BorderedMenuRow-description": { color: theme.palette.text.primary, }, "& .BorderedMenuRow-icon": { - color: theme.palette.primary.main, + color: theme.palette.secondary.dark, }, }, }, diff --git a/site/src/components/BuildsTable/BuildsTable.tsx b/site/src/components/BuildsTable/BuildsTable.tsx index 1c20dec65c80e..8f108b653025b 100644 --- a/site/src/components/BuildsTable/BuildsTable.tsx +++ b/site/src/components/BuildsTable/BuildsTable.tsx @@ -106,7 +106,7 @@ const useStyles = makeStyles((theme) => ({ }, "&:focus": { - outline: `1px solid ${theme.palette.primary.dark}`, + outline: `1px solid ${theme.palette.secondary.dark}`, }, }, })) diff --git a/site/src/components/NavbarView/NavbarView.tsx b/site/src/components/NavbarView/NavbarView.tsx index 99d4382dadce0..176c48c7e80a1 100644 --- a/site/src/components/NavbarView/NavbarView.tsx +++ b/site/src/components/NavbarView/NavbarView.tsx @@ -116,7 +116,7 @@ const useStyles = makeStyles((theme) => ({ content: `" "`, bottom: 0, left: theme.spacing(3), - background: "#C16800", + background: theme.palette.secondary.dark, right: theme.spacing(3), height: 2, position: "absolute", diff --git a/site/src/components/TabSidebar/TabSidebar.tsx b/site/src/components/TabSidebar/TabSidebar.tsx index f3f5494fe9ba9..dbac00b54037e 100644 --- a/site/src/components/TabSidebar/TabSidebar.tsx +++ b/site/src/components/TabSidebar/TabSidebar.tsx @@ -68,7 +68,7 @@ const useStyles = makeStyles((theme) => ({ color: theme.palette.text.primary, }, "&.active": { - color: theme.palette.primary.dark, + color: theme.palette.secondary.dark, }, "&.active, &:hover": { diff --git a/site/src/components/UserDropdownContent/UserDropdownContent.tsx b/site/src/components/UserDropdownContent/UserDropdownContent.tsx index 4325631aecc19..29bedece93901 100644 --- a/site/src/components/UserDropdownContent/UserDropdownContent.tsx +++ b/site/src/components/UserDropdownContent/UserDropdownContent.tsx @@ -127,7 +127,7 @@ const useStyles = makeStyles((theme) => ({ margin: theme.spacing(0.5), }, chipRoot: { - backgroundColor: "#7057FF", + backgroundColor: theme.palette.secondary.dark, }, link: { textDecoration: "none", diff --git a/site/src/theme/palettes.ts b/site/src/theme/palettes.ts index ef6241cd4e88b..41433a6240e78 100644 --- a/site/src/theme/palettes.ts +++ b/site/src/theme/palettes.ts @@ -11,6 +11,7 @@ export const darkPalette: PaletteOptions = { secondary: { main: "#008510", contrastText: "#f8f8f8", + dark: "#7057FF", }, background: { default: "#1F1F1F",