Merged in fix/book-425-color-change-campaign-rate-card (pull request #3040)

fix(BOOK-425): fixed the color on campaign member rate name

* fix(BOOK-425): fixed the color on standard rate name

* listening to api resonse displayPriceRed again

* updated the conditional css class syntax


Approved-by: Bianca Widstam
Approved-by: Erik Tiekstra
This commit is contained in:
Matilda Haneling
2025-10-31 07:34:45 +00:00
parent e2aeada23e
commit 02012175ba
2 changed files with 11 additions and 5 deletions

View File

@@ -240,6 +240,7 @@ function Inner({
isHighlightedRate={ isHighlightedRate={
!!product.rateDefinition?.displayPriceRed || isMainRoomAndLoggedIn !!product.rateDefinition?.displayPriceRed || isMainRoomAndLoggedIn
} }
isHighlightedRateLabel={isMainRoomAndLoggedIn}
memberRate={ memberRate={
pricePerNightMember && !isMainRoomAndLoggedIn pricePerNightMember && !isMainRoomAndLoggedIn
? { ? {

View File

@@ -21,6 +21,7 @@ interface CampaignRateCardProps {
omnibusRate?: Rate omnibusRate?: Rate
comparisonRate?: Omit<Rate, 'label'> comparisonRate?: Omit<Rate, 'label'>
isHighlightedRate?: boolean isHighlightedRate?: boolean
isHighlightedRateLabel?: boolean
approximateRate?: Rate approximateRate?: Rate
handleChange: () => void handleChange: () => void
handleTermsClick?: () => void handleTermsClick?: () => void
@@ -40,6 +41,7 @@ export default function CampaignRateCard({
omnibusRate, omnibusRate,
bannerText, bannerText,
isHighlightedRate, isHighlightedRate,
isHighlightedRateLabel,
handleChange, handleChange,
rateTermDetails, rateTermDetails,
}: CampaignRateCardProps) { }: CampaignRateCardProps) {
@@ -114,16 +116,19 @@ export default function CampaignRateCard({
</div> </div>
</header> </header>
<div className={styles.content}> <div className={styles.content}>
<div className={styles.rateRow}> <div
className={cx(styles.rateRow, {
[styles.highlightedRate]: isHighlightedRateLabel,
})}
>
<Typography variant="Body/Supporting text (caption)/smBold"> <Typography variant="Body/Supporting text (caption)/smBold">
<p>{rate.label}</p> <p>{rate.label}</p>
</Typography> </Typography>
<Typography variant="Title/Subtitle/md"> <Typography variant="Title/Subtitle/md">
<p <p
className={cx( className={cx(styles.rateRow, {
styles.rate, [styles.highlightedRate]: isHighlightedRate,
isHighlightedRate && styles.highlightedRate })}
)}
> >
{/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */} {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
{`${rate.price} `} {`${rate.price} `}