show sublime bookmarks

edit/codemirror-default.css

@@ -18,6 +18,12 @@
   outline: -webkit-focus-ring-color auto 5px;
   outline-offset: -2px;
 }
+.CodeMirror-bookmark {
+  background: linear-gradient(to right, currentColor, transparent);
+  position: absolute;
+  width: 2em;
+  opacity: .5;
+}
 @supports (-moz-appearance:none) {
   /* restrict to FF */
   .CodeMirror-focused {

edit/codemirror-default.js

@@ -8,6 +8,8 @@
     prefs.reset('editor.keyMap');
   }
 
+  const CM_BOOKMARK = 'CodeMirror-bookmark';
+  const CM_BOOKMARK_GUTTER = CM_BOOKMARK + 'gutter';
   const defaults = {
     autoCloseBrackets: prefs.get('editor.autoCloseBrackets'),
     mode: 'css',
@@ -15,6 +17,7 @@
     lineWrapping: prefs.get('editor.lineWrapping'),
     foldGutter: true,
     gutters: [
+      CM_BOOKMARK_GUTTER,
       'CodeMirror-linenumbers',
       'CodeMirror-foldgutter',
       ...(prefs.get('editor.linter') ? ['CodeMirror-lint-markers'] : []),
@@ -242,6 +245,28 @@
     CodeMirror.commands[name] = (...args) => editor[name](...args);
   }
 
+  const elBookmark = document.createElement('div');
+  elBookmark.className = CM_BOOKMARK;
+  elBookmark.textContent = '\u00A0';
+  const clearMarker = function () {
+    const line = this.lines[0];
+    CodeMirror.TextMarker.prototype.clear.apply(this);
+    if (!line.markedSpans.some(span => span.marker.sublimeBookmark)) {
+      this.doc.setGutterMarker(line, CM_BOOKMARK_GUTTER, null);
+    }
+  };
+  const {markText} = CodeMirror.prototype;
+  Object.assign(CodeMirror.prototype, {
+    markText() {
+      const marker = markText.apply(this, arguments);
+      if (marker.sublimeBookmark) {
+        this.doc.setGutterMarker(marker.lines[0], CM_BOOKMARK_GUTTER, elBookmark.cloneNode(true));
+        marker.clear = clearMarker;
+      }
+      return marker;
+    },
+  });
+
   // CodeMirror convenience commands
   Object.assign(CodeMirror.commands, {
     toggleEditorFocus,