diff --git a/src/assets/locals/ar.json b/src/assets/locals/ar.json
index 43e3470..ec5422e 100644
--- a/src/assets/locals/ar.json
+++ b/src/assets/locals/ar.json
@@ -449,6 +449,9 @@
"cancel": "إلغاء",
"done": "تم",
"inviteEveryonePayingWithYou": "دع الجميع يدفعوا معك",
- "includesAllOfTaxesCharges": "يشمل جميع الضرائب والرسوم"
+ "includesAllOfTaxesCharges": "يشمل جميع الضرائب والرسوم",
+ "shareLink": "شارك الرابط",
+ "shareLinkDescription": "يمكن للأصدقاء مسح الكود الباري أو استخدام الرابط لعرض الفاتورة ودفع نصيبهم بأمان من هاتفهم.",
+ "shareThisToSplitTheBill": "شارك هذا لتقسيم الفاتورة"
}
}
diff --git a/src/assets/locals/en.json b/src/assets/locals/en.json
index eba3a52..a3f0514 100644
--- a/src/assets/locals/en.json
+++ b/src/assets/locals/en.json
@@ -461,6 +461,9 @@
"cancel": "Cancel",
"done": "Done",
"inviteEveryonePayingWithYou": "Invite everyone paying with you",
- "includesAllOfTaxesCharges": "includes all of taxes charges"
+ "includesAllOfTaxesCharges": "includes all of taxes charges",
+ "shareLink": "Share Link",
+ "shareLinkDescription": "Your friends can scan the QR code or use the link to view the bill and pay their share securely from their phone.",
+ "shareThisToSplitTheBill": "Share this to split the bill"
}
}
diff --git a/src/components/Icons/UploadIcon.tsx b/src/components/Icons/UploadIcon.tsx
new file mode 100644
index 0000000..1c81de4
--- /dev/null
+++ b/src/components/Icons/UploadIcon.tsx
@@ -0,0 +1,27 @@
+interface UploadIconType {
+ className?: string;
+ onClick?: () => void;
+}
+
+const UploadIcon = ({ className, onClick }: UploadIconType) => {
+ return (
+
+ );
+};
+
+export default UploadIcon;
diff --git a/src/index.css b/src/index.css
index 2dd1e87..469213d 100644
--- a/src/index.css
+++ b/src/index.css
@@ -47,7 +47,7 @@
--secondary-foreground: #ffffff;
--border: #363636;
--text-color: #000;
- --text-color-gray: #5f6c7b; /* rgba(67, 78, 92, 1); */
+ --text-color-gray: #777580; /* rgba(67, 78, 92, 1); */
}
html,
diff --git a/src/pages/pay/components/splitBill/QRBottomSheet.tsx b/src/pages/pay/components/splitBill/QRBottomSheet.tsx
index d8ebdc0..1fee5d7 100644
--- a/src/pages/pay/components/splitBill/QRBottomSheet.tsx
+++ b/src/pages/pay/components/splitBill/QRBottomSheet.tsx
@@ -5,6 +5,7 @@ import { useTranslation } from "react-i18next";
import ProText from "components/ProText";
import QRIcon from "components/Icons/QRIcon";
+import UploadIcon from "components/Icons/UploadIcon";
interface QRBottomSheetProps {
isOpen: boolean;
@@ -12,10 +13,7 @@ interface QRBottomSheetProps {
onSave?: (value: string) => void;
}
-export function QRBottomSheet({
- isOpen,
- onClose,
-}: QRBottomSheetProps) {
+export function QRBottomSheet({ isOpen, onClose }: QRBottomSheetProps) {
const { t } = useTranslation();
const [qrCode, setQRCode] = useState("");
@@ -34,8 +32,8 @@ export function QRBottomSheet({
title={t("splitBill.payWithQR")}
showCloseButton={true}
initialSnap={1}
- height={430}
- snapPoints={[430]}
+ height={590}
+ snapPoints={[590]}
contentStyle={{
padding: 0,
}}
@@ -48,23 +46,45 @@ export function QRBottomSheet({
gap: 20,
}}
>
-