Merged in chore/BOOK-708-replace-title-component (pull request #3414)

Chore/BOOK-708 replace title component

* chore(BOOK-708): replace title with typography

* chore(BOOK-708): replace title with typography

* chore(BOOK-708): remove Title from package.json


Approved-by: Linus Flood
Approved-by: Anton Gunnarsson

apps/scandic-web/components/SasTierComparison/index.tsx

@@ -6,7 +6,6 @@ import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
 import { JsonToHtml } from "@scandic-hotels/design-system/JsonToHtml"
 import { OldDSButton as Button } from "@scandic-hotels/design-system/OldDSButton"
 import Link from "@scandic-hotels/design-system/OldDSLink"
-import Title from "@scandic-hotels/design-system/Title"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import { Section } from "@/components/Section"
@@ -31,9 +30,9 @@ export function SasTierComparison({
   return (
     <Section className={styles.comparisonSection}>
       <div className={styles.header}>
-        <Title level="h2" textAlign="center">
-          {title}
-        </Title>
+        <Typography variant="Title/md" className={styles.title}>
+          <h2>{title}</h2>
+        </Typography>
         {preamble && <p className={styles.preamble}>{preamble}</p>}
       </div>
       <div>

apps/scandic-web/components/SasTierComparison/sasTierComparison.module.css

@@ -15,6 +15,11 @@
   text-align: center;
 }
 
+.title {
+  text-align: center;
+  color: var(--Text-Heading);
+}
+
 .preamble {
   margin: 0;
   white-space: pre-wrap;