Change selected text color in code editor (#4860)

This commit changes the selected text background color to a more
contrasting one. It also unifies colors of focused/not focused editor.
Focused editor is now indicated by the blinking cursor, which is a
more popular solution.
This commit is contained in:
Adam Medziński 2018-08-16 18:07:19 +02:00 committed by Matthew Irish
parent 6673e579a0
commit a4d10886f9
2 changed files with 8 additions and 3 deletions

View File

@ -12,6 +12,7 @@ const JSON_EDITOR_DEFAULTS = {
lint: { lintOnChange: false },
theme: 'hashi',
readOnly: false,
showCursorWhenSelecting: true,
};
export default IvyCodemirrorComponent.extend({

View File

@ -72,20 +72,24 @@ $gutter-grey: #2a2f36;
color: #6d8a88;
}
div.CodeMirror-selected {
background: rgb(33, 66, 131);
}
&.CodeMirror-focused div.CodeMirror-selected {
background: rgba(255, 255, 255, 0.10);
background: rgb(33, 66, 131);
}
.CodeMirror-line::selection,
.CodeMirror-line > span::selection,
.CodeMirror-line > span > span::selection {
background: rgba(255, 255, 255, 0.10);
background: rgb(33, 66, 131);
}
.CodeMirror-line::-moz-selection,
.CodeMirror-line > span::-moz-selection,
.CodeMirror-line > span > span::-moz-selection {
background: rgba(255, 255, 255, 0.10);
background: rgb(33, 66, 131);
}
span.cm-comment {