diff options
author | Kristóf Marussy <kristof@marussy.com> | 2022-08-12 20:20:44 +0200 |
---|---|---|
committer | Kristóf Marussy <kristof@marussy.com> | 2022-08-12 20:20:44 +0200 |
commit | eaa64728b7016aab3a901e8886652f0612adb22c (patch) | |
tree | 48b599a99564fff9ef0c8f33ec9ff1a1f25415f9 /subprojects | |
parent | chore(deps): bump dependencies (diff) | |
download | refinery-eaa64728b7016aab3a901e8886652f0612adb22c.tar.gz refinery-eaa64728b7016aab3a901e8886652f0612adb22c.tar.zst refinery-eaa64728b7016aab3a901e8886652f0612adb22c.zip |
refactor(frontend): EditorParent line numbers
Diffstat (limited to 'subprojects')
-rw-r--r-- | subprojects/frontend/src/editor/EditorArea.tsx | 8 | ||||
-rw-r--r-- | subprojects/frontend/src/editor/EditorParent.ts | 12 |
2 files changed, 10 insertions, 10 deletions
diff --git a/subprojects/frontend/src/editor/EditorArea.tsx b/subprojects/frontend/src/editor/EditorArea.tsx index 14294371..d4305610 100644 --- a/subprojects/frontend/src/editor/EditorArea.tsx +++ b/subprojects/frontend/src/editor/EditorArea.tsx | |||
@@ -134,13 +134,7 @@ function EditorArea(): JSX.Element { | |||
134 | return ( | 134 | return ( |
135 | <EditorParent | 135 | <EditorParent |
136 | className="dark" | 136 | className="dark" |
137 | sx={{ | 137 | showLineNumbers={editorStore.showLineNumbers} |
138 | '.cm-lineNumbers': editorStore.showLineNumbers | ||
139 | ? {} | ||
140 | : { | ||
141 | display: 'none !important', | ||
142 | }, | ||
143 | }} | ||
144 | ref={editorParentRef} | 138 | ref={editorParentRef} |
145 | /> | 139 | /> |
146 | ); | 140 | ); |
diff --git a/subprojects/frontend/src/editor/EditorParent.ts b/subprojects/frontend/src/editor/EditorParent.ts index dbc35a0d..a4cdfa38 100644 --- a/subprojects/frontend/src/editor/EditorParent.ts +++ b/subprojects/frontend/src/editor/EditorParent.ts | |||
@@ -19,7 +19,8 @@ function underline(color: string) { | |||
19 | 19 | ||
20 | export default styled('div', { | 20 | export default styled('div', { |
21 | name: 'EditorParent', | 21 | name: 'EditorParent', |
22 | })(({ theme }) => { | 22 | shouldForwardProp: (propName) => propName !== 'showLineNumbers', |
23 | })<{ showLineNumbers: boolean }>(({ theme, showLineNumbers }) => { | ||
23 | const codeMirrorLintStyle: Record<string, unknown> = {}; | 24 | const codeMirrorLintStyle: Record<string, unknown> = {}; |
24 | (['error', 'warning', 'info'] as const).forEach((severity) => { | 25 | (['error', 'warning', 'info'] as const).forEach((severity) => { |
25 | const color = theme.palette[severity].main; | 26 | const color = theme.palette[severity].main; |
@@ -77,8 +78,13 @@ export default styled('div', { | |||
77 | '.cm-activeLineGutter': { | 78 | '.cm-activeLineGutter': { |
78 | background: 'transparent', | 79 | background: 'transparent', |
79 | }, | 80 | }, |
80 | '.cm-lineNumbers .cm-activeLineGutter': { | 81 | '.cm-lineNumbers': { |
81 | color: theme.palette.text.primary, | 82 | ...(!showLineNumbers && { |
83 | display: 'none !important', | ||
84 | }), | ||
85 | '.cm-activeLineGutter': { | ||
86 | color: theme.palette.text.primary, | ||
87 | }, | ||
82 | }, | 88 | }, |
83 | '.cm-cursor, .cm-cursor-primary': { | 89 | '.cm-cursor, .cm-cursor-primary': { |
84 | borderLeft: `2px solid ${theme.palette.primary.main}`, | 90 | borderLeft: `2px solid ${theme.palette.primary.main}`, |