[Console][Monaco] No contrast between selected text and current line colors

[sakurai-youhei]

Kibana version: 74a202a

Elasticsearch version: 8.15.0-SNAPSHOT

Server OS version: Linux wsl 5.15.146.1-microsoft-standard-WSL2 #1 SMP Thu Jan 11 04:09:03 UTC 2024 x86_64 x86_64 x86_64 GNU/Linux

Browser version: Chrome Version 126.0.6478.63 (Official Build) (64-bit)

Browser OS version: Windows 11 10.0.22621 N/A Build 22621

Original install method (e.g. download page, yum, from source, etc.): Build from source

Describe the bug: It's pretty hard (or impossible) to distinguish selected text in the current line due to no contrast in the text & background colors.

Steps to reproduce:

1. Go to Kibana > Dev Tools > Console.
2. Type in GET 1234567890.
3. Select a part of the text from 2 to 0.

Expected behavior:

The selected part should be obvious like 8.14.1 below.

Screenshots (if relevant):

[elasticmachine]

Pinging @elastic/kibana-management (Team:Kibana Management)

[sakurai-youhei]

The editor.selectionBackground has been set to #343551 (dark theme) and #E3E4ED (light theme) since ebe22f468b0d47ed5853cb89de2a28439caa0c5b, while the selected line's background color is transparentized #343741 (dark theme) and #D3DAE6 (light theme). That's why it is hard to distinguish two colors.

kibana/src/plugins/console/public/styles/_app.scss

Lines 130 to 135 in 6c36d72

	/*
	* The highlighting for the selected requests in the monaco editor
	*/
	.console__monaco_editor__selectedRequests {
	background: transparentize($euiColorLightShade, .3);
	}

https://github.com/elastic/eui/blob/a7f6d8479de9402b48673d38e84116ace54fbf35/packages/eui/src/themes/amsterdam/_colors_dark.scss#L22

https://github.com/elastic/eui/blob/a7f6d8479de9402b48673d38e84116ace54fbf35/packages/eui/src/themes/amsterdam/_colors_light.scss#L22