fix(SW-1386): correct font sizes and levels for full width campaign

This commit is contained in:
Christian Andolf
2025-01-28 16:10:25 +01:00
parent 75ee9933ab
commit e525abda20
3 changed files with 12 additions and 5 deletions

View File

@@ -2,7 +2,7 @@ import Image from "@/components/Image"
import Button from "@/components/TempDesignSystem/Button" import Button from "@/components/TempDesignSystem/Button"
import Link from "@/components/TempDesignSystem/Link" import Link from "@/components/TempDesignSystem/Link"
import BiroScript from "@/components/TempDesignSystem/Text/BiroScript" import BiroScript from "@/components/TempDesignSystem/Text/BiroScript"
import Body from "@/components/TempDesignSystem/Text/Body" import Preamble from "@/components/TempDesignSystem/Text/Preamble"
import Title from "@/components/TempDesignSystem/Text/Title" import Title from "@/components/TempDesignSystem/Text/Title"
import styles from "./fullWidthCampaign.module.css" import styles from "./fullWidthCampaign.module.css"
@@ -31,14 +31,16 @@ export default function FullWidthCampaign({ content }: FullWidthCampaignProps) {
/> />
) : null} ) : null}
<div className={styles.content}> <div className={styles.content}>
<BiroScript color="baseText">{node.scripted_top_title}</BiroScript> <BiroScript color="baseText" type="two">
{node.scripted_top_title}
</BiroScript>
<div className={styles.mainContent}> <div className={styles.mainContent}>
<Title color="baseText" textAlign="center"> <Title color="baseText" textAlign="center" level="h3">
{node.heading} {node.heading}
</Title> </Title>
<Body color="baseText" textAlign="center"> <Preamble color="baseText" textAlign="center">
{node.body_text} {node.body_text}
</Body> </Preamble>
<div className={styles.buttons}> <div className={styles.buttons}>
{node.has_primary_button ? ( {node.has_primary_button ? (
<Button intent="inverted" size="small" theme="base" asChild> <Button intent="inverted" size="small" theme="base" asChild>

View File

@@ -33,6 +33,10 @@
color: var(--Base-Text-UI-Medium-contrast); color: var(--Base-Text-UI-Medium-contrast);
} }
.baseText {
color: var(--Base-Text-Inverted);
}
.center { .center {
text-align: center; text-align: center;
} }

View File

@@ -9,6 +9,7 @@ const config = {
burgundy: styles.burgundy, burgundy: styles.burgundy,
pale: styles.pale, pale: styles.pale,
textMediumContrast: styles.textMediumContrast, textMediumContrast: styles.textMediumContrast,
baseText: styles.baseText,
}, },
textAlign: { textAlign: {
center: styles.center, center: styles.center,