@teipublisher/pb-components 1.40.2 → 1.41.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (92) hide show
  1. package/CHANGELOG.md +13 -0
  2. package/dist/demo/pb-code-editor.html +12 -9
  3. package/dist/{iron-form-f540b15b.js → iron-form-9e72ac45.js} +1 -1
  4. package/dist/jinn-codemirror-c1a4b755.js +1 -0
  5. package/dist/{paper-checkbox-f6a70487.js → paper-checkbox-102e3b43.js} +120 -120
  6. package/dist/pb-code-editor.js +22 -0
  7. package/dist/pb-components-bundle.js +234 -234
  8. package/dist/pb-edit-app.js +33 -33
  9. package/dist/pb-elements.json +61 -16
  10. package/dist/pb-i18n-6ad23bcf.js +1 -0
  11. package/dist/pb-message-0fb0b538.js +911 -0
  12. package/dist/pb-odd-editor.js +110 -82
  13. package/package.json +4 -5
  14. package/pb-elements.json +61 -16
  15. package/src/pb-code-editor.js +51 -663
  16. package/src/pb-components.js +0 -1
  17. package/src/pb-odd-model-editor.js +33 -23
  18. package/src/pb-odd-parameter-editor.js +17 -9
  19. package/src/pb-odd-rendition-editor.js +19 -9
  20. package/css/codemirror/3024-day.css +0 -41
  21. package/css/codemirror/3024-night.css +0 -39
  22. package/css/codemirror/abbott.css +0 -268
  23. package/css/codemirror/abcdef.css +0 -32
  24. package/css/codemirror/ambiance-mobile.css +0 -5
  25. package/css/codemirror/ambiance.css +0 -74
  26. package/css/codemirror/ayu-dark.css +0 -44
  27. package/css/codemirror/ayu-mirage.css +0 -45
  28. package/css/codemirror/base16-dark.css +0 -40
  29. package/css/codemirror/base16-light.css +0 -38
  30. package/css/codemirror/bespin.css +0 -34
  31. package/css/codemirror/blackboard.css +0 -32
  32. package/css/codemirror/cobalt.css +0 -25
  33. package/css/codemirror/colorforth.css +0 -33
  34. package/css/codemirror/darcula.css +0 -53
  35. package/css/codemirror/dracula.css +0 -40
  36. package/css/codemirror/duotone-dark.css +0 -35
  37. package/css/codemirror/duotone-light.css +0 -36
  38. package/css/codemirror/eclipse.css +0 -23
  39. package/css/codemirror/elegant.css +0 -13
  40. package/css/codemirror/erlang-dark.css +0 -34
  41. package/css/codemirror/gruvbox-dark.css +0 -39
  42. package/css/codemirror/hopscotch.css +0 -34
  43. package/css/codemirror/icecoder.css +0 -43
  44. package/css/codemirror/idea.css +0 -42
  45. package/css/codemirror/isotope.css +0 -34
  46. package/css/codemirror/juejin.css +0 -30
  47. package/css/codemirror/lesser-dark.css +0 -47
  48. package/css/codemirror/liquibyte.css +0 -95
  49. package/css/codemirror/lucario.css +0 -37
  50. package/css/codemirror/material-darker.css +0 -135
  51. package/css/codemirror/material-ocean.css +0 -141
  52. package/css/codemirror/material-palenight.css +0 -141
  53. package/css/codemirror/material.css +0 -141
  54. package/css/codemirror/mbo.css +0 -37
  55. package/css/codemirror/mdn-like.css +0 -46
  56. package/css/codemirror/midnight.css +0 -39
  57. package/css/codemirror/monokai.css +0 -41
  58. package/css/codemirror/moxer.css +0 -143
  59. package/css/codemirror/neat.css +0 -12
  60. package/css/codemirror/neo.css +0 -43
  61. package/css/codemirror/night.css +0 -27
  62. package/css/codemirror/nord.css +0 -42
  63. package/css/codemirror/oceanic-next.css +0 -46
  64. package/css/codemirror/panda-syntax.css +0 -85
  65. package/css/codemirror/paraiso-dark.css +0 -38
  66. package/css/codemirror/paraiso-light.css +0 -38
  67. package/css/codemirror/pastel-on-dark.css +0 -52
  68. package/css/codemirror/railscasts.css +0 -34
  69. package/css/codemirror/rubyblue.css +0 -25
  70. package/css/codemirror/seti.css +0 -44
  71. package/css/codemirror/shadowfox.css +0 -52
  72. package/css/codemirror/solarized.css +0 -168
  73. package/css/codemirror/ssms.css +0 -16
  74. package/css/codemirror/the-matrix.css +0 -30
  75. package/css/codemirror/tomorrow-night-bright.css +0 -35
  76. package/css/codemirror/tomorrow-night-eighties.css +0 -38
  77. package/css/codemirror/ttcn.css +0 -64
  78. package/css/codemirror/twilight.css +0 -32
  79. package/css/codemirror/vibrant-ink.css +0 -34
  80. package/css/codemirror/xq-dark.css +0 -53
  81. package/css/codemirror/xq-light.css +0 -43
  82. package/css/codemirror/yeti.css +0 -44
  83. package/css/codemirror/yonce.css +0 -59
  84. package/css/codemirror/zenburn.css +0 -37
  85. package/dist/pb-message-1a0c0c52.js +0 -1360
  86. package/lib/codemirror/addon/display/placeholder.js +0 -70
  87. package/lib/codemirror/addon/edit/matchbrackets.js +0 -152
  88. package/lib/codemirror/addon/lint/lint.js +0 -282
  89. package/lib/codemirror/mode/css/css.js +0 -855
  90. package/lib/codemirror/mode/stex/stex.js +0 -249
  91. package/lib/codemirror/mode/xml/xml.js +0 -404
  92. package/lib/codemirror/mode/xquery/xquery.js +0 -434
@@ -38,7 +38,6 @@ import './pb-select-odd.js';
38
38
  import './pb-select-template.js';
39
39
  import './pb-geolocation.js';
40
40
  import './pb-code-highlight.js';
41
- import './pb-code-editor.js';
42
41
  import './pb-repeat.js';
43
42
  import './pb-svg.js';
44
43
  import './pb-facsimile.js';
@@ -14,11 +14,11 @@ import '@polymer/paper-listbox/paper-listbox.js';
14
14
  import '@polymer/paper-item/paper-item.js';
15
15
  import '@polymer/paper-styles/color.js';
16
16
  import '@polymer/iron-collapse/iron-collapse.js';
17
+ import "@jinntec/jinn-codemirror/dist/src/jinn-codemirror";
17
18
 
18
19
  import { cmpVersion } from './utils.js';
19
20
  import './pb-odd-rendition-editor.js';
20
21
  import './pb-odd-parameter-editor.js';
21
- import './pb-code-editor.js';
22
22
  import './pb-message.js';
23
23
 
24
24
  import { get as i18n, translate } from "./pb-i18n.js";
@@ -211,10 +211,17 @@ export class PbOddModelEditor extends LitElement {
211
211
  background:var(--paper-grey-200);
212
212
  }
213
213
 
214
- pb-code-editor {
214
+ .editor {
215
215
  margin-bottom: 20px;
216
216
  }
217
217
 
218
+ .editor label {
219
+ margin-bottom:5px;
220
+ font-size: 12px;
221
+ font-weight: 400;
222
+ color: var(--paper-grey-500);
223
+ }
224
+
218
225
  .horizontal {
219
226
  display: flex;
220
227
  flex-wrap: wrap;
@@ -465,14 +472,15 @@ export class PbOddModelEditor extends LitElement {
465
472
  <paper-input id="desc" .value="${this.desc}" placeholder="${translate('odd.editor.model.description-placeholder')}"
466
473
  label="Description" @change="${this._inputDesc}"></paper-input>
467
474
 
468
- <pb-code-editor id="predicate"
469
- code="${this.predicate}"
470
- mode="xquery"
471
- linter="${this.endpoint}/${cmpVersion(this.apiVersion, '1.0.0') < 0 ? 'modules/editor.xql' : 'api/lint'}"
472
- label="Predicate"
473
- placeholder="${translate('odd.editor.model.predicate-placeholder')}"
474
- @code-changed="${this._updatePredicate}"
475
- apiVersion="${this.apiVersion}"></pb-code-editor>
475
+ <div class="editor">
476
+ <label>Predicate</label>
477
+ <jinn-codemirror id="predicate"
478
+ code="${this.predicate}"
479
+ mode="xquery"
480
+ linter="${this.endpoint}/${cmpVersion(this.apiVersion, '1.0.0') < 0 ? 'modules/editor.xql' : 'api/lint'}"
481
+ placeholder="${translate('odd.editor.model.predicate-placeholder')}"
482
+ @update="${this._updatePredicate}"></jinn-codemirror>
483
+ </div>
476
484
 
477
485
  ${this._isModel()
478
486
  ? html`
@@ -498,14 +506,16 @@ export class PbOddModelEditor extends LitElement {
498
506
  placeholder="${translate('odd.editor.model.css-class-placeholder')}"
499
507
  label="CSS Class"
500
508
  @change="${this._inputCss}"></paper-input>
501
-
502
- <pb-code-editor id="template"
503
- code="${this.template}"
504
- mode="${this.output === 'latex' ? 'stex' : 'xml'}"
505
- label="Template"
506
- placeholder="${translate('odd.editor.model.template-placeholder')}"
507
- @code-changed="${this._updateTemplate}"
508
- apiVersion="${this.apiVersion}"></pb-code-editor>
509
+
510
+ <div class="editor">
511
+ <label>Template</label>
512
+ <jinn-codemirror id="template"
513
+ code="${this.template}"
514
+ mode="${this.output === 'latex' ? 'tex' : 'xml'}"
515
+ placeholder="${translate('odd.editor.model.template-placeholder')}"
516
+ @update="${this._updateTemplate}">
517
+ </jinn-codemirror>
518
+ </div>
509
519
  </div>
510
520
 
511
521
  <div class="parameters">
@@ -605,11 +615,11 @@ export class PbOddModelEditor extends LitElement {
605
615
 
606
616
  refreshEditors() {
607
617
  console.log('refreshEditors');
608
- this.shadowRoot.getElementById('predicate').refresh();
618
+ // this.shadowRoot.getElementById('predicate').refresh();
609
619
 
610
620
  if (this._isGroupOrSequence()) { return console.log("asfdfa"); }
611
621
 
612
- this.shadowRoot.getElementById('template').refresh();
622
+ // this.shadowRoot.getElementById('template').refresh();
613
623
 
614
624
  const models = this.shadowRoot.querySelectorAll('pb-odd-model-editor');
615
625
  for (let i = 0; i < models.length; i++) {
@@ -842,8 +852,8 @@ export class PbOddModelEditor extends LitElement {
842
852
  this._fireModelChanged('output', this.output);
843
853
  }
844
854
 
845
- _updatePredicate(ev) {
846
- this.predicate = this.shadowRoot.getElementById('predicate').getSource();
855
+ _updatePredicate() {
856
+ this.predicate = this.shadowRoot.getElementById('predicate').value;
847
857
  console.log('_updatePredicate ', this.predicate);
848
858
  this._fireModelChanged('predicate', this.predicate);
849
859
  }
@@ -864,7 +874,7 @@ export class PbOddModelEditor extends LitElement {
864
874
  }
865
875
 
866
876
  _updateTemplate(ev) {
867
- this.template = this.shadowRoot.getElementById('template').getSource();
877
+ this.template = this.shadowRoot.getElementById('template').value;
868
878
  this._fireModelChanged('template', this.template);
869
879
  }
870
880
 
@@ -7,10 +7,9 @@ import '@polymer/paper-dropdown-menu/paper-dropdown-menu.js';
7
7
  import '@polymer/paper-listbox/paper-listbox.js';
8
8
  import '@polymer/paper-item/paper-item.js';
9
9
  import '@cwmr/paper-autocomplete/paper-autocomplete';
10
+ import "@jinntec/jinn-codemirror/dist/src/jinn-codemirror";
10
11
 
11
12
  import { cmpVersion } from './utils.js';
12
- import './pb-code-editor.js';
13
-
14
13
  import { get as i18n, translate } from "./pb-i18n.js";
15
14
 
16
15
  /**
@@ -41,6 +40,13 @@ export class PbOddParameterEditor extends LitElement {
41
40
  align-self: center;
42
41
  margin-top: 16px;
43
42
  }
43
+
44
+ .editor label {
45
+ margin-bottom:5px;
46
+ font-size: 12px;
47
+ font-weight: 400;
48
+ color: var(--paper-grey-500);
49
+ }
44
50
  `;
45
51
  }
46
52
 
@@ -51,12 +57,13 @@ export class PbOddParameterEditor extends LitElement {
51
57
  <paper-autocomplete id="combo" text="${this.name}" placeholder="${translate('odd.editor.model.param-name-placeholder')}" label="Name"
52
58
  .source="${this._currentParameters}"></paper-autocomplete>
53
59
 
54
- <pb-code-editor id="editor"
55
- label="Parameter"
60
+ <div class="editor">
61
+ <label>Parameter</label>
62
+ <jinn-codemirror id="editor"
56
63
  mode="xquery"
57
64
  code="${this.value}"
58
- linter="${this.endpoint}/${cmpVersion(this.apiVersion, '1.0.0') ? 'modules/editor.xql' : 'api/lint'}"
59
- apiVersion="${this.apiVersion}"></pb-code-editor>
65
+ linter="${this.endpoint}/${cmpVersion(this.apiVersion, '1.0.0') ? 'modules/editor.xql' : 'api/lint'}"></jinn-codemirror>
66
+ </div>
60
67
  <paper-checkbox id="set" ?checked="${this.setParam}" @change="${this._handleCodeChange}">${translate('odd.editor.model.set-param')}</paper-checkbox>
61
68
  <paper-icon-button @click="${this._delete}" icon="delete" title="delete this parameter"></paper-icon-button>
62
69
  </div>
@@ -165,14 +172,14 @@ export class PbOddParameterEditor extends LitElement {
165
172
  this.requestUpdate();
166
173
 
167
174
  this.shadowRoot.getElementById('combo').addEventListener('focused-changed', this._handleCodeChange.bind(this));
168
- this.shadowRoot.getElementById('editor').addEventListener('code-changed', this._handleCodeChange.bind(this));
175
+ this.shadowRoot.getElementById('editor').addEventListener('update', this._handleCodeChange.bind(this));
169
176
  }
170
177
 
171
178
  refreshEditor() {
172
179
  // console.log('parameters refresh');
173
180
  const editor = this.shadowRoot.getElementById('editor');
174
181
  if (!editor) { return; }
175
- editor.refresh();
182
+ // editor.refresh();
176
183
  }
177
184
 
178
185
 
@@ -193,7 +200,8 @@ export class PbOddParameterEditor extends LitElement {
193
200
 
194
201
  _handleCodeChange(e) {
195
202
  console.log('_handleCodeChange ', e);
196
- this.value = this.shadowRoot.getElementById('editor').getSource();
203
+ this.value = this.shadowRoot.getElementById('editor').content || '';
204
+ console.log('value %s', this.value);
197
205
  this.name = this.shadowRoot.getElementById('combo').text;
198
206
  this.setParam = this.shadowRoot.getElementById('set').checked;
199
207
  this.dispatchEvent(new CustomEvent('parameter-changed', { composed: true, bubbles: true, detail: { name: this.name, value: this.value, set: this.setParam } }));
@@ -7,7 +7,7 @@ import '@polymer/paper-item/paper-item.js';
7
7
  import '@polymer/paper-icon-button/paper-icon-button.js';
8
8
  import '@polymer/iron-icons/iron-icons.js';
9
9
 
10
- import './pb-code-editor.js';
10
+ import "@jinntec/jinn-codemirror/dist/src/jinn-codemirror";
11
11
 
12
12
 
13
13
  /**
@@ -32,6 +32,13 @@ export class PbOddRenditionEditor extends LitElement {
32
32
  margin-bottom:10px;
33
33
  }
34
34
 
35
+ .editor label {
36
+ margin-bottom:5px;
37
+ font-size: 12px;
38
+ font-weight: 400;
39
+ color: var(--paper-grey-500);
40
+ }
41
+
35
42
  paper-dropdown-menu{
36
43
  }
37
44
 
@@ -53,12 +60,15 @@ export class PbOddRenditionEditor extends LitElement {
53
60
  `)}
54
61
  </paper-listbox>
55
62
  </paper-dropdown-menu>
56
- <pb-code-editor
57
- id="editor"
58
- label="Rendition"
59
- code="${this.css}"
60
- mode="css"
61
- @code-changed="${this._handleCodeChange}"></pb-code-editor>
63
+ <div class="editor">
64
+ <label>Rendition</label>
65
+ <jinn-codemirror
66
+ id="editor"
67
+ label="Rendition"
68
+ code="${this.css}"
69
+ mode="css"
70
+ @update="${this._handleCodeChange}"></jinn-codemirror>
71
+ </div>
62
72
  <paper-icon-button @click="${this._remove}" icon="delete" title="delete this rendition"></paper-icon-button>
63
73
  </div>
64
74
 
@@ -113,7 +123,7 @@ export class PbOddRenditionEditor extends LitElement {
113
123
  console.log('refreshEditor');
114
124
  const editor = this.shadowRoot.getElementById('editor');
115
125
  if (!editor) { return; }
116
- editor.refresh();
126
+ // editor.refresh();
117
127
  }
118
128
 
119
129
  _remove(ev) {
@@ -122,7 +132,7 @@ export class PbOddRenditionEditor extends LitElement {
122
132
  }
123
133
 
124
134
  _handleCodeChange() {
125
- this.css = this.shadowRoot.getElementById('editor').getSource();
135
+ this.css = this.shadowRoot.getElementById('editor').value;
126
136
  this.dispatchEvent(new CustomEvent('rendition-changed', { composed: true, bubbles: true, detail: { name: this.name, css: this.css, scope: this.scope } }));
127
137
  }
128
138
 
@@ -1,41 +0,0 @@
1
- /*
2
-
3
- Name: 3024 day
4
- Author: Jan T. Sott (http://github.com/idleberg)
5
-
6
- CodeMirror template by Jan T. Sott (https://github.com/idleberg/base16-codemirror)
7
- Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16)
8
-
9
- */
10
-
11
- .cm-s-3024-day.CodeMirror { background: #f7f7f7; color: #3a3432; }
12
- .cm-s-3024-day div.CodeMirror-selected { background: #d6d5d4; }
13
-
14
- .cm-s-3024-day .CodeMirror-line::selection, .cm-s-3024-day .CodeMirror-line > span::selection, .cm-s-3024-day .CodeMirror-line > span > span::selection { background: #d6d5d4; }
15
- .cm-s-3024-day .CodeMirror-line::-moz-selection, .cm-s-3024-day .CodeMirror-line > span::-moz-selection, .cm-s-3024-day .CodeMirror-line > span > span::selection { background: #d9d9d9; }
16
-
17
- .cm-s-3024-day .CodeMirror-gutters { background: #f7f7f7; border-right: 0px; }
18
- .cm-s-3024-day .CodeMirror-guttermarker { color: #db2d20; }
19
- .cm-s-3024-day .CodeMirror-guttermarker-subtle { color: #807d7c; }
20
- .cm-s-3024-day .CodeMirror-linenumber { color: #807d7c; }
21
-
22
- .cm-s-3024-day .CodeMirror-cursor { border-left: 1px solid #5c5855; }
23
-
24
- .cm-s-3024-day span.cm-comment { color: #cdab53; }
25
- .cm-s-3024-day span.cm-atom { color: #a16a94; }
26
- .cm-s-3024-day span.cm-number { color: #a16a94; }
27
-
28
- .cm-s-3024-day span.cm-property, .cm-s-3024-day span.cm-attribute { color: #01a252; }
29
- .cm-s-3024-day span.cm-keyword { color: #db2d20; }
30
- .cm-s-3024-day span.cm-string { color: #fded02; }
31
-
32
- .cm-s-3024-day span.cm-variable { color: #01a252; }
33
- .cm-s-3024-day span.cm-variable-2 { color: #01a0e4; }
34
- .cm-s-3024-day span.cm-def { color: #e8bbd0; }
35
- .cm-s-3024-day span.cm-bracket { color: #3a3432; }
36
- .cm-s-3024-day span.cm-tag { color: #db2d20; }
37
- .cm-s-3024-day span.cm-link { color: #a16a94; }
38
- .cm-s-3024-day span.cm-error { background: #db2d20; color: #5c5855; }
39
-
40
- .cm-s-3024-day .CodeMirror-activeline-background { background: #e8f2ff; }
41
- .cm-s-3024-day .CodeMirror-matchingbracket { text-decoration: underline; color: #a16a94 !important; }
@@ -1,39 +0,0 @@
1
- /*
2
-
3
- Name: 3024 night
4
- Author: Jan T. Sott (http://github.com/idleberg)
5
-
6
- CodeMirror template by Jan T. Sott (https://github.com/idleberg/base16-codemirror)
7
- Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16)
8
-
9
- */
10
-
11
- .cm-s-3024-night.CodeMirror { background: #090300; color: #d6d5d4; }
12
- .cm-s-3024-night div.CodeMirror-selected { background: #3a3432; }
13
- .cm-s-3024-night .CodeMirror-line::selection, .cm-s-3024-night .CodeMirror-line > span::selection, .cm-s-3024-night .CodeMirror-line > span > span::selection { background: rgba(58, 52, 50, .99); }
14
- .cm-s-3024-night .CodeMirror-line::-moz-selection, .cm-s-3024-night .CodeMirror-line > span::-moz-selection, .cm-s-3024-night .CodeMirror-line > span > span::-moz-selection { background: rgba(58, 52, 50, .99); }
15
- .cm-s-3024-night .CodeMirror-gutters { background: #090300; border-right: 0px; }
16
- .cm-s-3024-night .CodeMirror-guttermarker { color: #db2d20; }
17
- .cm-s-3024-night .CodeMirror-guttermarker-subtle { color: #5c5855; }
18
- .cm-s-3024-night .CodeMirror-linenumber { color: #5c5855; }
19
-
20
- .cm-s-3024-night .CodeMirror-cursor { border-left: 1px solid #807d7c; }
21
-
22
- .cm-s-3024-night span.cm-comment { color: #cdab53; }
23
- .cm-s-3024-night span.cm-atom { color: #a16a94; }
24
- .cm-s-3024-night span.cm-number { color: #a16a94; }
25
-
26
- .cm-s-3024-night span.cm-property, .cm-s-3024-night span.cm-attribute { color: #01a252; }
27
- .cm-s-3024-night span.cm-keyword { color: #db2d20; }
28
- .cm-s-3024-night span.cm-string { color: #fded02; }
29
-
30
- .cm-s-3024-night span.cm-variable { color: #01a252; }
31
- .cm-s-3024-night span.cm-variable-2 { color: #01a0e4; }
32
- .cm-s-3024-night span.cm-def { color: #e8bbd0; }
33
- .cm-s-3024-night span.cm-bracket { color: #d6d5d4; }
34
- .cm-s-3024-night span.cm-tag { color: #db2d20; }
35
- .cm-s-3024-night span.cm-link { color: #a16a94; }
36
- .cm-s-3024-night span.cm-error { background: #db2d20; color: #807d7c; }
37
-
38
- .cm-s-3024-night .CodeMirror-activeline-background { background: #2F2F2F; }
39
- .cm-s-3024-night .CodeMirror-matchingbracket { text-decoration: underline; color: white !important; }
@@ -1,268 +0,0 @@
1
- /*
2
- * abbott.css
3
- * A warm, dark theme for prose and code, with pastels and pretty greens.
4
- *
5
- * Ported from abbott.vim (https://github.com/bcat/abbott.vim) version 2.1.
6
- * Original design and CodeMirror port by Jonathan Rascher.
7
- *
8
- * This theme shares the following color palette with the Vim color scheme.
9
- *
10
- * Brown shades:
11
- * bistre: #231c14
12
- * chocolate: #3c3022
13
- * cocoa: #745d42
14
- * vanilla_cream: #fef3b4
15
- *
16
- * Red shades:
17
- * crimson: #d80450
18
- * cinnabar: #f63f05
19
- *
20
- * Green shades:
21
- * dark_olive: #273900
22
- * forest_green: #24a507
23
- * chartreuse: #a0ea00
24
- * pastel_chartreuse: #d8ff84
25
- *
26
- * Yellow shades:
27
- * marigold: #fbb32f
28
- * lemon_meringue: #fbec5d
29
- *
30
- * Blue shades:
31
- * cornflower_blue: #3f91f1
32
- * periwinkle_blue: #8ccdf0
33
- *
34
- * Magenta shades:
35
- * french_pink: #ec6c99
36
- * lavender: #e6a2f3
37
- *
38
- * Cyan shades:
39
- * zomp: #39a78d
40
- * seafoam_green: #00ff7f
41
- */
42
-
43
- /* Style the UI: */
44
-
45
- /* Equivalent to Vim's Normal group. */
46
- .cm-s-abbott.CodeMirror {
47
- background: #231c14 /* bistre */;
48
- color: #d8ff84 /* pastel_chartreuse */;
49
- }
50
-
51
- /* Roughly equivalent to Vim's LineNr group. */
52
- .cm-s-abbott .CodeMirror-gutters {
53
- background: #231c14 /* bistre */;
54
- border: none;
55
- }
56
- .cm-s-abbott .CodeMirror-linenumber { color: #fbec5d /* lemon_meringue */; }
57
-
58
- .cm-s-abbott .CodeMirror-guttermarker { color: #f63f05 /* cinnabar */; }
59
-
60
- /* Roughly equivalent to Vim's FoldColumn group. */
61
- .cm-s-abbott .CodeMirror-guttermarker-subtle { color: #fbb32f /* marigold */; }
62
-
63
- /*
64
- * Roughly equivalent to Vim's CursorColumn group. (We use a brighter color
65
- * since Vim's cursorcolumn option highlights a whole column, whereas
66
- * CodeMirror's rule just highlights a thin line.)
67
- */
68
- .cm-s-abbott .CodeMirror-ruler { border-color: #745d42 /* cocoa */; }
69
-
70
- /* Equivalent to Vim's Cursor group in insert mode. */
71
- .cm-s-abbott .CodeMirror-cursor { border-color: #a0ea00 /* chartreuse */; }
72
-
73
- /* Equivalent to Vim's Cursor group in normal mode. */
74
- .cm-s-abbott.cm-fat-cursor .CodeMirror-cursor,
75
- .cm-s-abbott .cm-animate-fat-cursor {
76
- /*
77
- * CodeMirror doesn't allow changing the foreground color of the character
78
- * under the cursor, so we can't use a reverse video effect for the cursor.
79
- * Instead, make it semitransparent.
80
- */
81
- background: rgba(160, 234, 0, 0.5) /* chartreuse */;
82
- }
83
- .cm-s-abbott.cm-fat-cursor .CodeMirror-cursors {
84
- /*
85
- * Boost the z-index so the fat cursor shows up on top of text and
86
- * matchingbracket/matchingtag highlights.
87
- */
88
- z-index: 3;
89
- }
90
-
91
- /* Equivalent to Vim's Cursor group in replace mode. */
92
- .cm-s-abbott .CodeMirror-overwrite .CodeMirror-cursor {
93
- border-bottom: 1px solid #a0ea00 /* chartreuse */;
94
- border-left: none;
95
- width: auto;
96
- }
97
-
98
- /* Roughly equivalent to Vim's CursorIM group. */
99
- .cm-s-abbott .CodeMirror-secondarycursor {
100
- border-color: #00ff7f /* seafoam_green */;
101
- }
102
-
103
- /* Roughly equivalent to Vim's Visual group. */
104
- .cm-s-abbott .CodeMirror-selected,
105
- .cm-s-abbott.CodeMirror-focused .CodeMirror-selected {
106
- background: #273900 /* dark_olive */;
107
- }
108
- .cm-s-abbott .CodeMirror-line::selection,
109
- .cm-s-abbott .CodeMirror-line > span::selection,
110
- .cm-s-abbott .CodeMirror-line > span > span::selection {
111
- background: #273900 /* dark_olive */;
112
- }
113
- .cm-s-abbott .CodeMirror-line::-moz-selection,
114
- .cm-s-abbott .CodeMirror-line > span::-moz-selection,
115
- .cm-s-abbott .CodeMirror-line > span > span::-moz-selection {
116
- background: #273900 /* dark_olive */;
117
- }
118
-
119
- /* Roughly equivalent to Vim's SpecialKey group. */
120
- .cm-s-abbott .cm-tab { color: #00ff7f /* seafoam_green */; }
121
-
122
- /* Equivalent to Vim's Search group. */
123
- .cm-s-abbott .cm-searching {
124
- background: #fef3b4 /* vanilla_cream */ !important;
125
- color: #231c14 /* bistre */ !important;
126
- }
127
-
128
- /* Style syntax highlighting modes: */
129
-
130
- /* Equivalent to Vim's Comment group. */
131
- .cm-s-abbott span.cm-comment {
132
- color: #fbb32f /* marigold */;
133
- font-style: italic;
134
- }
135
-
136
- /* Equivalent to Vim's String group. */
137
- .cm-s-abbott span.cm-string,
138
- .cm-s-abbott span.cm-string-2 {
139
- color: #e6a2f3 /* lavender */;
140
- }
141
-
142
- /* Equivalent to Vim's Constant group. */
143
- .cm-s-abbott span.cm-number,
144
- .cm-s-abbott span.cm-string.cm-url { color: #f63f05 /* cinnabar */; }
145
-
146
- /* Roughly equivalent to Vim's SpecialKey group. */
147
- .cm-s-abbott span.cm-invalidchar { color: #00ff7f /* seafoam_green */; }
148
-
149
- /* Equivalent to Vim's Special group. */
150
- .cm-s-abbott span.cm-atom { color: #fef3b4 /* vanilla_cream */; }
151
-
152
- /* Equivalent to Vim's Delimiter group. */
153
- .cm-s-abbott span.cm-bracket,
154
- .cm-s-abbott span.cm-punctuation {
155
- color: #fef3b4 /* vanilla_cream */;
156
- }
157
-
158
- /* Equivalent Vim's Operator group. */
159
- .cm-s-abbott span.cm-operator { font-weight: bold; }
160
-
161
- /* Roughly equivalent to Vim's Identifier group. */
162
- .cm-s-abbott span.cm-def,
163
- .cm-s-abbott span.cm-variable,
164
- .cm-s-abbott span.cm-variable-2,
165
- .cm-s-abbott span.cm-variable-3 {
166
- color: #8ccdf0 /* periwinkle_blue */;
167
- }
168
-
169
- /* Roughly equivalent to Vim's Function group. */
170
- .cm-s-abbott span.cm-builtin,
171
- .cm-s-abbott span.cm-property,
172
- .cm-s-abbott span.cm-qualifier {
173
- color: #3f91f1 /* cornflower_blue */;
174
- }
175
-
176
- /* Equivalent to Vim's Type group. */
177
- .cm-s-abbott span.cm-type { color: #24a507 /* forest_green */; }
178
-
179
- /* Equivalent to Vim's Keyword group. */
180
- .cm-s-abbott span.cm-keyword {
181
- color: #d80450 /* crimson */;
182
- font-weight: bold;
183
- }
184
-
185
- /* Equivalent to Vim's PreProc group. */
186
- .cm-s-abbott span.cm-meta { color: #ec6c99 /* french_pink */; }
187
-
188
- /* Equivalent to Vim's htmlTagName group (linked to Statement). */
189
- .cm-s-abbott span.cm-tag {
190
- color: #d80450 /* crimson */;
191
- font-weight: bold;
192
- }
193
-
194
- /* Equivalent to Vim's htmlArg group (linked to Type). */
195
- .cm-s-abbott span.cm-attribute { color: #24a507 /* forest_green */; }
196
-
197
- /* Equivalent to Vim's htmlH1, markdownH1, etc. groups (linked to Title). */
198
- .cm-s-abbott span.cm-header {
199
- color: #d80450 /* crimson */;
200
- font-weight: bold;
201
- }
202
-
203
- /* Equivalent to Vim's markdownRule group (linked to PreProc). */
204
- .cm-s-abbott span.cm-hr { color: #ec6c99 /* french_pink */; }
205
-
206
- /* Roughly equivalent to Vim's Underlined group. */
207
- .cm-s-abbott span.cm-link { color: #e6a2f3 /* lavender */; }
208
-
209
- /* Equivalent to Vim's diffRemoved group. */
210
- .cm-s-abbott span.cm-negative {
211
- background: #d80450 /* crimson */;
212
- color: #231c14 /* bistre */;
213
- }
214
-
215
- /* Equivalent to Vim's diffAdded group. */
216
- .cm-s-abbott span.cm-positive {
217
- background: #a0ea00 /* chartreuse */;
218
- color: #231c14 /* bistre */;
219
- font-weight: bold;
220
- }
221
-
222
- /* Equivalent to Vim's Error group. */
223
- .cm-s-abbott span.cm-error {
224
- background: #d80450 /* crimson */;
225
- color: #231c14 /* bistre */;
226
- }
227
-
228
- /* Style addons: */
229
-
230
- /* Equivalent to Vim's MatchParen group. */
231
- .cm-s-abbott span.CodeMirror-matchingbracket {
232
- background: #745d42 /* cocoa */ !important;
233
- color: #231c14 /* bistre */ !important;
234
- font-weight: bold;
235
- }
236
-
237
- /*
238
- * Roughly equivalent to Vim's Error group. (Vim doesn't seem to have a direct
239
- * equivalent in its own matchparen plugin, but many syntax highlighting plugins
240
- * mark mismatched brackets as Error.)
241
- */
242
- .cm-s-abbott span.CodeMirror-nonmatchingbracket {
243
- background: #d80450 /* crimson */ !important;
244
- color: #231c14 /* bistre */ !important;
245
- }
246
-
247
- .cm-s-abbott .CodeMirror-matchingtag,
248
- .cm-s-abbott .cm-matchhighlight {
249
- outline: 1px solid #39a78d /* zomp */;
250
- }
251
-
252
- /* Equivalent to Vim's CursorLine group. */
253
- .cm-s-abbott .CodeMirror-activeline-background,
254
- .cm-s-abbott .CodeMirror-activeline-gutter {
255
- background: #3c3022 /* chocolate */;
256
- }
257
-
258
- /* Equivalent to Vim's CursorLineNr group. */
259
- .cm-s-abbott .CodeMirror-activeline-gutter .CodeMirror-linenumber {
260
- color: #d8ff84 /* pastel_chartreuse */;
261
- font-weight: bold;
262
- }
263
-
264
- /* Roughly equivalent to Vim's Folded group. */
265
- .cm-s-abbott .CodeMirror-foldmarker {
266
- color: #f63f05 /* cinnabar */;
267
- text-shadow: none;
268
- }
@@ -1,32 +0,0 @@
1
- .cm-s-abcdef.CodeMirror { background: #0f0f0f; color: #defdef; }
2
- .cm-s-abcdef div.CodeMirror-selected { background: #515151; }
3
- .cm-s-abcdef .CodeMirror-line::selection, .cm-s-abcdef .CodeMirror-line > span::selection, .cm-s-abcdef .CodeMirror-line > span > span::selection { background: rgba(56, 56, 56, 0.99); }
4
- .cm-s-abcdef .CodeMirror-line::-moz-selection, .cm-s-abcdef .CodeMirror-line > span::-moz-selection, .cm-s-abcdef .CodeMirror-line > span > span::-moz-selection { background: rgba(56, 56, 56, 0.99); }
5
- .cm-s-abcdef .CodeMirror-gutters { background: #555; border-right: 2px solid #314151; }
6
- .cm-s-abcdef .CodeMirror-guttermarker { color: #222; }
7
- .cm-s-abcdef .CodeMirror-guttermarker-subtle { color: azure; }
8
- .cm-s-abcdef .CodeMirror-linenumber { color: #FFFFFF; }
9
- .cm-s-abcdef .CodeMirror-cursor { border-left: 1px solid #00FF00; }
10
-
11
- .cm-s-abcdef span.cm-keyword { color: darkgoldenrod; font-weight: bold; }
12
- .cm-s-abcdef span.cm-atom { color: #77F; }
13
- .cm-s-abcdef span.cm-number { color: violet; }
14
- .cm-s-abcdef span.cm-def { color: #fffabc; }
15
- .cm-s-abcdef span.cm-variable { color: #abcdef; }
16
- .cm-s-abcdef span.cm-variable-2 { color: #cacbcc; }
17
- .cm-s-abcdef span.cm-variable-3, .cm-s-abcdef span.cm-type { color: #def; }
18
- .cm-s-abcdef span.cm-property { color: #fedcba; }
19
- .cm-s-abcdef span.cm-operator { color: #ff0; }
20
- .cm-s-abcdef span.cm-comment { color: #7a7b7c; font-style: italic;}
21
- .cm-s-abcdef span.cm-string { color: #2b4; }
22
- .cm-s-abcdef span.cm-meta { color: #C9F; }
23
- .cm-s-abcdef span.cm-qualifier { color: #FFF700; }
24
- .cm-s-abcdef span.cm-builtin { color: #30aabc; }
25
- .cm-s-abcdef span.cm-bracket { color: #8a8a8a; }
26
- .cm-s-abcdef span.cm-tag { color: #FFDD44; }
27
- .cm-s-abcdef span.cm-attribute { color: #DDFF00; }
28
- .cm-s-abcdef span.cm-error { color: #FF0000; }
29
- .cm-s-abcdef span.cm-header { color: aquamarine; font-weight: bold; }
30
- .cm-s-abcdef span.cm-link { color: blueviolet; }
31
-
32
- .cm-s-abcdef .CodeMirror-activeline-background { background: #314151; }
@@ -1,5 +0,0 @@
1
- .cm-s-ambiance.CodeMirror {
2
- -webkit-box-shadow: none;
3
- -moz-box-shadow: none;
4
- box-shadow: none;
5
- }