refactor: replace .fluid-heading-05 with h4.fluid

bcgov · Jan 2, 2024 · c169329 · c169329
1 parent 501cdac
commit c169329
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 14 deletions.
diff --git a/frontend/cypress/e2e/FormBCSCPage.cy.ts b/frontend/cypress/e2e/FormBCSCPage.cy.ts
@@ -61,7 +61,7 @@ describe("BCSC Form", () => {
     cy.get('[data-test="wizard-submit-button"]')
     .click();
 
-    cy.get('.fluid-heading-05').should('contain', 'Application submitted!');
+    cy.get('h4.fluid').should('contain', 'Application submitted!');
   });
 
   it("should add a new contact", () => {
@@ -125,7 +125,7 @@ describe("BCSC Form", () => {
     cy.get('[data-test="wizard-submit-button"]')
     .click();
 
-    cy.get('.fluid-heading-05').should('contain', 'Application submitted!');
+    cy.get('h4.fluid').should('contain', 'Application submitted!');
 
   });
 
@@ -196,7 +196,7 @@ describe("BCSC Form", () => {
     cy.get('[data-test="wizard-submit-button"]')
     .click();
 
-    cy.get('.fluid-heading-05').should('contain', 'Application submitted!');
+    cy.get('h4.fluid').should('contain', 'Application submitted!');
   });
 
 

diff --git a/frontend/src/assets/styles/global.scss b/frontend/src/assets/styles/global.scss
@@ -471,11 +471,11 @@ h3 {
   line-height: 2.5rem;
 }
 
-.fluid-heading-05 {
+h4.fluid {
   align-self: stretch;
   color: var(--light-theme-text-text-primary, #131315);
 
-  /* Fluid styles/MAX/fluid-heading-05 */
+  /* Fluid styles/MAX/fluid-heading-04 */
 
   font-size: 3.75rem;
   font-style: normal;
@@ -1404,8 +1404,8 @@ Useful for scrolling to the *start* of an HTML element without having it covered
     align-items: flex-start;
   }
 
-  .fluid-heading-05 {
-    /* Fluid styles/SM/fluid-heading-05 */
+  h4.fluid {
+    /* Fluid styles/SM/fluid-heading-04 */
     font-size: 2rem;
     line-height: 2.5rem;
   }
@@ -1515,8 +1515,8 @@ Useful for scrolling to the *start* of an HTML element without having it covered
     align-items: flex-start;
   }
 
-  .fluid-heading-05 {
-    /* Fluid styles/MED/fluid-heading-05 */
+  h4.fluid {
+    /* Fluid styles/MED/fluid-heading-04 */
     font-size: 2.25rem;
     line-height: 2.75rem;
   }
@@ -1606,8 +1606,8 @@ Useful for scrolling to the *start* of an HTML element without having it covered
     column-gap: 4.0625rem;
   }
 
-  .fluid-heading-05 {
-    /* Fluid styles/MED/fluid-heading-05 */
+  h4.fluid {
+    /* Fluid styles/MED/fluid-heading-04 */
     font-size: 2.25rem;
     line-height: 2.75rem;
   }
@@ -1673,8 +1673,8 @@ Useful for scrolling to the *start* of an HTML element without having it covered
     column-gap: 3.3125rem;
   }
 
-  .fluid-heading-05 {
-    /* Fluid styles/XLG/fluid-heading-05 */
+  h4.fluid {
+    /* Fluid styles/XLG/fluid-heading-04 */
     font-size: 3rem;
     line-height: 56px;
   }

diff --git a/frontend/src/pages/FormSubmittedPage.vue b/frontend/src/pages/FormSubmittedPage.vue
@@ -19,7 +19,7 @@ const SVG = useSvg(badgePictogram);
   <div class="frame-03">
     <SVG alt="Badge pictogram" class="submission-badge"></SVG>    
     <div class="form-header form-header-application-submitted">
-      <p class="fluid-heading-05">Application submitted!</p>
+      <h4 class="fluid">Application submitted!</h4>
       <p class="fluid-paragraph-01">Your application for a client number has been submitted.</p>
       <p class="fluid-paragraph-01">&nbsp;</p>
       <p class="fluid-paragraph-01">