feat(SW-1806): Implemented design systems button inside buttonLink component and changed teasercard buttons

Approved-by: Matilda Landström
This commit is contained in:
Erik Tiekstra
2025-03-28 06:56:08 +00:00
parent 2f0224cfd5
commit 45c992dcef
14 changed files with 152 additions and 91 deletions

View File

@@ -2,12 +2,12 @@
import { useState } from "react"
import { Button } from "@scandic-hotels/design-system/Button"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
import ButtonLink from "@/components/ButtonLink"
import JsonToHtml from "@/components/JsonToHtml"
import Button from "@/components/TempDesignSystem/Button"
import Link from "../../Link"
import SidePeek from "../../SidePeek"
import styles from "./sidepeek.module.css"
@@ -22,14 +22,13 @@ export default function TeaserCardSidepeek({
const { heading, content, primary_button, secondary_button } = sidePeekContent
return (
<div>
<div className={styles.teaserCardSidepeek}>
<Button
onPress={() => setSidePeekIsOpen(true)}
theme="base"
variant="icon"
intent="text"
size="small"
wrapping
variant="Secondary"
color="Primary"
size="Small"
typography="Body/Supporting text (caption)/smBold"
>
{button.call_to_action_text}
<MaterialIcon icon="chevron_right" size={20} color="CurrentColor" />
@@ -46,25 +45,28 @@ export default function TeaserCardSidepeek({
/>
<div className={styles.ctaContainer}>
{primary_button && (
<Button asChild theme="base" intent="primary" size="small">
<Link
href={primary_button.href}
target={primary_button.openInNewTab ? "_blank" : undefined}
color="none"
>
{primary_button.title}
</Link>
</Button>
<ButtonLink
variant="Primary"
color="Primary"
size="Small"
typography="Body/Supporting text (caption)/smBold"
href={primary_button.href}
target={primary_button.openInNewTab ? "_blank" : undefined}
>
{primary_button.title}
</ButtonLink>
)}
{secondary_button && (
<Button asChild intent="secondary" size="small">
<Link
href={secondary_button.href}
target={secondary_button.openInNewTab ? "_blank" : undefined}
>
{secondary_button.title}
</Link>
</Button>
<ButtonLink
variant="Secondary"
color="Primary"
size="Small"
typography="Body/Supporting text (caption)/smBold"
href={secondary_button.href}
target={secondary_button.openInNewTab ? "_blank" : undefined}
>
{secondary_button.title}
</ButtonLink>
)}
</div>
</SidePeek>