mirrors/hoppscotch
1
0
Fork 0
mirror of https://github.com/hoppscotch/hoppscotch synced 2024-11-22 23:28:35 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: multi cursor support - resolved #2215

Browse Source
This commit is contained in:
liyasthomas 2022-04-01 11:43:18 +05:30
parent c73c6f216a
commit 30e6052afb
2 changed files with 25 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
packages/hoppscotch-app/assets/scss/styles.scss
View File

@ -460,6 +460,17 @@ pre.ace_editor {
}
}
.cm-editor {
.cm-line::selection {
background-color: var(--accent-dark-color) !important;
color: var(--accent-contrast-color) !important;
}
.cm-line ::selection {
background-color: var(--accent-dark-color) !important;
color: var(--accent-contrast-color) !important;
}
}
.shortcut-key {
@apply inline-flex;
@apply font-sans;

20
packages/hoppscotch-app/helpers/editor/themes/baseTheme.ts
View File

@ -3,6 +3,8 @@ import {
keymap,
highlightSpecialChars,
highlightActiveLine,
drawSelection,
dropCursor,
} from "@codemirror/view"
import {
HighlightStyle,
@ -25,7 +27,10 @@ import {
} from "@codemirror/search"
import { autocompletion, completionKeymap } from "@codemirror/autocomplete"
import { commentKeymap } from "@codemirror/comment"
import { rectangularSelection } from "@codemirror/rectangular-selection"
import {
rectangularSelection,
// crosshairCursor,
} from "@codemirror/rectangular-selection"
import { lintKeymap } from "@codemirror/lint"
export const baseTheme = EditorView.theme({
@ -46,8 +51,8 @@ export const baseTheme = EditorView.theme({
".cm-widgetBuffer": {
position: "absolute",
},
".cm-selectionBackground, .cm-content ::selection, .cm-line ::selection": {
backgroundColor: "var(--accent-color)",
".cm-selectionBackground": {
backgroundColor: "var(--accent-dark-color)",
color: "var(--accent-contrast-color)",
},
".cm-panels": {
@ -167,8 +172,8 @@ export const inputTheme = EditorView.theme({
".cm-widgetBuffer": {
position: "absolute",
},
".cm-selectionBackground, .cm-content ::selection, .cm-line ::selection": {
backgroundColor: "var(--accent-color)",
".cm-selectionBackground": {
backgroundColor: "var(--accent-dark-color)",
color: "var(--accent-contrast-color)",
},
".cm-panels": {
@ -355,6 +360,8 @@ export const basicSetup: Extension = [
openText: "▾",
closedText: "▸",
}),
drawSelection(),
dropCursor(),
EditorState.allowMultipleSelections.of(true),
indentOnInput(),
defaultHighlightStyle.fallback,
@ -362,9 +369,9 @@ export const basicSetup: Extension = [
closeBrackets(),
autocompletion(),
rectangularSelection(),
// crosshairCursor(),
highlightActiveLine(),
highlightSelectionMatches(),
search(),
keymap.of([
...closeBracketsKeymap,
...defaultKeymap,
@ -375,4 +382,5 @@ export const basicSetup: Extension = [
...completionKeymap,
...lintKeymap,
]),
search(),
]