split bill: reorder flow
This commit is contained in:
@@ -55,126 +55,123 @@ export function SplitBillChoiceBottomSheet({
|
||||
|
||||
return (
|
||||
<>
|
||||
<ProBottomSheet
|
||||
isOpen={isOpen}
|
||||
onClose={handleCancel}
|
||||
title={t("splitBill.title")}
|
||||
showCloseButton={false}
|
||||
initialSnap={1}
|
||||
height={290}
|
||||
snapPoints={[290]}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
marginTop: 20,
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
gap: 10,
|
||||
}}
|
||||
<ProBottomSheet
|
||||
isOpen={isOpen}
|
||||
onClose={handleCancel}
|
||||
title={t("splitBill.title")}
|
||||
showCloseButton={false}
|
||||
initialSnap={1}
|
||||
height={290}
|
||||
snapPoints={[290]}
|
||||
>
|
||||
<Card
|
||||
className={styles.backToHomePage}
|
||||
onClick={handleCustomAmountClick}
|
||||
<div
|
||||
style={{
|
||||
marginTop: 20,
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
gap: 10,
|
||||
}}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
justifyContent: "space-between",
|
||||
marginTop: 1,
|
||||
}}
|
||||
<Card
|
||||
className={styles.backToHomePage}
|
||||
onClick={handleCustomAmountClick}
|
||||
>
|
||||
<ProTitle
|
||||
level={5}
|
||||
<div
|
||||
style={{
|
||||
fontSize: 14,
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
justifyContent: "space-between",
|
||||
marginTop: 1,
|
||||
}}
|
||||
>
|
||||
{t("splitBill.payAsCustomAmount")}
|
||||
</ProTitle>
|
||||
<ProTitle
|
||||
level={5}
|
||||
style={{
|
||||
fontSize: 14,
|
||||
}}
|
||||
>
|
||||
{t("splitBill.payAsCustomAmount")}
|
||||
</ProTitle>
|
||||
|
||||
{isRTL ? (
|
||||
<BackIcon className={styles.serviceIcon} />
|
||||
) : (
|
||||
<NextIcon className={styles.serviceIcon} />
|
||||
)}
|
||||
</div>
|
||||
</Card>
|
||||
{isRTL ? (
|
||||
<BackIcon className={styles.serviceIcon} />
|
||||
) : (
|
||||
<NextIcon className={styles.serviceIcon} />
|
||||
)}
|
||||
</div>
|
||||
</Card>
|
||||
|
||||
<Card
|
||||
className={styles.backToHomePage}
|
||||
onClick={handleEqualityClick}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
justifyContent: "space-between",
|
||||
marginTop: 1,
|
||||
}}
|
||||
>
|
||||
<ProTitle
|
||||
level={5}
|
||||
<Card className={styles.backToHomePage} onClick={handleEqualityClick}>
|
||||
<div
|
||||
style={{
|
||||
fontSize: 14,
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
justifyContent: "space-between",
|
||||
marginTop: 1,
|
||||
}}
|
||||
>
|
||||
{t("splitBill.divideTheBillEqually")}
|
||||
</ProTitle>
|
||||
<ProTitle
|
||||
level={5}
|
||||
style={{
|
||||
fontSize: 14,
|
||||
}}
|
||||
>
|
||||
{t("splitBill.divideTheBillEqually")}
|
||||
</ProTitle>
|
||||
|
||||
{isRTL ? (
|
||||
<BackIcon className={styles.serviceIcon} />
|
||||
) : (
|
||||
<NextIcon className={styles.serviceIcon} />
|
||||
)}
|
||||
</div>
|
||||
</Card>
|
||||
{isRTL ? (
|
||||
<BackIcon className={styles.serviceIcon} />
|
||||
) : (
|
||||
<NextIcon className={styles.serviceIcon} />
|
||||
)}
|
||||
</div>
|
||||
</Card>
|
||||
|
||||
<Card
|
||||
className={styles.backToHomePage}
|
||||
onClick={handlePayForItemsClick}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
justifyContent: "space-between",
|
||||
marginTop: 1,
|
||||
}}
|
||||
<Card
|
||||
className={styles.backToHomePage}
|
||||
onClick={handlePayForItemsClick}
|
||||
>
|
||||
<ProTitle
|
||||
level={5}
|
||||
<div
|
||||
style={{
|
||||
fontSize: 14,
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
justifyContent: "space-between",
|
||||
marginTop: 1,
|
||||
}}
|
||||
>
|
||||
{t("splitBill.payForYourItems")}
|
||||
</ProTitle>
|
||||
<ProTitle
|
||||
level={5}
|
||||
style={{
|
||||
fontSize: 14,
|
||||
}}
|
||||
>
|
||||
{t("splitBill.payForYourItems")}
|
||||
</ProTitle>
|
||||
|
||||
{isRTL ? (
|
||||
<BackIcon className={styles.serviceIcon} />
|
||||
) : (
|
||||
<NextIcon className={styles.serviceIcon} />
|
||||
)}
|
||||
</div>
|
||||
</Card>
|
||||
</div>
|
||||
</ProBottomSheet>
|
||||
{isRTL ? (
|
||||
<BackIcon className={styles.serviceIcon} />
|
||||
) : (
|
||||
<NextIcon className={styles.serviceIcon} />
|
||||
)}
|
||||
</div>
|
||||
</Card>
|
||||
</div>
|
||||
</ProBottomSheet>
|
||||
|
||||
<CustomAmountChoiceBottomSheet
|
||||
isOpen={isCustomAmountOpen}
|
||||
onClose={() => setIsCustomAmountOpen(false)}
|
||||
/>
|
||||
<CustomAmountChoiceBottomSheet
|
||||
isOpen={isCustomAmountOpen}
|
||||
onClose={() => setIsCustomAmountOpen(false)}
|
||||
/>
|
||||
|
||||
<EqualltyChoiceBottomSheet
|
||||
isOpen={isEqualityOpen}
|
||||
onClose={() => setIsEqualityOpen(false)}
|
||||
/>
|
||||
<EqualltyChoiceBottomSheet
|
||||
isOpen={isEqualityOpen}
|
||||
onClose={() => setIsEqualityOpen(false)}
|
||||
/>
|
||||
|
||||
<PayForYourItemsChoiceBottomSheet
|
||||
isOpen={isPayForItemsOpen}
|
||||
onClose={() => setIsPayForItemsOpen(false)}
|
||||
/>
|
||||
<PayForYourItemsChoiceBottomSheet
|
||||
isOpen={isPayForItemsOpen}
|
||||
onClose={() => setIsPayForItemsOpen(false)}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user