[#2184] Fix Inconsistent Line Number Colours (#2185)

Fix Inconsistent Line Number Colours

A regression has occurred where the line numbers no longer have a
consistent grey color.

Let's fix the bug and add a test to catch further regressions of the
same nature.

frontend/cypress/tests/codeView/codeView_codeHighlighting.cy.js

@@ -1,5 +1,30 @@
 // Assumes: RepoSense repo from 03/05/2018 to current date
 describe('code highlighting works properly', () => {
+  it('line numbers should all have the same colour', () => {
+    cy.get('.icon-button.fa-code')
+      .should('exist')
+      .first()
+      .click();
+
+    cy.get('#tab-authorship .files', { timeout: 90000 })
+      .should('be.visible');
+
+    cy.get('.line-number') // this is just a wrapper
+      .first()
+      .children()
+      // The actual line number element. We can't name the class
+      // because it's generated by the code highlighter.
+      .first()
+      .should('have.css', 'color')
+      .then((firstColor) => {
+        cy.get('.line-number')
+          .each((el) => cy.wrap(el)
+            .children()
+            .first()
+            .should('have.css', 'color', firstColor));
+      });
+  });
+
   it('should highlight code when there is a single author', () => {
     // open the code panel
     cy.get('.icon-button.fa-code')

frontend/src/components/c-segment.vue

@@ -73,7 +73,7 @@ export default defineComponent({
 });
 </script>
 
-<style lang="scss" scoped>
+<style lang="scss">
 @import '../styles/hightlight-js-style.css';
 @import '../styles/_colors.scss';