fix(SW-2681): Fixed position of scripted text and using design system components

Approved-by: Matilda Landström
This commit is contained in:
Erik Tiekstra
2025-05-26 12:32:53 +00:00
parent d73f8d844e
commit 7e17e9cf4c
2 changed files with 56 additions and 57 deletions

View File

@@ -1,11 +1,8 @@
import SurpriseIcon from "@scandic-hotels/design-system/Icons/SurpriseIcon"
import { Typography } from "@scandic-hotels/design-system/Typography"
import ButtonLink from "@/components/ButtonLink"
import Image from "@/components/Image"
import Button from "@/components/TempDesignSystem/Button"
import Link from "@/components/TempDesignSystem/Link"
import BiroScript from "@/components/TempDesignSystem/Text/BiroScript"
import Body from "@/components/TempDesignSystem/Text/Body"
import Title from "@/components/TempDesignSystem/Text/Title"
import { isLoggedInUser } from "@/utils/isLoggedInUser"
import styles from "./joinScandicFriends.module.css"
@@ -44,53 +41,44 @@ export default async function JoinScandicFriends({
<div className={styles.textContent}>
{show_header ? (
<header className={styles.header}>
<div>
<BiroScript
color="red"
type="two"
tilted="small"
className={styles.scriptedText}
>
{content.scripted_top_title}
</BiroScript>
</div>
<Title level="h2" as="h4">
{content.title}
</Title>
{content.scripted_top_title ? (
<Typography variant="Title/Decorative/md">
<span className={styles.scriptedText}>
{content.scripted_top_title}
</span>
</Typography>
) : null}
<Typography variant="Title/xs">
<h2 className={styles.heading}>{content.title}</h2>
</Typography>
</header>
) : null}
<Body>{content.preamble}</Body>
<Typography variant="Body/Paragraph/mdRegular">
<p>{content.preamble}</p>
</Typography>
{show_usp && usp.length ? (
<ul className={styles.usp}>
{usp.map((uspBullet) => (
<Body asChild key={uspBullet}>
<Typography key={uspBullet} variant="Body/Paragraph/mdRegular">
<li>{uspBullet}</li>
</Body>
</Typography>
))}
</ul>
) : null}
</div>
{content.has_primary_button ? (
<div className={styles.buttonContainer}>
<Button
theme="base"
intent="primary"
size="small"
fullWidth
asChild
>
<Link
href={primary_button.href}
target={primary_button.openInNewTab ? "_blank" : undefined}
color="none"
size="regular"
>
{primary_button.title}
</Link>
</Button>
</div>
<ButtonLink
variant="Primary"
size="Small"
href={primary_button.href}
target={primary_button.openInNewTab ? "_blank" : undefined}
typography="Body/Supporting text (caption)/smBold"
className={styles.primaryButton}
>
{primary_button.title}
</ButtonLink>
) : null}
</div>
</div>