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/HotelReservation/MyStay/ReferenceCard/Actions/Upcoming/ManageStay/Actions/ChangeDates/Steps/Form/NewDates/index.tsx

@@ -128,7 +128,7 @@ export default function NewDates({ checkInDate, checkOutDate }: NewDatesProps) {
               <MaterialIcon icon="calendar_today" />
             </ButtonRAC>
             <Modal>
-              <Dialog>
+              <Dialog className={styles.dialog}>
                 {({ close }) => (
                   <>
                     <DatePickerSingleDesktop

apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/PriceContainer/index.tsx

@@ -1,5 +1,5 @@
 import Caption from "@scandic-hotels/design-system/Caption"
-import Subtitle from "@scandic-hotels/design-system/Subtitle"
+import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import styles from "./priceContainer.module.css"
 
@@ -34,9 +34,9 @@ export default function PriceContainer({
         </Caption>
       </div>
       <div className={styles.wrapper}>
-        <Subtitle className={styles.price} color="burgundy" type="one">
-          {price}
-        </Subtitle>
+        <Typography variant="Title/Subtitle/md">
+          <p>{price}</p>
+        </Typography>
       </div>
     </div>
   )

apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/PriceContainer/priceContainer.module.css

@@ -19,6 +19,7 @@
   padding-left: var(--Space-x2);
   display: flex;
   align-items: center;
+  color: var(--Text-Heading);
 }
 
 .price {