Merge into staging

__tests__/components/Breadcrumb.test.js

@@ -21,7 +21,7 @@ describe('BreadCrumb', () => {
       <Breadcrumb
         id="breadcrumbID"
         items={[{ text: 'Canada.ca', link: '/' }]}
-        refPageAA='dashboard'
+        refPageAA="dashboard"
       />,
     )
     expect(primary).toBeTruthy()
@@ -37,7 +37,7 @@ describe('BreadCrumb', () => {
           { text: 'Link2', link: '/' },
           { text: 'Link3', link: '/' },
         ]}
-        refPageAA='dashboard'
+        refPageAA="dashboard"
       />,
     )
     expect(withItems).toBeTruthy()
@@ -54,7 +54,7 @@ describe('BreadCrumb', () => {
           { text: 'Max length of breadcrumb 28', link: '/' },
           { text: 'Link3', link: '/' },
         ]}
-        refPageAA='dashboard'
+        refPageAA="dashboard"
       />,
     )
     expect(withItemsWithLongText).toBeTruthy()
@@ -65,7 +65,7 @@ describe('BreadCrumb', () => {
       <Breadcrumb
         id="breadcrumbID"
         items={[{ text: 'Canada.ca', link: '/' }]}
-      refPageAA='dashboard'
+        refPageAA="dashboard"
       />,
     )
     const results = await axe(container)

__tests__/components/Header.test.js

@@ -62,7 +62,7 @@ describe('Header', () => {
       { text: 'Max length of breadcrumb 28', link: '/' },
       { text: 'Link3', link: '/' },
     ],
-    refPageAA: 'dashboard'
+    refPageAA: 'dashboard',
   }
   test('renders Header component with default props', () => {
     render(<Header {...defaultProps} />)

components/ContextualAlert.tsx

@@ -54,7 +54,7 @@ const ContextualAlert = ({
     >
       <div
         data-testid="alert-icon"
-        className="absolute left-1.5 top-3 bg-white  py-1 sm:left-3.5"
+        className="absolute left-1.5 top-3 bg-white py-1 sm:left-3.5"
       >
         <Image
           src={alert_type}

pages/contact-us/[id].tsx

@@ -1,7 +1,6 @@
 import { Fragment } from 'react'
 import TableContents from '../../components/TableContents'
 import Heading from '../../components/Heading'
-
 import { ContactSection } from '../../components/contact/ContactSection'
 import { ContactProvince } from '../../components/contact/ContactProvince'
 import { getAuthModalsContent } from '../../graphql/mappers/auth-modals'

pages/maintenance.tsx

@@ -33,22 +33,22 @@ const Maintenance = (props: MaintenanceProps) => {
           id={'pageHead-maintenance'}
           title={language.maintenanceTitle}
         />
-        <p className="text-20px text-gray-darker mt-2">
+        <p className="mt-2 text-20px text-gray-darker">
           {language.maintenanceText}
         </p>
         <br />
-        <p className="font-bold text-gray-darker sm:text-black text-[20px]">
+        <p className="text-[20px] font-bold text-gray-darker sm:text-black">
           {language.errorPageNextText}
         </p>
         <h2 className="sr-only">{language.errorPageNextText}</h2>
         <ul id={'maintenace-next-list'}>
-          <li className={'text-20px text-gray-darker pl-3'}>
+          <li className={'pl-3 text-20px text-gray-darker'}>
             {language.error503TextLink}
           </li>
-          <li className="text-20px text-gray-darker pl-3">
+          <li className="pl-3 text-20px text-gray-darker">
             {language.errorTextLinkCommon}
             <Link
-              className="underline text-deep-blue-dark font-body text-20px hover:text-blue-hover focus:text-blue-hover"
+              className="font-body text-20px text-deep-blue-dark underline hover:text-blue-hover focus:text-blue-hover"
               id="accountpage-maintenance"
               href={
                 props.locale === 'en'