instant match hl same as other editors

also enable it when the find dialog is open because selection may be different
This commit is contained in:
tophf 2022-02-28 09:55:42 +03:00
parent b80c3e2f73
commit 2e31cae71e
3 changed files with 8 additions and 13 deletions

View File

@ -75,6 +75,10 @@
.CodeMirror-linenumber { .CodeMirror-linenumber {
cursor: pointer; /* for bookmarking */ cursor: pointer; /* for bookmarking */
} }
.cm-matchhighlight,
.CodeMirror-selection-highlight-scrollbar {
background: hsla(200, 100%, 50%, var(--match-hl-opacity, .1));
}
/* Custom stuff we add to CodeMirror */ /* Custom stuff we add to CodeMirror */
@ -86,6 +90,9 @@
} }
@media screen and (prefers-color-scheme: dark), dark { @media screen and (prefers-color-scheme: dark), dark {
.CodeMirror {
--match-hl-opacity: .18;
}
.CodeMirror-dialog { .CodeMirror-dialog {
background-color: #333; background-color: #333;
} }

View File

@ -83,6 +83,7 @@
const opt = (showToken || value === 'selection') && { const opt = (showToken || value === 'selection') && {
showToken, showToken,
annotateScrollbar: true, annotateScrollbar: true,
delay: 0,
onUpdate: updateMatchHighlightCount, onUpdate: updateMatchHighlightCount,
}; };
cm.setOption('highlightSelectionMatches', opt || null); cm.setOption('highlightSelectionMatches', opt || null);

View File

@ -510,15 +510,6 @@ label {
.resize-grip-enabled .CodeMirror-scrollbar-filler { .resize-grip-enabled .CodeMirror-scrollbar-filler {
bottom: 7px; /* make space for resize-grip */ bottom: 7px; /* make space for resize-grip */
} }
body:not(.find-open) .cm-matchhighlight,
body:not(.find-open) .CodeMirror-selection-highlight-scrollbar {
animation: fadein-match-highlighter 1s cubic-bezier(.97,.01,.42,.98);
animation-fill-mode: both;
}
body:not(.find-open) [data-match-highlight-count="1"] .cm-matchhighlight,
body:not(.find-open) [data-match-highlight-count="1"] .CodeMirror-selection-highlight-scrollbar {
animation: none;
}
@keyframes highlight { @keyframes highlight {
from { from {
background-color: #ff9; background-color: #ff9;
@ -535,10 +526,6 @@ body:not(.find-open) [data-match-highlight-count="1"] .CodeMirror-selection-high
opacity: 1; opacity: 1;
} }
} }
@keyframes fadein-match-highlighter {
from { background-color: transparent; }
to { background-color: rgba(1, 151, 193, 0.1); }
}
.resize-grip { .resize-grip {
position: absolute; position: absolute;
display: block; display: block;