Update branch name to use monospace

Changelog: changed
EE: true

ee/app/assets/javascripts/approvals/components/rule_branches.vue

@@ -22,5 +22,5 @@ export default {
 </script>
 
 <template>
-  <div :class="{ monospace: isAllBranches }">{{ branchName }}</div>
+  <div :class="{ monospace: !isAllBranches }">{{ branchName }}</div>
 </template>

ee/app/assets/javascripts/status_checks/components/branch.vue

@@ -21,5 +21,5 @@ export default {
 </script>
 
 <template>
-  <span :class="{ monospace: isAllBranches }">{{ branchName }}</span>
+  <span :class="{ monospace: !isAllBranches }">{{ branchName }}</span>
 </template>

ee/spec/frontend/approvals/components/rule_branches_spec.js

@@ -27,7 +27,7 @@ describe('Rule Branches', () => {
   it('displays "All branches" if there are no protected branches', () => {
     createComponent();
     expect(findBranch().text()).toContain('All branches');
-    expect(findBranch().classes('monospace')).toBe(true);
+    expect(findBranch().classes('monospace')).toBe(false);
   });
 
   it('displays the branch name of the first protected branch', () => {
@@ -50,6 +50,6 @@ describe('Rule Branches', () => {
 
     expect(findBranch().text()).toContain('main');
     expect(findBranch().text()).not.toContain('hello');
-    expect(findBranch().classes('monospace')).toBe(false);
+    expect(findBranch().classes('monospace')).toBe(true);
   });
 });

ee/spec/frontend/status_checks/components/branch_spec.js

@@ -20,13 +20,13 @@ describe('Status checks branch', () => {
     createWrapper();
 
     expect(findBranch().text()).toBe('All branches');
-    expect(findBranch().classes('monospace')).toBe(true);
+    expect(findBranch().classes('monospace')).toBe(false);
   });
 
   it('renders the first branch name when branches are given', () => {
     createWrapper({ branches: [{ name: 'Foo' }, { name: 'Bar' }] });
 
     expect(findBranch().text()).toBe('Foo');
-    expect(findBranch().classes('monospace')).toBe(false);
+    expect(findBranch().classes('monospace')).toBe(true);
   });
 });