Merged in feat/LOY-490-cleanup-profiling-consent (pull request #3237)

Feat/LOY-490 cleanup profiling consent

* chore(LOY-490): cleanup accordion

* xhore(LOY-490): cleanup signup

* fix(LOY-490): use correct tokens

* fi(LOY-490): change button to correct color

* fix(LOY-490): switch deprecated Link


Approved-by: Chuma Mcphoy (We Ahead)
This commit is contained in:
Matilda Landström
2025-11-27 07:48:34 +00:00
parent 42b039c4ef
commit b122f2ff4f
8 changed files with 39 additions and 338 deletions

View File

@@ -27,12 +27,6 @@
gap: var(--Space-x1);
}
.personalizationMoreInfo {
display: grid;
grid-template-columns: auto 1fr;
align-items: start;
gap: var(--Space-x2);
}
.personalizationButton {
width: fit-content;
}

View File

@@ -18,8 +18,8 @@ import Checkbox from "@scandic-hotels/design-system/Form/Checkbox"
import CountrySelect from "@scandic-hotels/design-system/Form/Country"
import DateSelect from "@scandic-hotels/design-system/Form/Date"
import Phone from "@scandic-hotels/design-system/Form/Phone"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import Link from "@scandic-hotels/design-system/OldDSLink"
import { TextLink } from "@scandic-hotels/design-system/TextLink"
import { TextLinkButton } from "@scandic-hotels/design-system/TextLinkButton"
import { toast } from "@scandic-hotels/design-system/Toast"
import { Typography } from "@scandic-hotels/design-system/Typography"
import { useFormTracking } from "@scandic-hotels/tracking/useFormTracking"
@@ -39,7 +39,6 @@ import { getErrorMessage } from "@/utils/getErrorMessage"
import { requestOpen } from "@/utils/profilingConsent"
import { trackLinkClick } from "@/utils/tracking/profilingConsent"
// import { type SignUpSchema, signUpSchema } from "./schema"
import styles from "./form.module.css"
import type { SignUpFormProps } from "@/types/components/form/signupForm"
@@ -300,31 +299,7 @@ export default function SignupForm({ title }: SignUpFormProps) {
"I consent to Scandic using my information to give me even more personalized travel inspiration and offers from Scandic and trusted Scandic Friends partners. This means Scandic may use information about my interactions with Scandic Friends partners, and share details of my interactions with Scandic with those partners, to make the experience even more relevant to me.",
})}
</Checkbox>
<div className={styles.personalizationMoreInfo}>
<MaterialIcon icon="person" color="Icon/Interactive/Default" />
<p>
{intl.formatMessage({
id: "signup.GetATailoredProfile",
defaultMessage:
"Get a tailored profile that adapts to your interests.",
})}
</p>
</div>
<div className={styles.personalizationMoreInfo}>
<MaterialIcon
icon="featured_seasonal_and_gifts"
color="Icon/Interactive/Default"
/>
<p>
{intl.formatMessage({
id: "signup.PersonalizedOffersEarlyAccess",
defaultMessage:
"Personalized offers, early access to campaigns, and deals you won't find anywhere else!",
})}
</p>
</div>
<Button
variant="Text"
<TextLinkButton
typography="Link/sm"
color="Primary"
className={styles.personalizationButton}
@@ -334,7 +309,7 @@ export default function SignupForm({ title }: SignUpFormProps) {
id: "signup.ReadMoreAboutPersonalization",
defaultMessage: "Read more about personalization at Scandic",
})}
</Button>
</TextLinkButton>
</section>
<section className={styles.terms}>
@@ -375,24 +350,24 @@ export default function SignupForm({ title }: SignUpFormProps) {
},
{
termsAndConditionsLink: (str) => (
<Link
textDecoration="underline"
<TextLink
color="Text/Interactive/Secondary"
target="_blank"
href={membershipTermsAndConditions[lang]}
isInline
>
{str}
</Link>
</TextLink>
),
privacyPolicy: (str) => (
<Link
textDecoration="underline"
<TextLink
color="Text/Interactive/Secondary"
target="_blank"
href={privacyPolicyRoutes[lang]}
isInline
>
{str}
</Link>
</TextLink>
),
}
)}