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

Merged in fix/SW-2366-alerts-the-list-bullet-display (pull request #2679)

Browse Source 
fix(SW-2366): Fixed hotel alerts in booking page as per design

* fix(SW-2366): Fixed hotel alerts in booking page as per design

* fix(SW-2366): Optimise code


Approved-by: Erik Tiekstra
This commit is contained in:
Hrishikesh Vaipurkar
2025-08-21 09:47:54 +00:00
parent e0cc237b5f
commit d2bbbc0a47
2 changed files with 9 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
apps/scandic-web/components/HotelReservation/MyStay/BookingSummary/bookingSummary.module.css
View File

@@ -11,11 +11,6 @@
gap: 80px; gap: 80px;
} }
.toast {
width: var(--max-width-content);
margin: 0 auto;
}
.title { .title {
color: var(--Scandic-Brand-Burgundy); color: var(--Scandic-Brand-Burgundy);
text-align: center; text-align: center;

25
apps/scandic-web/components/HotelReservation/MyStay/BookingSummary/index.tsx
View File

@@ -5,7 +5,7 @@ import { useIntl } from "react-intl"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon" import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import { Typography } from "@scandic-hotels/design-system/Typography" import { Typography } from "@scandic-hotels/design-system/Typography"
import { Toast } from "@/components/TempDesignSystem/Toasts" import Alert from "@/components/TempDesignSystem/Alert"
import { trackMyStayPageLink } from "@/utils/tracking" import { trackMyStayPageLink } from "@/utils/tracking"
import SummaryCard from "./SummaryCard" import SummaryCard from "./SummaryCard"
@@ -103,21 +103,14 @@ export default function BookingSummary({ hotel }: BookingSummaryProps) {
]} ]}
/> />
</div> </div>
{hotel.specialAlerts.length > 0 && ( {hotel.specialAlerts.map((alert) => (
<div className={styles.toast}> <Alert
<Toast variant="info"> key={alert.id}
<ul> type={alert.type}
{hotel.specialAlerts.map((alert) => ( heading={alert.heading}
<li key={alert.id}> text={alert.text}
<Typography variant="Body/Paragraph/mdRegular"> />
<span>{alert.text}</span> ))}
</Typography>
</li>
))}
</ul>
</Toast>
</div>
)}
</div> </div>
) )
} }