updated styling

fixed merge request text not always appearing

app/assets/javascripts/ide/components/editor_mode_dropdown.vue

@@ -30,7 +30,6 @@ export default {
 <template>
   <div
     class="dropdown"
-    style="margin-left:auto;"
   >
     <button
       type="button"

app/assets/javascripts/ide/components/ide_review.vue

@@ -13,7 +13,9 @@ export default {
     ...mapState(['viewer']),
   },
   mounted() {
-    this.updateViewer(this.currentMergeRequest ? 'mrdiff' : 'diff');
+    this.$nextTick(() => {
+      this.updateViewer(this.currentMergeRequest ? 'mrdiff' : 'diff');
+    });
   },
   methods: {
     ...mapActions(['updateViewer']),
@@ -51,11 +53,3 @@ export default {
     </template>
   </ide-tree-list>
 </template>
-
-<style>
-.ide-review-button-holder {
-  display: flex;
-  width: 100%;
-  align-items: center;
-}
-</style>

app/assets/javascripts/ide/ide_router.js

@@ -102,14 +102,14 @@ router.beforeEach((to, from, next) => {
               throw e;
             });
         } else if (to.params.mrid) {
-          store.dispatch('updateActivityBarView', activityBarViews.review);
-
           store
             .dispatch('getMergeRequestData', {
               projectId: fullProjectId,
               mergeRequestId: to.params.mrid,
             })
             .then(mr => {
+              store.dispatch('updateActivityBarView', activityBarViews.review);
+
               store.dispatch('getBranchData', {
                 projectId: fullProjectId,
                 branchId: mr.source_branch,

app/assets/stylesheets/pages/repo.scss

@@ -972,6 +972,14 @@
 .ide-review-header {
   flex-direction: column;
   align-items: flex-start;
+
+  .dropdown {
+    margin-left: auto;
+  }
+
+  a {
+    color: $gl-link-color;
+  }
 }
 
 .ide-review-sub-header {
@@ -981,3 +989,9 @@
 .ide-new-modal-label {
   line-height: 34px;
 }
+
+.ide-review-button-holder {
+  display: flex;
+  width: 100%;
+  align-items: center;
+}