admin/n8n-enterprise-unlocked
1
0
Fork 0
mirror of https://github.com/Abdulazizzn/n8n-enterprise-unlocked.git synced 2025-12-20 11:22:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor(editor): Replace monaco-editor/prismjs with CodeMirror (#5983)

Browse Source 
Co-authored-by: Jan Oberhauser <jan.oberhauser@gmail.com>
Co-authored-by: Milorad FIlipović <milorad@n8n.io>
Co-authored-by: Alex Grozav <alex@grozav.com>
This commit is contained in:
कारतोफ्फेलस्क्रिप्ट™
2023-04-25 14:57:21 +00:00
committed by GitHub
parent 88724bb056
commit ca4e0df90b
25 changed files with 240 additions and 691 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
packages/editor-ui/src/components/CodeNodeEditor/theme.ts
View File

@@ -29,7 +29,11 @@ const BASE_STYLING = {
const cssStyleDeclaration = getComputedStyle(document.documentElement);
export const CODE_NODE_EDITOR_THEME = [
interface ThemeSettings {
isReadOnly?: boolean;
}
export const codeNodeEditorTheme = ({ isReadOnly }: ThemeSettings) => [
EditorView.theme({
'&': {
'font-size': BASE_STYLING.fontSize,
@@ -37,6 +41,7 @@ export const CODE_NODE_EDITOR_THEME = [
borderRadius: cssStyleDeclaration.getPropertyValue('--border-radius-base'),
backgroundColor: 'var(--color-code-background)',
color: 'var(--color-code-foreground)',
height: '100%',
},
'.cm-content': {
fontFamily: BASE_STYLING.fontFamily,
@@ -48,6 +53,9 @@ export const CODE_NODE_EDITOR_THEME = [
'&.cm-focused .cm-selectionBackgroundm .cm-selectionBackground, .cm-content ::selection': {
backgroundColor: 'var(--color-code-selection)',
},
'&.cm-editor': {
...(isReadOnly ? { backgroundColor: 'var(--color-code-background-readonly)' } : {}),
},
'&.cm-editor.cm-focused': {
outline: 'none',
borderColor: 'var(--color-secondary)',
@@ -59,7 +67,9 @@ export const CODE_NODE_EDITOR_THEME = [
backgroundColor: 'var(--color-code-lineHighlight)',
},
'.cm-gutters': {
backgroundColor: 'var(--color-code-gutterBackground)',
backgroundColor: isReadOnly
? 'var(--color-code-background-readonly)'
: 'var(--color-code-gutterBackground)',
color: 'var(--color-code-gutterForeground)',
borderRadius: 'var(--border-radius-base)',
},
@@ -69,7 +79,8 @@ export const CODE_NODE_EDITOR_THEME = [
},
'.cm-scroller': {
overflow: 'auto',
maxHeight: BASE_STYLING.maxHeight,
maxHeight: '100%',
...(isReadOnly ? {} : { minHeight: '10em' }),
},
'.cm-diagnosticAction': {
backgroundColor: BASE_STYLING.diagnosticButton.backgroundColor,