style(CodeEditor): update background styles to transparent for improved aesthetics

This commit is contained in:
Jaime Idolpx 2026-06-11 03:25:54 -04:00
parent c9041ba513
commit 43472deb76

View File

@ -26,7 +26,8 @@ interface CodeEditorProps {
}
const cmTheme = EditorView.theme({
'&': { height: '100%', background: '#0a0a0a' },
'&': { height: '100%', background: 'transparent' },
'.cm-gutters': { background: 'transparent', borderRight: '1px solid rgba(255,255,255,0.08)' },
'.cm-scroller': { overflow: 'auto', fontFamily: 'ui-monospace,monospace', fontSize: '12px', lineHeight: '1.5' },
'.cm-content': { padding: '12px 0' },
'.cm-focused': { outline: 'none' },
@ -100,7 +101,7 @@ export default function CodeEditor({ text, mode, syntaxHighlightLang, readOnly =
<SyntaxHighlighter
language={syntaxHighlightLang ?? syntaxLang[mode]}
style={vscDarkPlus}
customStyle={{ margin: 0, minHeight: '100%', background: '#0a0a0a', fontSize: '12px', lineHeight: '1.5' }}
customStyle={{ margin: 0, minHeight: '100%', background: 'transparent', fontSize: '12px', lineHeight: '1.5' }}
showLineNumbers
wrapLongLines
>