From c515ba89a0496b295038e5fe753eb1e7f69b75ec Mon Sep 17 00:00:00 2001
From: Felix Roos <flix91@gmail.com>
Date: Fri, 13 Feb 2026 10:02:44 +0100
Subject: [PATCH] fix: don't use id attribute in reusable component..

---
 website/src/repl/Repl.css            | 22 +++++++++++-----------
 website/src/repl/components/Code.jsx |  3 +--
 2 files changed, 12 insertions(+), 13 deletions(-)

diff --git a/website/src/repl/Repl.css b/website/src/repl/Repl.css
index a00600ae..3907ae24 100644
--- a/website/src/repl/Repl.css
+++ b/website/src/repl/Repl.css
@@ -10,50 +10,50 @@
   opacity: 0.5;
 }
 
-#code .cm-scroller {
+.code-container .cm-scroller {
   padding-top: 10px !important;
   height: 100%;
   font-family: inherit;
 }
-#code .cm-content {
+.code-container .cm-content {
   padding-bottom: 50vh;
 }
-#code .cm-line > * {
+.code-container .cm-line > * {
   background: var(--lineBackground);
 }
 
-#code .cm-editor {
+.code-container .cm-editor {
   background-color: transparent !important;
   height: 100%;
   z-index: 11;
 }
 
-#code .cm-theme {
+.code-container .cm-theme {
   width: 100%;
   height: 100%;
 }
 
-#code .cm-theme-light {
+.code-container .cm-theme-light {
   width: 100%;
 }
 
-#code .cm-cursorLayer {
+.code-container .cm-cursorLayer {
   animation-name: inherit !important;
 }
 
-#code .cm-cursor {
+.code-container .cm-cursor {
   border-left: 2px solid currentcolor !important;
 }
 
-#code .cm-foldGutter {
+.code-container .cm-foldGutter {
   display: none !important;
 }
 
-#code .cm-focused {
+.code-container .cm-focused {
   outline: none;
 }
 
-#code .cm-matchingBracket {
+.code-container .cm-matchingBracket {
   text-decoration: underline 0.18rem;
   text-underline-offset: 0.22rem;
 }
diff --git a/website/src/repl/components/Code.jsx b/website/src/repl/components/Code.jsx
index e8cccb86..161db102 100644
--- a/website/src/repl/components/Code.jsx
+++ b/website/src/repl/components/Code.jsx
@@ -8,8 +8,7 @@ export function Code(Props) {
 
   return (
     <section
-      className={'text-gray-100 cursor-text pb-0 overflow-auto grow z-10'}
-      id="code"
+      className={'code-container text-gray-100 cursor-text pb-0 overflow-auto grow z-10'}
       ref={(el) => {
         containerRef.current = el;
         if (!editorRef.current) {