Merged in chore/BOOK-701-replace-subtitle-component (pull request #3398)

chore(BOOK-701): replace subtitle with typography

* chore(BOOK-701): replace subtitle with typography

* chore(BOOK-701): align center

* chore(BOOK-701): change token

* chore(BOOK-701): change text color

* fix(BOOK-704): revert pricechange dialog changes

* chore(BOOK-701): remove subtitle from package.json


Approved-by: Matilda Landström

apps/scandic-web/components/LanguageSwitcher/LanguageSwitcherContainer/index.tsx

@@ -1,7 +1,6 @@
 import { useIntl } from "react-intl"
 
 import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
-import Subtitle from "@scandic-hotels/design-system/Subtitle"
 
 import useDropdownStore from "@/stores/main-menu"
 
@@ -35,18 +34,10 @@ export default function LanguageSwitcherContainer({
             onClick={() => toggleDropdown(position)}
           >
             <MaterialIcon
-              icon="chevron_left"
-              color="Icon/Interactive/Accent"
+              icon="arrow_back_ios"
+              color="Icon/Interactive/Default"
               size={20}
             />
-            <Subtitle type="one" asChild>
-              <span>
-                {intl.formatMessage({
-                  id: "common.mainMenu",
-                  defaultMessage: "Main menu",
-                })}
-              </span>
-            </Subtitle>
           </button>
         </div>
       ) : null}

apps/scandic-web/components/LanguageSwitcher/LanguageSwitcherContainer/languageSwitcherContainer.module.css

@@ -1,5 +1,4 @@
 .backWrapper {
-  background-color: var(--Base-Surface-Secondary-light-Normal);
   padding: var(--Space-x2);
 }
 

apps/scandic-web/components/LanguageSwitcher/LanguageSwitcherContent/index.tsx

@@ -6,7 +6,6 @@ import { useIntl } from "react-intl"
 import { languages } from "@scandic-hotels/common/constants/language"
 import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
 import Link from "@scandic-hotels/design-system/OldDSLink"
-import Subtitle from "@scandic-hotels/design-system/Subtitle"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import useLang from "@/hooks/useLang"
@@ -32,12 +31,14 @@ export default function LanguageSwitcherContent({
 
   return (
     <div className={styles.languageWrapper}>
-      <Subtitle className={styles.subtitle} type="two">
-        {intl.formatMessage({
-          id: "common.selectYourLanguage",
-          defaultMessage: "Select your language",
-        })}
-      </Subtitle>
+      <Typography variant="Title/Subtitle/md" className={styles.subtitle}>
+        <p>
+          {intl.formatMessage({
+            id: "common.selectYourLanguage",
+            defaultMessage: "Select your language",
+          })}
+        </p>
+      </Typography>
       <ul className={styles.list}>
         {urlKeys.map((key) => {
           const url = urls[key]?.url