fix(code/frontend): folding icon position when line hilighted (elasti…

…c#45865)
alexwizp · Sep 19, 2019 · 87e5b45 · 87e5b45
1 parent 8068bbd
commit 87e5b45
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 5 deletions.
diff --git a/x-pack/legacy/plugins/code/public/components/editor/editor.tsx b/x-pack/legacy/plugins/code/public/components/editor/editor.tsx
@@ -133,16 +133,16 @@ export class EditorComponent extends React.Component<IProps> {
     if (this.monaco && qs !== prevProps.location.search) {
       this.monaco.updateUrlQuery(qs);
     }
-    if (this.monaco && this.monaco.editor) {
+    if (this.editor) {
       if (prevProps.showBlame !== this.props.showBlame && this.props.showBlame) {
-        this.monaco.editor.updateOptions({ lineDecorationsWidth: 316 });
+        this.editor.updateOptions({ lineDecorationsWidth: 316 });
         this.loadBlame(this.props.blames);
       } else if (!this.props.showBlame) {
         this.destroyBlameWidgets();
-        this.monaco.editor.updateOptions({ lineDecorationsWidth: 16 });
+        this.editor.updateOptions({ lineDecorationsWidth: 16 });
       }
       if (prevProps.blames !== this.props.blames && this.props.showBlame) {
-        this.monaco.editor.updateOptions({ lineDecorationsWidth: 316 });
+        this.editor.updateOptions({ lineDecorationsWidth: 316 });
         this.loadBlame(this.props.blames);
       }
     }
@@ -220,6 +220,10 @@ export class EditorComponent extends React.Component<IProps> {
         lang = 'text';
       }
       this.editor = await this.monaco.loadFile(repo, file, text, lang, revision);
+      if (this.props.showBlame) {
+        this.editor.updateOptions({ lineDecorationsWidth: 316 });
+        this.loadBlame(this.props.blames);
+      }
       this.registerGutterClickHandler();
     }
   }

diff --git a/x-pack/legacy/plugins/code/public/monaco/override_monaco_styles.scss b/x-pack/legacy/plugins/code/public/monaco/override_monaco_styles.scss
@@ -12,7 +12,8 @@
     background-color: $euiColorLightestShade;
   }
 
-  .code-line-decoration + .cldr.folding {
+  .cldr.code-mark-line-number + .cldr.folding,
+  .cldr.code-line-decoration + .cldr.folding {
     left: -124px !important;
     opacity: 1;
   }