|
| 1 | +// Copyright (c) 2021 - present core.ai . All rights reserved. |
| 2 | +// Original work Copyright (c) 2012 - 2021 Adobe Systems Incorporated. All rights reserved. |
| 3 | +// |
| 4 | +// Permission is hereby granted, free of charge, to any person obtaining a |
| 5 | +// copy of this software and associated documentation files (the "Software"), |
| 6 | +// to deal in the Software without restriction, including without limitation |
| 7 | +// the rights to use, copy, modify, merge, publish, distribute, sublicense, |
| 8 | +// and/or sell copies of the Software, and to permit persons to whom the |
| 9 | +// Software is furnished to do so, subject to the following conditions: |
| 10 | +// |
| 11 | +// The above copyright notice and this permission notice shall be included in |
| 12 | +// all copies or substantial portions of the Software. |
| 13 | +// |
| 14 | +// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR |
| 15 | +// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, |
| 16 | +// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE |
| 17 | +// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER |
| 18 | +// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING |
| 19 | +// FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER |
| 20 | +// DEALINGS IN THE SOFTWARE. |
| 21 | + |
| 22 | +/* Brackets / CodeMirror Code Formatting */ |
| 23 | + |
| 24 | +@code-padding: 15px; |
| 25 | + |
| 26 | +.CodeMirror pre { |
| 27 | + padding: 0 @code-padding 0 0; |
| 28 | + |
| 29 | + > * { |
| 30 | + text-indent: 0; |
| 31 | + } |
| 32 | +} |
| 33 | + |
| 34 | +.show-line-padding .CodeMirror pre { |
| 35 | + padding-left: 0; |
| 36 | +} |
| 37 | + |
| 38 | +.CodeMirror { |
| 39 | + .code-font(); |
| 40 | +} |
| 41 | + |
| 42 | +.platform-mac .CodeMirror { |
| 43 | + .code-font-mac(); |
| 44 | +} |
| 45 | + |
| 46 | +.platform-win .CodeMirror { |
| 47 | + .code-font-win(); |
| 48 | +} |
| 49 | + |
| 50 | +.CodeMirror-activeline-background { |
| 51 | + background: transparent; |
| 52 | +} |
| 53 | + |
| 54 | +.CodeMirror-focused .CodeMirror-activeline-background { |
| 55 | + background: @activeline-bg; |
| 56 | +} |
| 57 | + |
| 58 | +.show-line-padding .CodeMirror-focused .CodeMirror-activeline-background { |
| 59 | + box-shadow: inset @code-padding 0 0 0 @activeline-number-bg; |
| 60 | +} |
| 61 | + |
| 62 | +.CodeMirror-focused .CodeMirror-activeline { |
| 63 | + & > div, .CodeMirror-gutter-elt { |
| 64 | + height: 100%; |
| 65 | + } |
| 66 | + .CodeMirror-gutter-elt { |
| 67 | + background: @activeline-number-bg; |
| 68 | + color: @activeline-number; |
| 69 | + } |
| 70 | + .inline-widget .CodeMirror-gutter-elt { |
| 71 | + color: @accent-comment; |
| 72 | + } |
| 73 | +} |
| 74 | + |
| 75 | +.CodeMirror-focused .cm-matchhighlight { |
| 76 | + border-bottom: 2px solid #78B2F2; |
| 77 | +} |
| 78 | + |
| 79 | +span.cm-keyword {color: @accent-keyword;} |
| 80 | +span.cm-atom {color: @accent-atom;} |
| 81 | +span.cm-number {color: @accent-number;} |
| 82 | +span.cm-def {color: @accent-def;} |
| 83 | +span.cm-variable { |
| 84 | + color: @accent-variable; // global variable |
| 85 | +} |
| 86 | +span.cm-variable-2 {color: @accent-variable-2;} |
| 87 | +span.cm-variable-3 {color: @accent-def;} |
| 88 | +span.cm-type{color: @accent-def;} |
| 89 | +span.cm-operator {color: @accent-operator;} |
| 90 | +span.cm-comment {color: @accent-comment;} |
| 91 | +span.cm-string {color: @accent-string;} |
| 92 | +span.cm-string-2 {color: @accent-string-2;} |
| 93 | +span.cm-meta {color: @accent-meta;} |
| 94 | +span.cm-qualifier {color: @accent-qualifier;} |
| 95 | +span.cm-builtin {color: @accent-builtin;} |
| 96 | +span.cm-bracket {color: @accent-bracket;} |
| 97 | +span.cm-tag {color: @accent-tag;} |
| 98 | +span.cm-attribute {color: @accent-attribute;} |
| 99 | +span.cm-header {color: @accent-header;} |
| 100 | +span.cm-quote {color: @accent-quote;} |
| 101 | +span.cm-hr {color: @accent-hr;} |
| 102 | +span.cm-link {color: @accent-link; text-decoration: none;} |
| 103 | +span.cm-rangeinfo {color: @accent-rangeinfo;} |
| 104 | +span.cm-minus {color: @accent-minus;} |
| 105 | +span.cm-plus {color: @accent-plus;} |
| 106 | +span.cm-property {color: @accent-property;} //cm-property has go after cm-string for a better JSON look. |
| 107 | +span.cm-error {color: @accent-error;} |
| 108 | + |
| 109 | +span.CodeMirror-matchingbracket {color: @accent-bracket !important; background-color: @matching-bracket;} |
| 110 | +span.CodeMirror-nonmatchingbracket {color: @accent-bracket;} |
| 111 | + |
| 112 | +div.CodeMirror-cursors { |
| 113 | + .CodeMirror-cursor { |
| 114 | + .code-cursor(); |
| 115 | + } |
| 116 | + |
| 117 | + /* Ensure the cursor shows up in front of code spans with a background color |
| 118 | + * (e.g. matchingbracket). |
| 119 | + */ |
| 120 | + z-index: 3; |
| 121 | +} |
| 122 | + |
| 123 | +.CodeMirror pre.CodeMirror-line, |
| 124 | +.CodeMirror pre.CodeMirror-line-like { |
| 125 | + padding: 0 0; /* Horizontal padding of content */ |
| 126 | +} |
| 127 | + |
| 128 | +.CodeMirror-lines { |
| 129 | + padding: @code-padding 0; |
| 130 | + |
| 131 | + /* This is necessary for issue #2780. The logic for closing dropdowns depends on "click" events. Now |
| 132 | + * that each line has a separate div element, there is a good chance that mouseDown and mouseUp events |
| 133 | + * occur on different elements, which means a click event will not be sent. By disabling pointer events here, |
| 134 | + * we are guaranteed that the mouse event will be captured by our parent div, and click events will |
| 135 | + * be dispatched. |
| 136 | + */ |
| 137 | + pointer-events: none; |
| 138 | +} |
| 139 | + |
| 140 | +.CodeMirror-linewidget { |
| 141 | + /* Re-enable pointer events for line widget. Pointer events are disabled for "CodeMirror-lines", which is the |
| 142 | + * parent of line widgets, so they need to be explicitly re-enabled here in order for selection to work. */ |
| 143 | + pointer-events: auto; |
| 144 | +} |
| 145 | + |
| 146 | +.CodeMirror-gutters { |
| 147 | + background-color: @background; |
| 148 | + border-right: none; |
| 149 | +} |
| 150 | + |
| 151 | +.platform-win { |
| 152 | + .CodeMirror-scrollbar-filler { |
| 153 | + background-color: white; |
| 154 | + height: 12px !important; |
| 155 | + } |
| 156 | + .CodeMirror-gutter-filler { |
| 157 | + background-color: transparent; |
| 158 | + height: 12px !important; |
| 159 | + } |
| 160 | + .CodeMirror-scrollbar-filler { |
| 161 | + width: 12px !important; |
| 162 | + } |
| 163 | +} |
| 164 | +.platform-linux, .platform-mac { |
| 165 | + .CodeMirror-scrollbar-filler, |
| 166 | + .CodeMirror-gutter-filler { |
| 167 | + background-color: transparent; |
| 168 | + height: 12px !important; |
| 169 | + } |
| 170 | + .CodeMirror-scrollbar-filler { |
| 171 | + width: 12px !important; |
| 172 | + } |
| 173 | +} |
| 174 | + |
| 175 | +.CodeMirror-linenumber { |
| 176 | + color: @accent-comment; |
| 177 | + min-width: 2.5em; |
| 178 | + /*font-size: 0.9em;*/ /* restore after SourceCodePro font fix? */ |
| 179 | + padding: 0 @code-padding 0 10px; // note: overridden if code-folding gutter is shown |
| 180 | +} |
| 181 | +.CodeMirror .CodeMirror-selected { |
| 182 | + background: @selection-color-unfocused; |
| 183 | +} |
| 184 | +.CodeMirror-focused .CodeMirror-selected { |
| 185 | + background: @selection-color-focused; |
| 186 | +} |
| 187 | + |
| 188 | +/* |
| 189 | + CodeMirror's use of descendant selectors for certain styling causes problems when editors are |
| 190 | + nested because, for items in the inner editor, the left-hand clause in the selector will now |
| 191 | + match either the actual containing CodeMirror instance *OR* the outer "host" CodeMirror instance. |
| 192 | +
|
| 193 | + TODO (issue #324): We'll still have problems if editors can be nested more than one level deep, |
| 194 | + or if any other descendant-selector-driven CM styles can differ between inner & outer editors |
| 195 | + (potential problem areas include line wrap and coloring theme: basically, anything in codemirror.css |
| 196 | + that uses a descandant selector where the CSS class name to the left of the space is something |
| 197 | + other than a vanilla .CodeMirror) |
| 198 | + */ |
| 199 | +.CodeMirror { |
| 200 | + .CodeMirror-overwrite .CodeMirror-cursor { |
| 201 | + border-left: none !important; |
| 202 | + border-bottom: 1px solid black; |
| 203 | + width: 1.2ex; |
| 204 | + } |
| 205 | + |
| 206 | + .CodeMirror { |
| 207 | + background: transparent; |
| 208 | + } |
| 209 | + |
| 210 | + .CodeMirror span.CodeMirror-matchingbracket { |
| 211 | + /* Ensure visibility against gray inline editor background */ |
| 212 | + background-color: @matching-bracket; |
| 213 | + color: @accent-bracket !important; |
| 214 | + } |
| 215 | + |
| 216 | + .CodeMirror .CodeMirror-cursors { |
| 217 | + visibility: hidden; |
| 218 | + } |
| 219 | + .CodeMirror.CodeMirror-focused .CodeMirror-cursors { |
| 220 | + visibility: visible; |
| 221 | + } |
| 222 | + |
| 223 | + .CodeMirror .CodeMirror-selected { |
| 224 | + background: @selection-color-unfocused; |
| 225 | + } |
| 226 | + .CodeMirror.CodeMirror-focused .CodeMirror-selected { |
| 227 | + background: @selection-color-focused; |
| 228 | + } |
| 229 | + .CodeMirror .CodeMirror-gutters { |
| 230 | + background: transparent; |
| 231 | + border-right: none; |
| 232 | + } |
| 233 | + |
| 234 | + .CodeMirror-scroll { |
| 235 | + outline: none; |
| 236 | + } |
| 237 | + |
| 238 | + .CodeMirror-sizer { |
| 239 | + cursor: text; |
| 240 | + } |
| 241 | + |
| 242 | + .CodeMirror .CodeMirror-vscrollbar, .CodeMirror .CodeMirror-hscrollbar { |
| 243 | + cursor: default; |
| 244 | + } |
| 245 | + |
| 246 | + .CodeMirror .CodeMirror-activeline-background { |
| 247 | + background: transparent; |
| 248 | + } |
| 249 | + |
| 250 | + .show-line-padding & .CodeMirror .CodeMirror-activeline-background { |
| 251 | + box-shadow: none; |
| 252 | + } |
| 253 | + |
| 254 | + .CodeMirror .CodeMirror-activeline .CodeMirror-gutter-elt { |
| 255 | + background: transparent; |
| 256 | + color: @accent-comment; |
| 257 | + } |
| 258 | + |
| 259 | + .CodeMirror-focused .CodeMirror-activeline-background { |
| 260 | + background: @activeline-bg; |
| 261 | + } |
| 262 | + |
| 263 | + .show-line-padding & .CodeMirror-focused .CodeMirror-activeline-background { |
| 264 | + box-shadow: inset @code-padding 0 0 0 @background; |
| 265 | + } |
| 266 | + |
| 267 | + .CodeMirror-focused .CodeMirror-activeline { |
| 268 | + .CodeMirror-gutter-elt { |
| 269 | + background: @activeline-number-bg-inline; |
| 270 | + color: @activeline-number; |
| 271 | + } |
| 272 | + } |
| 273 | + |
| 274 | + .CodeMirror-matchingtag { background: @matching-bracket; } |
| 275 | +} |
| 276 | + |
| 277 | +/* |
| 278 | + * Temporarily override bold and italic syntax highlighting until |
| 279 | + * SourceCodePro supports them in a fixed pitch |
| 280 | + */ |
| 281 | +span.cm-em { |
| 282 | + font-style: normal; |
| 283 | +} |
| 284 | +span.cm-header, span.cm-strong { |
| 285 | + font-weight: normal; |
| 286 | +} |
| 287 | +span.cm-emstrong { |
| 288 | + font-style: normal; |
| 289 | + font-weight: normal; |
| 290 | +} |
0 commit comments