fixed payment ,colors , add Mosque distance and fixed some elemnent
All checks were successful
Build frontend / build (push) Successful in 1m7s

This commit is contained in:
hamzaobed7
2026-08-11 02:29:54 +03:00
parent 9d3d02c88a
commit 4924e7c2f3
10 changed files with 474 additions and 874 deletions

View File

@ -54,6 +54,7 @@ import {
Dog,
CassetteTape,
Info,
Theater,
} from "lucide-react";
import { getRentProperty, getSaleProperty, getSalePropertyById, bookReservation, getAvailableDateRanges, getOwnerContactInformation, getMyRentListings, getMySaleListings } from "../../utils/api";
import AuthService from "../../services/AuthService";
@ -584,7 +585,7 @@ export default function PropertyDetailsPage() {
</div>
{/* Price */}
<div className="bg-amber-50 rounded-xl p-3 mb-4">
<div className="bg-[#1E293B] rounded-xl p-3 mb-4">
{property.isRent ? (
<div className="flex flex-wrap gap-6 items-end">
{property.priceDisplay.monthly > 0 && (
@ -856,12 +857,13 @@ export default function PropertyDetailsPage() {
return (
<div key={key} className="bg-gray-50 rounded-lg p-2 flex items-center gap-1.5">
{key === "School" && <School className="w-3.5 h-3.5 text-amber-500 flex-shrink-0" />}
{key === "Mosque" && <Theater className="w-3.5 h-3.5 text-amber-500 flex-shrink-0" />}
{key === "Hospital" && <Hospital className="w-3.5 h-3.5 text-amber-500 flex-shrink-0" />}
{key === "Restaurant" && <Store className="w-3.5 h-3.5 text-amber-500 flex-shrink-0" />}
{key === "University" && <GraduationCap className="w-3.5 h-3.5 text-amber-500 flex-shrink-0" />}
{key === "Park" && <TreePine className="w-3.5 h-3.5 text-amber-500 flex-shrink-0" />}
{key === "Mall" && <Building className="w-3.5 h-3.5 text-amber-500 flex-shrink-0" />}
{!["School", "Hospital", "Restaurant", "University", "Park", "Mall"].includes(key) && <MapPin className="w-3.5 h-3.5 text-amber-500 flex-shrink-0" />}
{!["School", "Hospital", "Restaurant", "University", "Park", "Mall","Mosque"].includes(key) && <MapPin className="w-3.5 h-3.5 text-amber-500 flex-shrink-0" />}
<div>
<div className="text-xs font-medium text-gray-900">{t(proxKey(key))}</div>
<div className="text-[10px] text-gray-500">
@ -952,7 +954,7 @@ export default function PropertyDetailsPage() {
<div className="grid grid-cols-2 gap-2 mb-3">
<button
onClick={() => setPricingMode("daily")}
className={`p-2.5 rounded-xl text-center border-2 transition-all ${effectivePricingMode === "daily" ? "border-amber-500 bg-amber-50" : "border-gray-200 hover:border-gray-300"}`}
className={`p-2.5 rounded-xl text-center border-2 transition-all ${effectivePricingMode === "daily" ? "border-amber-500 bg-[#1E293B]" : "border-gray-200 hover:border-gray-300"}`}
>
<div className="text-xs font-bold text-gray-900">{t("dailyRentLabel")}</div>
<div className="text-sm font-bold text-amber-600">
@ -961,7 +963,7 @@ export default function PropertyDetailsPage() {
</button>
<button
onClick={() => setPricingMode("monthly")}
className={`p-2.5 rounded-xl text-center border-2 transition-all ${effectivePricingMode === "monthly" ? "border-amber-500 bg-amber-50" : "border-gray-200 hover:border-gray-300"}`}
className={`p-2.5 rounded-xl text-center border-2 transition-all ${effectivePricingMode === "monthly" ? "border-amber-500 bg-[#1E293B]" : "border-gray-200 hover:border-gray-300"}`}
>
<div className="text-xs font-bold text-gray-900">{t("monthlyRentLabel")}</div>
<div className="text-sm font-bold text-amber-600">
@ -997,7 +999,7 @@ export default function PropertyDetailsPage() {
<span className="text-gray-500">{t("endDateLabel")}</span>
<span className="font-medium text-gray-900">{selectedEnd}</span>
</div>
<div className="border-t border-gray-200 my-1" />
<div className="border-t border-gray-200 my-1 " />
<div className="flex justify-between text-xs">
<span className="text-gray-500">{effectivePricingMode === "daily" ? t("numberOfDays") : t("numberOfMonths")}</span>
<span className="font-medium text-gray-900">
@ -1053,7 +1055,7 @@ export default function PropertyDetailsPage() {
{/* Login Dialog */}
{showLoginDialog && (
<div className="fixed inset-0 bg-black/50 flex items-center justify-center z-50" onClick={() => setShowLoginDialog(false)}>
<div className="bg-white rounded-2xl p-6 max-w-sm text-center mx-4" onClick={(e) => e.stopPropagation()}>
<div className="bg-[#1E293B] rounded-2xl p-6 max-w-sm text-center mx-4" onClick={(e) => e.stopPropagation()}>
<div className="w-16 h-16 bg-amber-100 rounded-full flex items-center justify-center mx-auto mb-4">
<LogIn className="w-8 h-8 text-amber-600" />
</div>