scandic/web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(BOOK-771): Added spacing between content and cta wrapper in TeaserCard sidepeeks

Browse Source 
Approved-by: Bianca Widstam
This commit is contained in:
Erik Tiekstra
2026-01-28 12:03:22 +00:00
parent 1bb1a7e139
commit d193bf057d
2 changed files with 38 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
packages/design-system/lib/components/TeaserCard/Sidepeek/index.tsx
View File

@@ -47,35 +47,39 @@ export default function TeaserCardSidepeek({
defaultMessage: "Close",
})}
>
{content ? (
<JsonToHtml
nodes={content.json.children}
embeds={content.embedded_itemsConnection.edges}
/>
) : null}
<div className={styles.ctaContainer}>
{primary_button && (
<ButtonLink
variant="Primary"
color="Primary"
size="sm"
href={primary_button.href}
target={primary_button.openInNewTab ? "_blank" : undefined}
>
{primary_button.title}
</ButtonLink>
)}
{secondary_button && (
<ButtonLink
variant="Secondary"
color="Primary"
size="sm"
href={secondary_button.href}
target={secondary_button.openInNewTab ? "_blank" : undefined}
>
{secondary_button.title}
</ButtonLink>
)}
<div className={styles.content}>
{content ? (
<JsonToHtml
nodes={content.json.children}
embeds={content.embedded_itemsConnection.edges}
/>
) : null}
{primary_button || secondary_button ? (
<div className={styles.ctaContainer}>
{primary_button && (
<ButtonLink
variant="Primary"
color="Primary"
size="sm"
href={primary_button.href}
target={primary_button.openInNewTab ? "_blank" : undefined}
>
{primary_button.title}
</ButtonLink>
)}
{secondary_button && (
<ButtonLink
variant="Secondary"
color="Primary"
size="sm"
href={secondary_button.href}
target={secondary_button.openInNewTab ? "_blank" : undefined}
>
{secondary_button.title}
</ButtonLink>
)}
</div>
) : null}
</div>
</SidePeek>
</div>

5
packages/design-system/lib/components/TeaserCard/Sidepeek/sidepeek.module.css
View File

@@ -6,3 +6,8 @@
display: grid;
gap: var(--Space-x2);
}
.content {
display: grid;
gap: var(--Space-x4);
}