moved styles out of the component

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

@@ -49,7 +49,7 @@ export default {
         </div>
       </template>
       <template v-else>
-        <div class="context-header">
+        <div class="context-header ide-context-header">
           <a
             :href="currentProject.web_url"
           >
@@ -76,7 +76,6 @@ export default {
                 {{ currentProject.name }}
               </div>
               <div
-                v-if="currentBranchId !== ''"
                 class="sidebar-context-title ide-sidebar-branch-title"
               >
                 <icon
@@ -96,15 +95,3 @@ export default {
     </div>
   </resizable-panel>
 </template>
-
-<style>
-.ide-sidebar-branch-title {
-  font-weight: normal;
-}
-
-.ide-sidebar-branch-title svg {
-  position: relative;
-  top: 3px;
-  margin-top: -1px;
-}
-</style>

app/assets/javascripts/ide/ide_router.js

@@ -63,7 +63,7 @@ router.beforeEach((to, from, next) => {
         const fullProjectId = `${to.params.namespace}/${to.params.project}`;
 
         if (to.params.branch) {
-          store.commit('SET_CURRENT_BRANCH', to.params.branch);
+          store.dispatch('setCurrentBranchId', to.params.branch);
 
           store.dispatch('getBranchData', {
             projectId: fullProjectId,

app/assets/javascripts/ide/stores/actions.js

@@ -120,6 +120,10 @@ export const setEmptyStateSvgs = ({ commit }, svgs) => {
   commit(types.SET_EMPTY_STATE_SVGS, svgs);
 };
 
+export const setCurrentBranchId = ({ commit }, currentBranchId) => {
+  commit(types.SET_CURRENT_BRANCH, currentBranchId);
+};
+
 export * from './actions/tree';
 export * from './actions/file';
 export * from './actions/project';

app/assets/stylesheets/framework/gitlab_theme.scss

@@ -196,6 +196,10 @@
       box-shadow: inset 3px 0 $color-700;
     }
   }
+
+  .ide-context-header a {
+    color: $color-700;
+  }
 }
 
 body {

app/assets/stylesheets/pages/repo.scss

@@ -895,3 +895,13 @@
     margin-left: auto;
   }
 }
+
+.ide-sidebar-branch-title {
+  font-weight: $gl-font-weight-normal;
+
+  svg {
+    position: relative;
+    top: 3px;
+    margin-top: -1px;
+  }
+}