diff --git a/src/assets/locals/ar.json b/src/assets/locals/ar.json index 33737a9..b12c3c5 100644 --- a/src/assets/locals/ar.json +++ b/src/assets/locals/ar.json @@ -350,5 +350,15 @@ "keepOrder": "الاحتفاظ بالطلب", "thisActionCannotBeUndone": "هذا الإجراء لا يمكن التراجع عنه.", "createOrderFailed": "فشل إنشاء الطلب" + }, + "orderTypes": { + "dine-in": "في المطعم", + "pickup": "استلام", + "gift": "هدية", + "room": "إلى غرفتك", + "delivery": "توصيل", + "office": "إلى مكتبك", + "scheduled_order": "مجدول", + "booking": "حجز مسبق" } } diff --git a/src/assets/locals/en.json b/src/assets/locals/en.json index 185b494..9131527 100644 --- a/src/assets/locals/en.json +++ b/src/assets/locals/en.json @@ -361,5 +361,15 @@ "keepOrder": "Keep Order", "thisActionCannotBeUndone": "This action cannot be undone.", "createOrderFailed": "Create Order Failed" + }, + "orderTypes": { + "dine-in": "Dine In", + "pickup": "Pickup", + "gift": "Gift", + "room": "To Room", + "delivery": "Delivery", + "office": "To Office", + "scheduled_order": "Scheduled", + "booking": "Booking" } } diff --git a/src/pages/menu/menu.module.css b/src/pages/menu/menu.module.css index bc6b001..701e664 100644 --- a/src/pages/menu/menu.module.css +++ b/src/pages/menu/menu.module.css @@ -432,17 +432,32 @@ border-radius: 50%; } .orderTypeSelectContainer { - width: 20%; + width: 28%; height: 32px; - left: 40%; + left: 36%; border-radius: 40%; } .orderTypeSelect { - width: 90%; + width: 95%; margin-left: 5%; margin-right: 5%; } +/* Style for the select component and its dropdown */ +:global(.ant-select .ant-select-selection-item) { + font-size: 12px !important; + font-weight: 700 !important; + text-align: center; +} +:global(.ant-select .ant-select-arrow) { + font-weight: 600 !important; + color:black; +} +:global(.ant-select-dropdown .ant-select-item) { + font-size: 12px !important; + font-weight: 600 !important; +} + .searchButtonContainer { right: 20px; border-radius: 50%; diff --git a/src/pages/menu/page.tsx b/src/pages/menu/page.tsx index 42e3bef..614b285 100644 --- a/src/pages/menu/page.tsx +++ b/src/pages/menu/page.tsx @@ -26,6 +26,8 @@ import MenuSkeleton from "./components/MenuSkeleton/MenuSkeleton"; import ScrollEventHandler from "./components/ScrollEventHandler"; import SearchButton from "./components/SearchButton"; import styles from "./menu.module.css"; +import { enumToSelectOptions } from "utils/helpers/helperFunctions.ts"; +import { OrderType } from "pages/checkout/hooks/types.ts"; function MenuPage() { const { id } = useParams(); @@ -45,6 +47,8 @@ function MenuPage() { const { isMobile, isTablet, isDesktop } = useBreakPoint(); const isLoading = isLoadingRestaurant || isLoadingMenu; + const orderTypeOptions = enumToSelectOptions(OrderType, t, "orderTypes"); + // Automatically load restaurant taxes when restaurant data is available useRestaurant(restaurant); @@ -97,10 +101,11 @@ function MenuPage() { className={`${styles.headerFloatingBtn} ${styles.orderTypeSelectContainer}`} >