fix: don't use id attribute in reusable component..

This commit is contained in:
Felix Roos 2026-02-13 10:02:44 +01:00
parent 7e3063038e
commit c515ba89a0
No known key found for this signature in database
2 changed files with 12 additions and 13 deletions

View file

@ -10,50 +10,50 @@
opacity: 0.5; opacity: 0.5;
} }
#code .cm-scroller { .code-container .cm-scroller {
padding-top: 10px !important; padding-top: 10px !important;
height: 100%; height: 100%;
font-family: inherit; font-family: inherit;
} }
#code .cm-content { .code-container .cm-content {
padding-bottom: 50vh; padding-bottom: 50vh;
} }
#code .cm-line > * { .code-container .cm-line > * {
background: var(--lineBackground); background: var(--lineBackground);
} }
#code .cm-editor { .code-container .cm-editor {
background-color: transparent !important; background-color: transparent !important;
height: 100%; height: 100%;
z-index: 11; z-index: 11;
} }
#code .cm-theme { .code-container .cm-theme {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
#code .cm-theme-light { .code-container .cm-theme-light {
width: 100%; width: 100%;
} }
#code .cm-cursorLayer { .code-container .cm-cursorLayer {
animation-name: inherit !important; animation-name: inherit !important;
} }
#code .cm-cursor { .code-container .cm-cursor {
border-left: 2px solid currentcolor !important; border-left: 2px solid currentcolor !important;
} }
#code .cm-foldGutter { .code-container .cm-foldGutter {
display: none !important; display: none !important;
} }
#code .cm-focused { .code-container .cm-focused {
outline: none; outline: none;
} }
#code .cm-matchingBracket { .code-container .cm-matchingBracket {
text-decoration: underline 0.18rem; text-decoration: underline 0.18rem;
text-underline-offset: 0.22rem; text-underline-offset: 0.22rem;
} }

View file

@ -8,8 +8,7 @@ export function Code(Props) {
return ( return (
<section <section
className={'text-gray-100 cursor-text pb-0 overflow-auto grow z-10'} className={'code-container text-gray-100 cursor-text pb-0 overflow-auto grow z-10'}
id="code"
ref={(el) => { ref={(el) => {
containerRef.current = el; containerRef.current = el;
if (!editorRef.current) { if (!editorRef.current) {