Merged in feat/SW-196-design-fixes (pull request #547)

Feat/SW-196 design fixes

* feat(SW-196): Updated copy My credit cards -> My payment cards

* fix: update design system version

* feat(SW-196): Update Header component to use Preamble instead of Subtitle

* feat(SW-196): Minor design fixes


Approved-by: Christel Westerberg

components/Section/Header/header.module.css

@@ -6,7 +6,7 @@
 }
 
 .title,
-.subtitle {
+.preamble {
   grid-column: 1 / -1;
 }
 
@@ -19,7 +19,7 @@
     grid-column: 1 / 2;
   }
 
-  .subtitle {
+  .preamble {
     grid-column: 1 / 2;
   }
 }

components/Section/Header/index.tsx

@@ -1,4 +1,4 @@
-import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
+import Preamble from "@/components/TempDesignSystem/Text/Preamble"
 import Title from "@/components/TempDesignSystem/Text/Title"
 
 import SectionLink from "../Link"
@@ -9,7 +9,7 @@ import type { HeaderProps } from "@/types/components/myPages/header"
 
 export default function SectionHeader({
   link,
-  subtitle,
+  preamble,
   title,
   topTitle = false,
   textTransform,
@@ -24,7 +24,7 @@ export default function SectionHeader({
       >
         {title}
       </Title>
-      {subtitle && <Subtitle className={styles.subtitle}>{subtitle}</Subtitle>}
+      {preamble && <Preamble className={styles.preamble}>{preamble}</Preamble>}
       <SectionLink link={link} variant="desktop" />
     </header>
   )