From f63444ce6dafdd6c2acf2c0a2dd30071ea88fffd Mon Sep 17 00:00:00 2001 From: Nate Butler Date: Sat, 30 Apr 2022 00:47:07 -0400 Subject: [PATCH] Update base16 theme occurrence style - Update base16 theme occurrence style to be visible - Update match styles to use the blend scaling value - This makes it so matches are less loud in light themes --- assets/themes/cave-dark.json | 46 ++++++++++++++-------------- assets/themes/cave-light.json | 6 ++-- assets/themes/solarized-dark.json | 46 ++++++++++++++-------------- assets/themes/solarized-light.json | 6 ++-- assets/themes/sulphurpool-dark.json | 46 ++++++++++++++-------------- assets/themes/sulphurpool-light.json | 6 ++-- styles/src/themes/base16.ts | 10 +++--- 7 files changed, 83 insertions(+), 83 deletions(-) diff --git a/assets/themes/cave-dark.json b/assets/themes/cave-dark.json index f416b92ccf455bd19c5612ddaae607f1ddfd1e1a..3fe3e111dd57049a80ce9ed6ace09aa6a2bf1428 100644 --- a/assets/themes/cave-dark.json +++ b/assets/themes/cave-dark.json @@ -23,7 +23,7 @@ "size": 14 }, "active": { - "background": "#5852607a", + "background": "#5852605c", "text": { "family": "Zed Sans", "color": "#e2dfe7", @@ -31,7 +31,7 @@ } }, "hover": { - "background": "#58526052" + "background": "#5852603d" } }, "border": { @@ -81,7 +81,7 @@ }, "shadow": { "blur": 16, - "color": "#00000052", + "color": "#0000003d", "offset": [ 0, 2 @@ -215,7 +215,7 @@ "size": 14 }, "icon_color": "#e2dfe7", - "background": "#58526052" + "background": "#5852603d" } }, "diagnostic_message": { @@ -288,7 +288,7 @@ "left": 7, "right": 7 }, - "background": "#58526052" + "background": "#5852603d" }, "container_warning": { "corner_radius": 6, @@ -335,11 +335,11 @@ "icon_color": "#8b8792", "hover": { "icon_color": "#e2dfe7", - "background": "#58526052" + "background": "#5852603d" }, "active": { "icon_color": "#efecf4", - "background": "#5852607a" + "background": "#5852605c" } } } @@ -411,15 +411,15 @@ }, "color": "#8b8792", "hover": { - "background": "#58526052", + "background": "#5852603d", "color": "#8b8792" }, "active": { - "background": "#5852607a", + "background": "#5852605c", "color": "#efecf4" }, "active_hover": { - "background": "#58526052", + "background": "#5852603d", "color": "#efecf4" } }, @@ -480,8 +480,8 @@ "code_actions_indicator": "#8b8792", "diff_background_deleted": "#be467826", "diff_background_inserted": "#2a929226", - "document_highlight_read_background": "#19171c1f", - "document_highlight_write_background": "#19171c29", + "document_highlight_read_background": "#efecf41f", + "document_highlight_write_background": "#efecf43d", "error_color": "#be4678", "gutter_background": "#19171c", "gutter_padding_factor": 3.5, @@ -549,7 +549,7 @@ "right": 6, "top": 2 }, - "background": "#26232a52" + "background": "#26232a3d" }, "margin": { "left": -14 @@ -567,7 +567,7 @@ "right": 6, "top": 2 }, - "background": "#26232a7a" + "background": "#26232a5c" } }, "diagnostic_header": { @@ -951,7 +951,7 @@ }, "hovered_entry": { "height": 24, - "background": "#58526052", + "background": "#5852603d", "icon_color": "#8b8792", "icon_size": 8, "icon_spacing": 8, @@ -974,7 +974,7 @@ }, "hovered_selected_entry": { "height": 24, - "background": "#58526052", + "background": "#5852603d", "icon_color": "#8b8792", "icon_size": 8, "icon_spacing": 8, @@ -1059,7 +1059,7 @@ "right": 8 } }, - "background": "#58526052", + "background": "#5852603d", "corner_radius": 6 }, "active_item": { @@ -1094,7 +1094,7 @@ "right": 8 } }, - "background": "#58526052", + "background": "#5852603d", "corner_radius": 6 }, "menu": { @@ -1107,7 +1107,7 @@ }, "shadow": { "blur": 16, - "color": "#00000052", + "color": "#0000003d", "offset": [ 0, 2 @@ -1284,7 +1284,7 @@ "padding": { "left": 8 }, - "background": "#58526052", + "background": "#5852603d", "corner_radius": 6 }, "unshared_project": { @@ -1328,7 +1328,7 @@ } }, "search": { - "match_background": "#955ae780", + "match_background": "#955ae77a", "tab_icon_spacing": 8, "tab_icon_width": 14, "option_button": { @@ -1354,7 +1354,7 @@ "family": "Zed Mono", "color": "#efecf4", "size": 14, - "background": "#585260a3", + "background": "#5852607a", "border": { "color": "#655f6d", "width": 1 @@ -1364,7 +1364,7 @@ "family": "Zed Mono", "color": "#efecf4", "size": 14, - "background": "#58526052", + "background": "#5852603d", "border": { "color": "#655f6d", "width": 1 diff --git a/assets/themes/cave-light.json b/assets/themes/cave-light.json index 2b86f09d1f270d0c3996081913b25db575f7197f..5c3d302052bd92c686293dd0a33033642a935328 100644 --- a/assets/themes/cave-light.json +++ b/assets/themes/cave-light.json @@ -480,8 +480,8 @@ "code_actions_indicator": "#585260", "diff_background_deleted": "#be467826", "diff_background_inserted": "#2a929226", - "document_highlight_read_background": "#efecf41f", - "document_highlight_write_background": "#efecf429", + "document_highlight_read_background": "#19171c0f", + "document_highlight_write_background": "#19171c1f", "error_color": "#be4678", "gutter_background": "#efecf4", "gutter_padding_factor": 3.5, @@ -1328,7 +1328,7 @@ } }, "search": { - "match_background": "#955ae780", + "match_background": "#955ae73d", "tab_icon_spacing": 8, "tab_icon_width": 14, "option_button": { diff --git a/assets/themes/solarized-dark.json b/assets/themes/solarized-dark.json index b6257be3b8effea6ba1fb1932514430fb3fd2a47..4c27d9e3f9cb8f86a0ed604321ac09301e523480 100644 --- a/assets/themes/solarized-dark.json +++ b/assets/themes/solarized-dark.json @@ -23,7 +23,7 @@ "size": 14 }, "active": { - "background": "#586e757a", + "background": "#586e755c", "text": { "family": "Zed Sans", "color": "#eee8d5", @@ -31,7 +31,7 @@ } }, "hover": { - "background": "#586e7552" + "background": "#586e753d" } }, "border": { @@ -81,7 +81,7 @@ }, "shadow": { "blur": 16, - "color": "#00000052", + "color": "#0000003d", "offset": [ 0, 2 @@ -215,7 +215,7 @@ "size": 14 }, "icon_color": "#eee8d5", - "background": "#586e7552" + "background": "#586e753d" } }, "diagnostic_message": { @@ -288,7 +288,7 @@ "left": 7, "right": 7 }, - "background": "#586e7552" + "background": "#586e753d" }, "container_warning": { "corner_radius": 6, @@ -335,11 +335,11 @@ "icon_color": "#93a1a1", "hover": { "icon_color": "#eee8d5", - "background": "#586e7552" + "background": "#586e753d" }, "active": { "icon_color": "#fdf6e3", - "background": "#586e757a" + "background": "#586e755c" } } } @@ -411,15 +411,15 @@ }, "color": "#93a1a1", "hover": { - "background": "#586e7552", + "background": "#586e753d", "color": "#93a1a1" }, "active": { - "background": "#586e757a", + "background": "#586e755c", "color": "#fdf6e3" }, "active_hover": { - "background": "#586e7552", + "background": "#586e753d", "color": "#fdf6e3" } }, @@ -480,8 +480,8 @@ "code_actions_indicator": "#93a1a1", "diff_background_deleted": "#dc322f26", "diff_background_inserted": "#85990026", - "document_highlight_read_background": "#002b361f", - "document_highlight_write_background": "#002b3629", + "document_highlight_read_background": "#fdf6e31f", + "document_highlight_write_background": "#fdf6e33d", "error_color": "#dc322f", "gutter_background": "#002b36", "gutter_padding_factor": 3.5, @@ -549,7 +549,7 @@ "right": 6, "top": 2 }, - "background": "#07364252" + "background": "#0736423d" }, "margin": { "left": -14 @@ -567,7 +567,7 @@ "right": 6, "top": 2 }, - "background": "#0736427a" + "background": "#0736425c" } }, "diagnostic_header": { @@ -951,7 +951,7 @@ }, "hovered_entry": { "height": 24, - "background": "#586e7552", + "background": "#586e753d", "icon_color": "#93a1a1", "icon_size": 8, "icon_spacing": 8, @@ -974,7 +974,7 @@ }, "hovered_selected_entry": { "height": 24, - "background": "#586e7552", + "background": "#586e753d", "icon_color": "#93a1a1", "icon_size": 8, "icon_spacing": 8, @@ -1059,7 +1059,7 @@ "right": 8 } }, - "background": "#586e7552", + "background": "#586e753d", "corner_radius": 6 }, "active_item": { @@ -1094,7 +1094,7 @@ "right": 8 } }, - "background": "#586e7552", + "background": "#586e753d", "corner_radius": 6 }, "menu": { @@ -1107,7 +1107,7 @@ }, "shadow": { "blur": 16, - "color": "#00000052", + "color": "#0000003d", "offset": [ 0, 2 @@ -1284,7 +1284,7 @@ "padding": { "left": 8 }, - "background": "#586e7552", + "background": "#586e753d", "corner_radius": 6 }, "unshared_project": { @@ -1328,7 +1328,7 @@ } }, "search": { - "match_background": "#6c71c480", + "match_background": "#6c71c47a", "tab_icon_spacing": 8, "tab_icon_width": 14, "option_button": { @@ -1354,7 +1354,7 @@ "family": "Zed Mono", "color": "#fdf6e3", "size": 14, - "background": "#586e75a3", + "background": "#586e757a", "border": { "color": "#657b83", "width": 1 @@ -1364,7 +1364,7 @@ "family": "Zed Mono", "color": "#fdf6e3", "size": 14, - "background": "#586e7552", + "background": "#586e753d", "border": { "color": "#657b83", "width": 1 diff --git a/assets/themes/solarized-light.json b/assets/themes/solarized-light.json index 701187459b5622a582ce4327dfbf47d337ec9346..1f0dd0fa0ddc71331317abbcad5d345deb55c810 100644 --- a/assets/themes/solarized-light.json +++ b/assets/themes/solarized-light.json @@ -480,8 +480,8 @@ "code_actions_indicator": "#586e75", "diff_background_deleted": "#dc322f26", "diff_background_inserted": "#85990026", - "document_highlight_read_background": "#fdf6e31f", - "document_highlight_write_background": "#fdf6e329", + "document_highlight_read_background": "#002b360f", + "document_highlight_write_background": "#002b361f", "error_color": "#dc322f", "gutter_background": "#fdf6e3", "gutter_padding_factor": 3.5, @@ -1328,7 +1328,7 @@ } }, "search": { - "match_background": "#6c71c480", + "match_background": "#6c71c43d", "tab_icon_spacing": 8, "tab_icon_width": 14, "option_button": { diff --git a/assets/themes/sulphurpool-dark.json b/assets/themes/sulphurpool-dark.json index 3e5ae726e09461bfffaa4a1dfd45dc3f2746b8cb..df2e44f2931b23acbd46ffd11140e3073db6fdb4 100644 --- a/assets/themes/sulphurpool-dark.json +++ b/assets/themes/sulphurpool-dark.json @@ -23,7 +23,7 @@ "size": 14 }, "active": { - "background": "#5e66877a", + "background": "#5e66875c", "text": { "family": "Zed Sans", "color": "#dfe2f1", @@ -31,7 +31,7 @@ } }, "hover": { - "background": "#5e668752" + "background": "#5e66873d" } }, "border": { @@ -81,7 +81,7 @@ }, "shadow": { "blur": 16, - "color": "#00000052", + "color": "#0000003d", "offset": [ 0, 2 @@ -215,7 +215,7 @@ "size": 14 }, "icon_color": "#dfe2f1", - "background": "#5e668752" + "background": "#5e66873d" } }, "diagnostic_message": { @@ -288,7 +288,7 @@ "left": 7, "right": 7 }, - "background": "#5e668752" + "background": "#5e66873d" }, "container_warning": { "corner_radius": 6, @@ -335,11 +335,11 @@ "icon_color": "#979db4", "hover": { "icon_color": "#dfe2f1", - "background": "#5e668752" + "background": "#5e66873d" }, "active": { "icon_color": "#f5f7ff", - "background": "#5e66877a" + "background": "#5e66875c" } } } @@ -411,15 +411,15 @@ }, "color": "#979db4", "hover": { - "background": "#5e668752", + "background": "#5e66873d", "color": "#979db4" }, "active": { - "background": "#5e66877a", + "background": "#5e66875c", "color": "#f5f7ff" }, "active_hover": { - "background": "#5e668752", + "background": "#5e66873d", "color": "#f5f7ff" } }, @@ -480,8 +480,8 @@ "code_actions_indicator": "#979db4", "diff_background_deleted": "#c9492226", "diff_background_inserted": "#ac973926", - "document_highlight_read_background": "#2027461f", - "document_highlight_write_background": "#20274629", + "document_highlight_read_background": "#f5f7ff1f", + "document_highlight_write_background": "#f5f7ff3d", "error_color": "#c94922", "gutter_background": "#202746", "gutter_padding_factor": 3.5, @@ -549,7 +549,7 @@ "right": 6, "top": 2 }, - "background": "#29325652" + "background": "#2932563d" }, "margin": { "left": -14 @@ -567,7 +567,7 @@ "right": 6, "top": 2 }, - "background": "#2932567a" + "background": "#2932565c" } }, "diagnostic_header": { @@ -951,7 +951,7 @@ }, "hovered_entry": { "height": 24, - "background": "#5e668752", + "background": "#5e66873d", "icon_color": "#979db4", "icon_size": 8, "icon_spacing": 8, @@ -974,7 +974,7 @@ }, "hovered_selected_entry": { "height": 24, - "background": "#5e668752", + "background": "#5e66873d", "icon_color": "#979db4", "icon_size": 8, "icon_spacing": 8, @@ -1059,7 +1059,7 @@ "right": 8 } }, - "background": "#5e668752", + "background": "#5e66873d", "corner_radius": 6 }, "active_item": { @@ -1094,7 +1094,7 @@ "right": 8 } }, - "background": "#5e668752", + "background": "#5e66873d", "corner_radius": 6 }, "menu": { @@ -1107,7 +1107,7 @@ }, "shadow": { "blur": 16, - "color": "#00000052", + "color": "#0000003d", "offset": [ 0, 2 @@ -1284,7 +1284,7 @@ "padding": { "left": 8 }, - "background": "#5e668752", + "background": "#5e66873d", "corner_radius": 6 }, "unshared_project": { @@ -1328,7 +1328,7 @@ } }, "search": { - "match_background": "#6679cc80", + "match_background": "#6679cc7a", "tab_icon_spacing": 8, "tab_icon_width": 14, "option_button": { @@ -1354,7 +1354,7 @@ "family": "Zed Mono", "color": "#f5f7ff", "size": 14, - "background": "#5e6687a3", + "background": "#5e66877a", "border": { "color": "#6b7394", "width": 1 @@ -1364,7 +1364,7 @@ "family": "Zed Mono", "color": "#f5f7ff", "size": 14, - "background": "#5e668752", + "background": "#5e66873d", "border": { "color": "#6b7394", "width": 1 diff --git a/assets/themes/sulphurpool-light.json b/assets/themes/sulphurpool-light.json index a2084e2c2f8813404aefc16b55fdc9f66304b801..f516fa0309a154d5174e009b7433df3efd3c014f 100644 --- a/assets/themes/sulphurpool-light.json +++ b/assets/themes/sulphurpool-light.json @@ -480,8 +480,8 @@ "code_actions_indicator": "#5e6687", "diff_background_deleted": "#c9492226", "diff_background_inserted": "#ac973926", - "document_highlight_read_background": "#f5f7ff1f", - "document_highlight_write_background": "#f5f7ff29", + "document_highlight_read_background": "#2027460f", + "document_highlight_write_background": "#2027461f", "error_color": "#c94922", "gutter_background": "#f5f7ff", "gutter_padding_factor": 3.5, @@ -1328,7 +1328,7 @@ } }, "search": { - "match_background": "#6679cc80", + "match_background": "#6679cc3d", "tab_icon_spacing": 8, "tab_icon_width": 14, "option_button": { diff --git a/styles/src/themes/base16.ts b/styles/src/themes/base16.ts index 07ffc59136e2652780ffb64d44768aa8ac1423d2..eb67f5f8f215899a3d0dc128c52f45b7f44c1b7f 100644 --- a/styles/src/themes/base16.ts +++ b/styles/src/themes/base16.ts @@ -17,7 +17,7 @@ export function createTheme(name: string, isLight: boolean, neutral: ColorToken[ if (isLight) { neutral = [...neutral].reverse(); } - let blend = isLight ? 0.12 : 0.32; + let blend = isLight ? 0.12 : 0.24; const backgroundColor = { 100: { @@ -125,11 +125,11 @@ export function createTheme(name: string, isLight: boolean, neutral: ColorToken[ }, highlight: { selection: player[1].selectionColor, - occurrence: withOpacity(neutral[0], 0.12), - activeOccurrence: withOpacity(neutral[0], 0.16), + occurrence: withOpacity(neutral[7], blend / 2), + activeOccurrence: withOpacity(neutral[7], blend), matchingBracket: backgroundColor[500].active, - match: withOpacity(accent.violet, 0.5), - activeMatch: withOpacity(accent.violet, 0.7), + match: withOpacity(accent.violet, blend * 2), + activeMatch: withOpacity(accent.violet, blend * 3), related: backgroundColor[500].focused, }, gutter: {