diff --git a/frontend/cypress/tests/codeView/codeView_codeHighlighting.cy.js b/frontend/cypress/tests/codeView/codeView_codeHighlighting.cy.js
index adbd9c338c..727478e8f0 100644
--- a/frontend/cypress/tests/codeView/codeView_codeHighlighting.cy.js
+++ b/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')
diff --git a/frontend/src/components/c-segment.vue b/frontend/src/components/c-segment.vue
index 9533d9e08e..0fcec1a4be 100644
--- a/frontend/src/components/c-segment.vue
+++ b/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';