/* IFS Cloud Marble Dark Theme for CodeMirror */
/* Based on the VS Code Marble Dark theme colors */
.cm-s-marble-dark.CodeMirror {
background: #1a1b26;
color: #c0caf5;
height: 100% !important;
max-height: 60vh !important; /* Force maximum height */
min-height: 0;
overflow: hidden; /* Container should not scroll */
}
/* Ensure scrollbars work properly */
.CodeMirror-scroll {
overflow: auto !important;
height: 100% !important;
max-height: 60vh !important; /* Force maximum height */
min-height: 0 !important;
}
.CodeMirror-vscrollbar,
.CodeMirror-hscrollbar {
display: block !important;
}
/* Custom scrollbar styling for dark theme */
.CodeMirror-vscrollbar::-webkit-scrollbar {
width: 12px;
}
.CodeMirror-hscrollbar::-webkit-scrollbar {
height: 12px;
}
.CodeMirror-vscrollbar::-webkit-scrollbar-track,
.CodeMirror-hscrollbar::-webkit-scrollbar-track {
background: #16161e;
}
.CodeMirror-vscrollbar::-webkit-scrollbar-thumb,
.CodeMirror-hscrollbar::-webkit-scrollbar-thumb {
background: #565f89;
border-radius: 6px;
}
.CodeMirror-vscrollbar::-webkit-scrollbar-thumb:hover,
.CodeMirror-hscrollbar::-webkit-scrollbar-thumb:hover {
background: #7aa2f7;
}
.cm-s-marble-dark div.CodeMirror-selected {
background: #33467c;
}
.cm-s-marble-dark .CodeMirror-line::selection,
.cm-s-marble-dark .CodeMirror-line > span::selection,
.cm-s-marble-dark .CodeMirror-line > span > span::selection {
background: rgba(51, 70, 124, 0.8);
}
.cm-s-marble-dark .CodeMirror-line::-moz-selection,
.cm-s-marble-dark .CodeMirror-line > span::-moz-selection,
.cm-s-marble-dark .CodeMirror-line > span > span::-moz-selection {
background: rgba(51, 70, 124, 0.8);
}
.cm-s-marble-dark .CodeMirror-gutters {
background: #16161e;
border-right: 0px;
}
.cm-s-marble-dark .CodeMirror-guttermarker {
color: white;
}
.cm-s-marble-dark .CodeMirror-guttermarker-subtle {
color: #565f89;
}
.cm-s-marble-dark .CodeMirror-linenumber {
color: #565f89;
}
.cm-s-marble-dark .CodeMirror-cursor {
border-left: 1px solid #c0caf5;
}
/* Comments */
.cm-s-marble-dark span.cm-comment {
color: #565f89;
font-style: italic;
}
/* Strings */
.cm-s-marble-dark span.cm-string {
color: #9ece6a;
}
.cm-s-marble-dark span.cm-string-2 {
color: #73daca; /* Template strings */
}
/* Numbers */
.cm-s-marble-dark span.cm-number {
color: #79c0ff;
}
/* Keywords */
.cm-s-marble-dark span.cm-keyword {
color: #ff7b72;
}
/* IFS specific keywords (entity, projection, etc) */
.cm-s-marble-dark span.cm-keyword.cm-def {
color: #bb9af7;
font-weight: bold;
}
/* Types and data types */
.cm-s-marble-dark span.cm-type {
color: #2ac3de;
}
/* Variables */
.cm-s-marble-dark span.cm-variable {
color: #e6edf3;
}
/* Function names and entity names */
.cm-s-marble-dark span.cm-def {
color: #e0af68;
font-weight: bold;
}
/* Properties */
.cm-s-marble-dark span.cm-property {
color: #7aa2f7;
}
/* Operators */
.cm-s-marble-dark span.cm-operator {
color: #ff7b72;
}
/* Brackets */
.cm-s-marble-dark span.cm-bracket {
color: #ff7b72;
}
/* Built-in constants */
.cm-s-marble-dark span.cm-atom {
color: #79c0ff;
}
/* Annotations (@Override, @Entity, etc) */
.cm-s-marble-dark span.cm-meta {
color: #f85149;
}
/* Special variables ($, &, @@) */
.cm-s-marble-dark span.cm-variable-2 {
color: #ffa657;
}
/* Function calls */
.cm-s-marble-dark span.cm-variable-3 {
color: #d2a8ff;
}
/* Tags (for XML-like content in fragments) */
.cm-s-marble-dark span.cm-tag {
color: #f0883e;
}
.cm-s-marble-dark span.cm-attribute {
color: #7aa2f7;
}
/* Error highlighting */
.cm-s-marble-dark span.cm-error {
background: rgba(248, 81, 73, 0.3);
color: #f85149;
}
/* Active line */
.cm-s-marble-dark .CodeMirror-activeline-background {
background: rgba(192, 202, 245, 0.1);
}
/* Search highlights */
.cm-s-marble-dark .CodeMirror-searching {
background-color: rgba(255, 198, 0, 0.4);
}
/* Matching brackets */
.cm-s-marble-dark .CodeMirror-matchingbracket {
outline: 1px solid #79c0ff;
color: #79c0ff !important;
}
/* Folding */
.cm-s-marble-dark .CodeMirror-foldmarker {
background: #7aa2f7;
color: #1a1b26;
font-family: arial;
line-height: 0.3;
cursor: pointer;
}
.cm-s-marble-dark .CodeMirror-foldgutter {
width: 0.7em;
}
.cm-s-marble-dark .CodeMirror-foldgutter-open,
.cm-s-marble-dark .CodeMirror-foldgutter-folded {
cursor: pointer;
}
.cm-s-marble-dark .CodeMirror-foldgutter-open:after {
content: "\25BC";
color: #565f89;
}
.cm-s-marble-dark .CodeMirror-foldgutter-folded:after {
content: "\25B6";
color: #565f89;
}
