.CodeMirror { height: 100% !important; } :root { --color1: #b290fc; --color2: #ececec; --color3: #f1fa8c; --color4: #ff79c6; --color5: #ffb86c; --color6: #f99393; --color7: #ececec; --color-faded: #605C7B; } .cm-s-dracula .CodeMirror-gutters, .cm-s-dracula.CodeMirror { background-color: transparent !important; color: var(--color7) !important; border: none; } .cm-s-dracula .CodeMirror-gutters { /* MY UI CARD COLOR */ color: #131313; } .cm-s-dracula .CodeMirror-cursor { border-left: solid thin var(--color7); } .cm-s-dracula .CodeMirror-linenumber { color: var(--color-faded); } .cm-s-dracula .CodeMirror-selected { background: rgba(255, 255, 255, 0.1); } .cm-s-dracula .CodeMirror-line::selection, .cm-s-dracula .CodeMirror-line > span::selection, .cm-s-dracula .CodeMirror-line > span > span::selection { background: rgba(255, 255, 255, 0.1); } .cm-s-dracula .CodeMirror-line::-moz-selection, .cm-s-dracula .CodeMirror-line > span::-moz-selection, .cm-s-dracula .CodeMirror-line > span > span::-moz-selection { background: rgba(255, 255, 255, 0.1); } .cm-s-dracula span.cm-comment { color: var(--color-faded); } .cm-s-dracula span.cm-string, .cm-s-dracula span.cm-string-2 { color: var(--color3); } .cm-s-dracula span.cm-number { color: var(--color6); } .cm-s-dracula span.cm-variable { color: var(--color1); } .cm-s-dracula span.cm-variable-2 { color: var(--color7); } .cm-s-dracula span.cm-def { color: var(--color1); } .cm-s-dracula span.cm-operator { color: var(--color2); } .cm-s-dracula span.cm-keyword { color: var(--color2); } .cm-s-dracula span.cm-atom { color: var(--color6); } .cm-s-dracula span.cm-meta { color: var(--color7); } .cm-s-dracula span.cm-tag { color: var(--color2); } .cm-s-dracula span.cm-attribute { color: var(--color1); } .cm-s-dracula span.cm-qualifier { color: var(--color1); } .cm-s-dracula span.cm-property { color: var(--color4); } .cm-s-dracula span.cm-builtin { color: var(--color1); } .cm-s-dracula span.cm-type, .cm-s-dracula span.cm-variable-3 { color: var(--color5); } .cm-s-dracula .CodeMirror-activeline-background { background: rgba(255, 255, 255, 0.1); } .cm-s-dracula .CodeMirror-matchingbracket { text-decoration: underline; color: var(--color7) !important; }