diff --git a/packages/gamut-styles/src/themes/__tests__/__snapshots__/theme.test.ts.snap b/packages/gamut-styles/src/themes/__tests__/__snapshots__/theme.test.ts.snap index 1cb9bd3406d..a934e311be9 100644 --- a/packages/gamut-styles/src/themes/__tests__/__snapshots__/theme.test.ts.snap +++ b/packages/gamut-styles/src/themes/__tests__/__snapshots__/theme.test.ts.snap @@ -1110,8 +1110,8 @@ exports[`themes platform - theme shape 1`] = ` "red-500": "#E91C11", "red-600": "#BE1809", "red-900": "#280503", - "teal": "#027E97", - "teal-500": "#027E97", + "teal": "#006d82", + "teal-500": "#006d82", "white": "#ffffff", "white-100": "rgba(255,255,255,0.04)", "white-200": "rgba(255,255,255,0.09)", @@ -1155,7 +1155,7 @@ exports[`themes platform - theme shape 1`] = ` "editor-atom": "#F966FF", "editor-attribute": "#AEE938", "editor-basic": "#ffffff", - "editor-comment": "#9E9E9E", + "editor-comment": "rgba(255,255,255,0.5)", "editor-constant": "#FF8C00", "editor-decoration": "#E85D7F", "editor-invalid": "#E85D7F", @@ -1170,9 +1170,9 @@ exports[`themes platform - theme shape 1`] = ` "editor-tag": "#E85D7F", "editor-text": "#FF8C00", "editor-ui-background": "#0A0D1C", - "editor-ui-indent-active": "#424242", - "editor-ui-indent-inactive": "#616161", - "editor-ui-line-number": "#9E9E9E", + "editor-ui-indent-active": "rgba(255,255,255,0.2)", + "editor-ui-indent-inactive": "rgba(255,255,255,0.35)", + "editor-ui-line-number": "rgba(255,255,255,0.5)", "editor-ui-text": "#ffffff", "editor-value": "#FFD300", "editor-variable": "#AEE938", @@ -1200,7 +1200,7 @@ exports[`themes platform - theme shape 1`] = ` "background-disabled": "rgba(16,22,47,0.12)", "background-error": "#FBF1F0", "background-hover": "rgba(16,22,47,0.12)", - "background-primary": "#FFF0E5", + "background-primary": "#F5FCFF", "background-selected": "rgba(16,22,47,0.04)", "background-success": "#F5FFE3", "background-warning": "#FFFAE5", @@ -1214,11 +1214,11 @@ exports[`themes platform - theme shape 1`] = ` "editor-atom": "#CA00D1", "editor-attribute": "#008A27", "editor-basic": "#10162F", - "editor-comment": "rgba(16,22,47,0.28)", + "editor-comment": "rgba(16,22,47,0.63)", "editor-constant": "#D14900", "editor-decoration": "#E91C11", "editor-invalid": "#E91C11", - "editor-key": "#027E97", + "editor-key": "#006d82", "editor-keyword": "#1557FF", "editor-number": "#E91C11", "editor-operator": "#E91C11", @@ -1229,9 +1229,9 @@ exports[`themes platform - theme shape 1`] = ` "editor-tag": "#E91C11", "editor-text": "#D14900", "editor-ui-background": "#ffffff", - "editor-ui-indent-active": "#0A0D1C", - "editor-ui-indent-inactive": "rgba(16,22,47,0.75)", - "editor-ui-line-number": "rgba(16,22,47,0.28)", + "editor-ui-indent-active": "rgba(16,22,47,0.28)", + "editor-ui-indent-inactive": "rgba(16,22,47,0.47)", + "editor-ui-line-number": "rgba(16,22,47,0.63)", "editor-ui-text": "#10162F", "editor-value": "#8A7300", "editor-variable": "#008A27", @@ -1276,7 +1276,7 @@ exports[`themes platform - theme shape 1`] = ` "--color-editor-atom": "var(--color-pink-400)", "--color-editor-attribute": "var(--color-green-400)", "--color-editor-basic": "var(--color-white)", - "--color-editor-comment": "var(--color-gray-600)", + "--color-editor-comment": "var(--color-white-500)", "--color-editor-constant": "var(--color-orange-500)", "--color-editor-decoration": "var(--color-red-300)", "--color-editor-invalid": "var(--color-red-300)", @@ -1291,9 +1291,9 @@ exports[`themes platform - theme shape 1`] = ` "--color-editor-tag": "var(--color-red-300)", "--color-editor-text": "var(--color-orange-500)", "--color-editor-ui-background": "var(--color-navy-900)", - "--color-editor-ui-indent-active": "var(--color-gray-900)", - "--color-editor-ui-indent-inactive": "var(--color-gray-800)", - "--color-editor-ui-line-number": "var(--color-gray-600)", + "--color-editor-ui-indent-active": "var(--color-white-300)", + "--color-editor-ui-indent-inactive": "var(--color-white-400)", + "--color-editor-ui-line-number": "var(--color-white-500)", "--color-editor-ui-text": "var(--color-white)", "--color-editor-value": "var(--color-yellow-500)", "--color-editor-variable": "var(--color-green-400)", @@ -1378,8 +1378,8 @@ exports[`themes platform - theme shape 1`] = ` "--color-red-500": "#E91C11", "--color-red-600": "#BE1809", "--color-red-900": "#280503", - "--color-teal": "#027E97", - "--color-teal-500": "#027E97", + "--color-teal": "#006d82", + "--color-teal-500": "#006d82", "--color-white": "#ffffff", "--color-white-100": "rgba(255,255,255,0.04)", "--color-white-200": "rgba(255,255,255,0.09)", @@ -1629,7 +1629,7 @@ monospace", "editor-atom": "pink-400", "editor-attribute": "green-400", "editor-basic": "white", - "editor-comment": "gray-600", + "editor-comment": "white-500", "editor-constant": "orange-500", "editor-decoration": "red-300", "editor-invalid": "red-300", @@ -1644,9 +1644,9 @@ monospace", "editor-tag": "red-300", "editor-text": "orange-500", "editor-ui-background": "navy-900", - "editor-ui-indent-active": "gray-900", - "editor-ui-indent-inactive": "gray-800", - "editor-ui-line-number": "gray-600", + "editor-ui-indent-active": "white-300", + "editor-ui-indent-inactive": "white-400", + "editor-ui-line-number": "white-500", "editor-ui-text": "white", "editor-value": "yellow-500", "editor-variable": "green-400", @@ -1674,7 +1674,7 @@ monospace", "background-disabled": "navy-200", "background-error": "red-0", "background-hover": "navy-200", - "background-primary": "beige", + "background-primary": "blue-0", "background-selected": "navy-100", "background-success": "green-0", "background-warning": "yellow-0", @@ -1688,7 +1688,7 @@ monospace", "editor-atom": "pink-800", "editor-attribute": "green-700", "editor-basic": "navy-800", - "editor-comment": "navy-300", + "editor-comment": "navy-500", "editor-constant": "orange-800", "editor-decoration": "red-500", "editor-invalid": "red-500", @@ -1703,9 +1703,9 @@ monospace", "editor-tag": "red-500", "editor-text": "orange-800", "editor-ui-background": "white", - "editor-ui-indent-active": "navy-900", - "editor-ui-indent-inactive": "navy-600", - "editor-ui-line-number": "navy-300", + "editor-ui-indent-active": "navy-300", + "editor-ui-indent-inactive": "navy-400", + "editor-ui-line-number": "navy-500", "editor-ui-text": "navy-800", "editor-value": "gold-800", "editor-variable": "green-700", diff --git a/packages/gamut-styles/src/themes/platform.ts b/packages/gamut-styles/src/themes/platform.ts index a9e6a0d81c2..846f7599320 100644 --- a/packages/gamut-styles/src/themes/platform.ts +++ b/packages/gamut-styles/src/themes/platform.ts @@ -14,12 +14,15 @@ export const platformTheme = createTheme(coreTheme) .addColors(platformPalette) .addColorModes('dark', { light: { + background: { + primary: 'blue-0', + }, editor: { attribute: 'green-700', annotation: 'red-500', atom: 'pink-800', basic: 'navy-800', - comment: 'navy-300', + comment: 'navy-500', constant: 'orange-800', decoration: 'red-500', invalid: 'red-500', @@ -38,9 +41,9 @@ export const platformTheme = createTheme(coreTheme) ui: { background: 'white', text: 'navy-800', - 'indent-active': 'navy-900', - 'indent-inactive': 'navy-600', - 'line-number': 'navy-300', + 'indent-active': 'navy-300', + 'indent-inactive': 'navy-400', + 'line-number': 'navy-500', }, }, }, @@ -50,7 +53,7 @@ export const platformTheme = createTheme(coreTheme) annotation: 'red-300', atom: 'pink-400', basic: 'white', - comment: 'gray-600', + comment: 'white-500', constant: 'orange-500', decoration: 'red-300', invalid: 'red-300', @@ -69,9 +72,9 @@ export const platformTheme = createTheme(coreTheme) ui: { background: 'navy-900', text: 'white', - 'indent-active': 'gray-900', - 'indent-inactive': 'gray-800', - 'line-number': 'gray-600', + 'indent-active': 'white-300', + 'indent-inactive': 'white-400', + 'line-number': 'white-500', }, }, }, diff --git a/packages/gamut-styles/src/variables/colors.ts b/packages/gamut-styles/src/variables/colors.ts index 5c03ec32c08..1a853673376 100644 --- a/packages/gamut-styles/src/variables/colors.ts +++ b/packages/gamut-styles/src/variables/colors.ts @@ -127,7 +127,7 @@ export const platformSwatches = { '800': '#CA00D1', }, teal: { - '500': '#027E97', + '500': '#006d82', }, purple: { '300': '#B3CCFF',