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

feat(SW-243): css refactoring

Browse Source
This commit is contained in:
Fredrik Thorsson
2024-08-21 09:57:04 +02:00
parent 95c8fd1950
commit 13d113169c
5 changed files with 33 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
components/HotelReservation/BookingConfirmation/StaySection/index.tsx
View File

@@ -11,6 +11,7 @@ import { StaySectionProps } from "@/types/components/hotelReservation/bookingCon
export default async function StaySection({ hotel, stay }: StaySectionProps) {
const intl = await getIntl()
const nights =
stay.nights > 1
? intl.formatMessage({ id: "nights" })
@@ -19,15 +20,13 @@ export default async function StaySection({ hotel, stay }: StaySectionProps) {
return (
<>
<section className={styles.card}>
<div>
<Image
src={hotel.image}
alt=""
height={400}
width={200}
className={styles.image}
/>
</div>
<Image
src={hotel.image}
alt=""
height={400}
width={200}
className={styles.image}
/>
<div className={styles.info}>
<div className={styles.hotel}>
<ScandicLogoIcon color="red" />
@@ -39,16 +38,14 @@ export default async function StaySection({ hotel, stay }: StaySectionProps) {
<span>{hotel.phone}</span>
</Caption>
</div>
<div className={styles.width}>
<Body className={styles.stay}>
<span>{`${stay.nights} ${nights}`}</span>
<span className={styles.dates}>
<span>{stay.start}</span>
<ArrowRightIcon height={15} width={15} />
<span>{stay.end}</span>
</span>
</Body>
</div>
<Body className={styles.stay}>
<span>{`${stay.nights} ${nights}`}</span>
<span className={styles.dates}>
<span>{stay.start}</span>
<ArrowRightIcon height={15} width={15} />
<span>{stay.end}</span>
</span>
</Body>
</div>
</section>
<section className={styles.table}>

3
components/HotelReservation/BookingConfirmation/StaySection/staySection.module.css
View File

@@ -2,6 +2,7 @@
display: flex;
width: 100%;
background-color: var(--Base-Surface-Primary-light-Normal);
border: 1px solid var(--Base-Border-Subtle);
border-radius: var(--Corner-radius-Small);
overflow: hidden;
}
@@ -71,7 +72,7 @@
}
.hotel,
.width {
.stay {
width: 100%;
max-width: 230px;
}