1 files changed, 62 insertions, 56 deletions
diff --git a/app/assets/javascripts/ide/components/repo_preview.vue b/app/assets/javascripts/ide/components/repo_preview.vue
index 3d1e0297bd5..e47270a9855 100644
--- a/app/assets/javascripts/ide/components/repo_preview.vue
+++ b/app/assets/javascripts/ide/components/repo_preview.vue
@@ -1,65 +1,71 @@
 <script>
-import { mapGetters } from 'vuex';
-import LineHighlighter from '../../line_highlighter';
-import syntaxHighlight from '../../syntax_highlight';
+  import { mapGetters } from 'vuex';
+  import LineHighlighter from '../../line_highlighter';
+  import syntaxHighlight from '../../syntax_highlight';
 
-export default {
-  computed: {
-    ...mapGetters([
-      'activeFile',
-    ]),
-    renderErrorTooLarge() {
-      return this.activeFile.renderError === 'too_large';
+  export default {
+    computed: {
+      ...mapGetters([
+        'activeFile',
+      ]),
+      renderErrorTooLarge() {
+        return this.activeFile.renderError === 'too_large';
+      },
     },
-  },
-  methods: {
-    highlightFile() {
-      syntaxHighlight($(this.$el).find('.file-content'));
-    },
-  },
-  mounted() {
-    this.highlightFile();
-    this.lineHighlighter = new LineHighlighter({
-      fileHolderSelector: '.blob-viewer-container',
-      scrollFileHolder: true,
-    });
-  },
-  updated() {
-    this.$nextTick(() => {
+    mounted() {
       this.highlightFile();
-    });
-  },
-};
+      this.lineHighlighter = new LineHighlighter({
+        fileHolderSelector: '.blob-viewer-container',
+        scrollFileHolder: true,
+      });
+    },
+    updated() {
+      this.$nextTick(() => {
+        this.highlightFile();
+      });
+    },
+    methods: {
+      highlightFile() {
+        syntaxHighlight($(this.$el).find('.file-content'));
+      },
+    },
+  };
 </script>
 
 <template>
-<div>
-  <div
-    v-if="!activeFile.renderError"
-    v-html="activeFile.html"
-    class="multi-file-preview-holder"
-  >
-  </div>
-  <div
-    v-else-if="activeFile.tempFile"
-    class="vertical-center render-error">
-    <p class="text-center">
-      The source could not be displayed for this temporary file.
-    </p>
-  </div>
-  <div
-    v-else-if="renderErrorTooLarge"
-    class="vertical-center render-error">
-    <p class="text-center">
-      The source could not be displayed because it is too large. You can <a :href="activeFile.rawPath" download>download</a> it instead.
-    </p>
-  </div>
-  <div
-    v-else
-    class="vertical-center render-error">
-    <p class="text-center">
-      The source could not be displayed because a rendering error occurred. You can <a :href="activeFile.rawPath" download>download</a> it instead.
-    </p>
+  <div>
+    <div
+      v-if="!activeFile.renderError"
+      v-html="activeFile.html"
+      class="multi-file-preview-holder"
+    >
+    </div>
+    <div
+      v-else-if="activeFile.tempFile"
+      class="vertical-center render-error">
+      <p class="text-center">
+        The source could not be displayed for this temporary file.
+      </p>
+    </div>
+    <div
+      v-else-if="renderErrorTooLarge"
+      class="vertical-center render-error">
+      <p class="text-center">
+        The source could not be displayed because it is too large.
+        You can <a
+          :href="activeFile.rawPath"
+          download>download</a> it instead.
+      </p>
+    </div>
+    <div
+      v-else
+      class="vertical-center render-error">
+      <p class="text-center">
+        The source could not be displayed because a rendering error occurred.
+        You can <a
+          :href="activeFile.rawPath"
+          download>download</a> it instead.
+      </p>
+    </div>
   </div>
-</div>
 </template>