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

feat: SW-276 Updated UI as per design

Browse Source
This commit is contained in:
Hrishikesh Vaipurkar
2024-10-14 08:50:55 +02:00
parent b8f7f91fb4
commit cefed89ae5
9 changed files with 97 additions and 100 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
components/GuestsRoomsPicker/AdultSelector/adult-selector.module.css
View File

@@ -3,13 +3,3 @@
justify-content: space-between;
align-items: center;
}
.counterContainer {
display: flex;
justify-content: flex-end;
align-items: center;
gap: 20px;
}
.counterBtn {
width: 40px;
height: 40px;
}

49
components/GuestsRoomsPicker/AdultSelector/index.tsx
View File

@@ -5,11 +5,10 @@ import { useIntl } from "react-intl"
import { useGuestsRoomsStore } from "@/stores/guests-rooms"
import { MinusIcon, PlusIcon } from "@/components/Icons"
import Button from "@/components/TempDesignSystem/Button"
import Body from "@/components/TempDesignSystem/Text/Body"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Counter from "../Counter"
import styles from "./adult-selector.module.css"
import { BedTypeEnum } from "@/types/components/bookingWidget/enums"
@@ -60,39 +59,17 @@ export default function AdultSelector({ roomIndex = 0 }: AdultSelectorProps) {
<Caption color="uiTextHighContrast" textTransform="bold">
{adultsLabel}
</Caption>
<div className={styles.counterContainer}>
<Button
className={styles.counterBtn}
intent="elevated"
onClick={() => {
decreaseAdultsCount(roomIndex)
}}
size="small"
theme="base"
variant="icon"
wrapping={true}
disabled={adults == 1}
>
<MinusIcon color="burgundy" />
</Button>
<Body color="textHighContrast" textAlign="center">
{adults}
</Body>
<Button
className={styles.counterBtn}
onClick={() => {
increaseAdultsCount(roomIndex)
}}
intent="elevated"
variant="icon"
theme="base"
wrapping={true}
size="small"
disabled={adults == 6}
>
<PlusIcon color="burgundy" />
</Button>
</div>
<Counter
count={adults}
handleOnDecrease={() => {
decreaseAdultsCount(roomIndex)
}}
handleOnIncrease={() => {
increaseAdultsCount(roomIndex)
}}
disableDecrease={adults == 1}
disableIncrease={adults == 6}
/>
</section>
)
}