diff --git a/core/http/react-ui/src/index.css b/core/http/react-ui/src/index.css index 5eb60b194..738606065 100644 --- a/core/http/react-ui/src/index.css +++ b/core/http/react-ui/src/index.css @@ -32,7 +32,7 @@ body { /* Global selection + focus */ ::selection { - background: var(--color-primary-light); + background: var(--color-selection-bg); color: var(--color-text-primary); } diff --git a/core/http/react-ui/src/theme.css b/core/http/react-ui/src/theme.css index 311ff9872..07976975d 100644 --- a/core/http/react-ui/src/theme.css +++ b/core/http/react-ui/src/theme.css @@ -28,6 +28,9 @@ --color-primary-light: rgba(79, 140, 255, 0.14); --color-primary-border: rgba(79, 140, 255, 0.34); + /* Text selection */ + --color-selection-bg: rgba(79, 140, 255, 0.38); + --color-secondary: #8aa6cc; --color-secondary-hover: #9db6d8; --color-secondary-light: rgba(138, 166, 204, 0.12); @@ -196,6 +199,9 @@ --color-primary-light: rgba(47, 98, 216, 0.12); --color-primary-border: rgba(47, 98, 216, 0.34); + /* Text selection */ + --color-selection-bg: rgba(47, 98, 216, 0.25); + --color-secondary: #4a5769; --color-secondary-hover: #3a4553; --color-secondary-light: rgba(74, 87, 105, 0.1); diff --git a/core/http/react-ui/src/utils/cmTheme.js b/core/http/react-ui/src/utils/cmTheme.js index 2802a5e04..736e4e0d5 100644 --- a/core/http/react-ui/src/utils/cmTheme.js +++ b/core/http/react-ui/src/utils/cmTheme.js @@ -18,7 +18,7 @@ const darkEditorTheme = EditorView.theme({ }, '.cm-cursor, .cm-dropCursor': { borderLeftColor: '#4f8cff', borderLeftWidth: '2px' }, '&.cm-focused .cm-selectionBackground, .cm-selectionBackground, .cm-content ::selection': { - backgroundColor: 'rgba(79, 140, 255, 0.25)', + backgroundColor: 'rgba(79, 140, 255, 0.38)', }, '.cm-gutters': { backgroundColor: '#131a23', @@ -79,7 +79,7 @@ const lightEditorTheme = EditorView.theme({ }, '.cm-cursor, .cm-dropCursor': { borderLeftColor: '#5e81ac', borderLeftWidth: '2px' }, '&.cm-focused .cm-selectionBackground, .cm-selectionBackground, .cm-content ::selection': { - backgroundColor: 'rgba(94, 129, 172, 0.18)', + backgroundColor: 'rgba(94, 129, 172, 0.28)', }, '.cm-gutters': { backgroundColor: '#e5e9f0',