Merged in feat/SW-1276-implement-design (pull request #1348)

Feat/SW-1276 implement design

* feat(SW-1276) UI implementation Desktop part 1 for MyStay

* feat(SW-1276) UI implementation Desktop part 2 for MyStay

* feat(SW-1276) UI implementation Mobile part 1 for MyStay

* refactor: move files from MyStay/MyStay to MyStay

* feat(SW-1276) Sidepeek implementation

* feat(SW-1276): Refactoring

* feat(SW-1276) UI implementation Mobile part 2 for MyStay

* feat(SW-1276): translations

* feat(SW-1276) fixed skeleton

* feat(SW-1276): Added missing translations

* feat(SW-1276): Removed console log

* feat(SW-1276) fixed translations

* feat(SW-1276): Added translations

* feat(SW-1276) fix dynamic ID:s

* feat(SW-1276) removed createElement

* feat(SW-1276): Fixed build errors

* feat(SW-1276): Updated label

* feat(SW-1276): Rewrite SummaryCard


Approved-by: Niclas Edenvin
This commit is contained in:
Pontus Dreij
2025-02-18 14:20:54 +00:00
parent 90fee1b0c4
commit 8616e4ab76
56 changed files with 4163 additions and 227 deletions

View File

@@ -0,0 +1,28 @@
header .title {
position: relative;
z-index: 2;
left: 0;
right: 0;
margin: 0 auto;
padding-top: var(--Spacing-x6);
margin-top: var(--Spacing-x2);
}
.title .hotelName {
font-family: var(--typography-Title-3-fontFamily);
font-size: var(--typography-Title-3-fontSize);
font-weight: var(--typography-Title-3-fontWeight);
letter-spacing: var(--typography-Title-3-letterSpacing);
line-height: var(--typography-Title-3-lineHeight);
display: block;
}
@media (min-width: 768px) {
.title .hotelName {
font-family: var(--typography-Title-1-fontFamily);
font-size: var(--typography-Title-1-fontSize);
font-weight: var(--typography-Title-1-fontWeight);
letter-spacing: var(--typography-Title-1-letterSpacing);
line-height: var(--typography-Title-1-lineHeight);
}
}

View File

@@ -0,0 +1,22 @@
import BiroScript from "@/components/TempDesignSystem/Text/BiroScript"
import Title from "@/components/TempDesignSystem/Text/Title"
import { getIntl } from "@/i18n"
import styles from "./header.module.css"
import type { BookingConfirmation } from "@/types/trpc/routers/booking/confirmation"
export async function Header({ hotel }: Pick<BookingConfirmation, "hotel">) {
const intl = await getIntl()
return (
<header>
<Title as="h2" color="white" className={styles.title} textAlign="center">
<BiroScript type="two" tilted="medium">
{intl.formatMessage({ id: "My stay at" })}{" "}
</BiroScript>
<span className={styles.hotelName}>{hotel.name}</span>
{hotel.cityName}
</Title>
</header>
)
}