fix: don't use id attribute in reusable component..
This commit is contained in:
parent
7e3063038e
commit
c515ba89a0
2 changed files with 12 additions and 13 deletions
|
|
@ -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;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -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) {
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue