Merged in chore/replace-deprecated-body (pull request #3300)
Replace deprecated <Body> with <Typography> * chore: replace deprecated body component * refactor: replace Body component with Typography across various components * merge Approved-by: Bianca Widstam Approved-by: Matilda Landström
This commit is contained in:
@@ -1,9 +1,8 @@
|
||||
import { Lock } from "react-feather"
|
||||
|
||||
import { MembershipLevelEnum } from "@scandic-hotels/common/constants/membershipLevels"
|
||||
import Body from "@scandic-hotels/design-system/Body"
|
||||
import Chip from "@scandic-hotels/design-system/Chip"
|
||||
import Title from "@scandic-hotels/design-system/Title"
|
||||
import { Typography } from "@scandic-hotels/design-system/Typography"
|
||||
|
||||
import { getMembershipLevel } from "@/lib/trpc/memoizedRequests"
|
||||
import { serverClient } from "@/lib/trpc/server"
|
||||
@@ -55,18 +54,23 @@ export default async function NextLevelRewardsBlock({
|
||||
})}
|
||||
</Chip>
|
||||
<div className={styles.textContainer}>
|
||||
<Body color="peach50" textAlign="center">
|
||||
{intl.formatMessage(
|
||||
{
|
||||
id: "rewards.nextLevel.asOurLevel",
|
||||
defaultMessage: "As our {level}",
|
||||
},
|
||||
{ level: nextLevelRewards.level?.name }
|
||||
)}
|
||||
</Body>
|
||||
<Title level="h4" as="h4" color="pale" textAlign="center">
|
||||
{reward.label}
|
||||
</Title>
|
||||
<Typography
|
||||
variant="Body/Paragraph/mdRegular"
|
||||
className={styles.asOur}
|
||||
>
|
||||
<p>
|
||||
{intl.formatMessage(
|
||||
{
|
||||
id: "rewards.nextLevel.asOurLevel",
|
||||
defaultMessage: "As our {level}",
|
||||
},
|
||||
{ level: nextLevelRewards.level?.name }
|
||||
)}
|
||||
</p>
|
||||
</Typography>
|
||||
<Typography variant="Title/xs" className={styles.rewardTitle}>
|
||||
<h4>{reward.label}</h4>
|
||||
</Typography>
|
||||
</div>
|
||||
</article>
|
||||
))}
|
||||
|
||||
@@ -12,4 +12,13 @@
|
||||
.textContainer {
|
||||
display: grid;
|
||||
gap: var(--Space-x1);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.asOur {
|
||||
color: var(--Primary-Dark-On-Surface-Accent);
|
||||
}
|
||||
|
||||
.rewardTitle {
|
||||
color: var(--Scandic-Brand-Pale-Peach);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user