diff --git a/packages/web/components/tokens/stitches.config.ts b/packages/web/components/tokens/stitches.config.ts index 461a244d8..c2597afae 100644 --- a/packages/web/components/tokens/stitches.config.ts +++ b/packages/web/components/tokens/stitches.config.ts @@ -1,14 +1,5 @@ import type * as Stitches from '@stitches/react' import { createStitches, createTheme } from '@stitches/react' -import { - gray, - grayDark, - blackA, - yellow, - yellowDark, - orange, - orangeDark, -} from '@radix-ui/colors' export enum ThemeId { Lighter = 'White', @@ -116,10 +107,6 @@ export const { styled, css, theme, getCssText, globalCss, keyframes, config } = zIndices: {}, transitions: {}, colors: { - // Radix Color Scales - ...yellow, // Brand - ...orange, //Accent - // Grayscale grayBase: '#F8F8F8', grayBg: '#FFFFFF', @@ -128,15 +115,13 @@ export const { styled, css, theme, getCssText, globalCss, keyframes, config } = grayTextContrast: '#3A3939', graySolid: '#9C9B9A', - grayBgSubtle: gray.gray2, - grayBgHover: gray.gray4, - grayLine: gray.gray6, - grayBorderHover: gray.gray8, - graySolidHover: gray.gray10, - grayText: gray.gray11, + grayBgSubtle: 'hsl(0 0% 97.3%)', + grayBgHover: 'hsl(0 0% 93.0%)', + grayLine: 'hsl(0 0% 88.7%)', + grayBorderHover: 'hsl(0 0% 78.0%)', + grayText: 'hsl(0 0% 43.5%)', // Semantic Colors - overlay: blackA.blackA9, highlightBackground: 'rgba(255, 210, 52, 0.65)', highlight: '#FFD234', highlightText: '#3D3D3D', @@ -177,9 +162,6 @@ export const { styled, css, theme, getCssText, globalCss, keyframes, config } = const darkThemeSpec = { colors: { - ...yellowDark, // Brand - ...orangeDark, //Accent - // Grayscale (top ones have been updated from new designs) grayBase: '#252525', grayBg: '#3B3938', @@ -188,15 +170,13 @@ const darkThemeSpec = { grayBorder: 'rgba(255, 255, 255, 0.06)', graySolid: '#9C9B9A', - grayBgSubtle: grayDark.gray2, - grayBgHover: grayDark.gray4, - grayLine: grayDark.gray6, - grayBorderHover: grayDark.gray8, - graySolidHover: grayDark.gray10, - grayText: grayDark.gray11, + grayBgSubtle: 'hsl(0 0% 9.8%)', + grayBgHover: 'hsl(0 0% 13.8%)', + grayLine: 'hsl(0 0% 19.9%)', + grayBorderHover: 'hsl(0 0% 31.2%)', + grayText: 'hsl(0 0% 62.8%)', // Semantic Colors - overlay: blackA.blackA9, highlightBackground: '#867740', highlight: '#FFD234', highlightText: 'white', diff --git a/packages/web/package.json b/packages/web/package.json index 8990886d0..e5e0c9d77 100644 --- a/packages/web/package.json +++ b/packages/web/package.json @@ -16,7 +16,6 @@ "upgrade-psdpdfkit": "cp -R '../../node_modules/pspdfkit/dist/pspdfkit-lib' public/pspdfkit-lib" }, "dependencies": { - "@radix-ui/colors": "^0.1.7", "@radix-ui/react-avatar": "^0.1.1", "@radix-ui/react-dialog": "^0.1.1", "@radix-ui/react-dropdown-menu": "^0.1.1", diff --git a/yarn.lock b/yarn.lock index b31afddbf..1fc76cd95 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4099,11 +4099,6 @@ resolved "https://registry.yarnpkg.com/@protobufjs/utf8/-/utf8-1.1.0.tgz#a777360b5b39a1a2e5106f8e858f2fd2d060c570" integrity sha1-p3c2C1s5oaLlEG+OhY8v0tBgxXA= -"@radix-ui/colors@^0.1.7": - version "0.1.7" - resolved "https://registry.yarnpkg.com/@radix-ui/colors/-/colors-0.1.7.tgz#055cdf104f92ae58a7d6a7f1c7327c635b90747f" - integrity sha512-E6+ZPQ+FFn1/NZ4c/KRvZTu9KjC/MXrbJNETYs1HKe96gyxQivPu65FkhOsRnPigvJ0YJ9ZxYGxayqDNmaC1cQ== - "@radix-ui/popper@0.1.0": version "0.1.0" resolved "https://registry.yarnpkg.com/@radix-ui/popper/-/popper-0.1.0.tgz#c387a38f31b7799e1ea0d2bb1ca0c91c2931b063" @@ -13548,7 +13543,7 @@ lambdafs@^2.0.3: resolved "https://registry.yarnpkg.com/lambdafs/-/lambdafs-2.1.1.tgz#4bf8d3037b6c61bbb4a22ab05c73ee47964c25ed" integrity sha512-x5k8JcoJWkWLvCVBzrl4pzvkEHSgSBqFjg3Dpsc4AcTMq7oUMym4cL/gRTZ6VM4mUMY+M0dIbQ+V1c1tsqqanQ== dependencies: - tar-fs "*" + tar-fs "^2.1.1" language-subtag-registry@~0.3.2: version "0.3.21"