Fix maps address dropdown not visible #4499
4 changed files+35−25
Modifiedfrontend/src/components/booking/AddressInput.jsx+1−1View fileUnifiedSplit
@@ -99,7 +99,7 @@ export default function AddressInput({ label, value, onChange, placeholder, icon
9999 </div>
100100
101101 {open && suggestions.length > 0 && (
102 <ul className="absolute z-50 w-full mt-1 bg-white border border-gray-200 rounded-lg shadow-lg max-h-60 overflow-y-auto">
102 <ul className="absolute z-[60] w-full mt-1 bg-white border border-gray-200 rounded-lg shadow-lg max-h-60 overflow-y-auto">
103103 {suggestions.map((s, i) => (
104104 <li
105105 key={s.place_id || i}
Modifiedfrontend/src/components/layout/Layout.jsx+6−0View fileUnifiedSplit
@@ -1,3 +1,4 @@
1import { useEffect } from 'react'
12import { Outlet, useLocation } from 'react-router-dom'
23import Header from './Header'
34import Footer from './Footer'
@@ -7,6 +8,11 @@ export default function Layout() {
78 // Pages with full-bleed hero sections that extend behind the transparent header
89 const isHeroPage = location.pathname === '/'
910
11 // Scroll to top on route change
12 useEffect(() => {
13 window.scrollTo(0, 0)
14 }, [location.pathname])
15
1016 return (
1117 <div className="flex flex-col min-h-screen">
1218 <Header />
Modifiedfrontend/src/components/pages/BookNow.jsx+1−1View fileUnifiedSplit
@@ -195,7 +195,7 @@ export default function BookNow() {
195195 </AnimatePresence>
196196
197197 {/* Form card */}
198 <div className="bg-white rounded-2xl border border-gray-200 shadow-sm overflow-hidden">
198 <div className="bg-white rounded-2xl border border-gray-200 shadow-sm">
199199 <AnimatePresence mode="wait">
200200
201201 {/* ── Step 0: Trip Details ── */}
Modifiedfrontend/src/components/pages/Home.jsx+27−23View fileUnifiedSplit
@@ -154,29 +154,33 @@ export default function Home() {
154154 </div>
155155 <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
156156 {SERVICES.map((service, i) => (
157 <motion.div
158 key={service.title}
159 initial="hidden"
160 whileInView="visible"
161 custom={i}
162 variants={fadeUp}
163 viewport={{ once: true, margin: '-50px' }}
164 className="bg-white rounded-2xl p-8 border border-gray-100 shadow-sm hover:shadow-lg hover:border-gold/30 transition-all duration-300 group"
165 >
166 <div className="w-14 h-14 bg-gold/10 rounded-xl flex items-center justify-center mb-6 group-hover:bg-gold group-hover:shadow-lg transition-all duration-300">
167 <service.icon className="w-7 h-7 text-gold group-hover:text-white transition-colors duration-200" />
168 </div>
169 <h3 className="text-lg font-semibold text-gray-900 mb-3">{service.title}</h3>
170 <p className="text-gray-500 mb-6 text-sm leading-relaxed">{service.description}</p>
171 <ul className="space-y-2">
172 {service.features.map((f) => (
173 <li key={f} className="flex items-center text-sm text-gray-600">
174 <Check className="w-4 h-4 text-gold mr-2.5 shrink-0" />
175 {f}
176 </li>
177 ))}
178 </ul>
179 </motion.div>
157 <Link key={service.title} to="/book-now" className="block">
158 <motion.div
159 initial="hidden"
160 whileInView="visible"
161 custom={i}
162 variants={fadeUp}
163 viewport={{ once: true, margin: '-50px' }}
164 className="bg-white rounded-2xl p-8 border border-gray-100 shadow-sm hover:shadow-lg hover:border-gold/30 transition-all duration-300 group h-full"
165 >
166 <div className="w-14 h-14 bg-gold/10 rounded-xl flex items-center justify-center mb-6 group-hover:bg-gold group-hover:shadow-lg transition-all duration-300">
167 <service.icon className="w-7 h-7 text-gold group-hover:text-white transition-colors duration-200" />
168 </div>
169 <h3 className="text-lg font-semibold text-gray-900 mb-3">{service.title}</h3>
170 <p className="text-gray-500 mb-6 text-sm leading-relaxed">{service.description}</p>
171 <ul className="space-y-2">
172 {service.features.map((f) => (
173 <li key={f} className="flex items-center text-sm text-gray-600">
174 <Check className="w-4 h-4 text-gold mr-2.5 shrink-0" />
175 {f}
176 </li>
177 ))}
178 </ul>
179 <span className="inline-flex items-center gap-1 text-gold text-sm font-semibold mt-6 group-hover:gap-2 transition-all">
180 Book Now <ArrowRight className="w-4 h-4" />
181 </span>
182 </motion.div>
183 </Link>
180184 ))}
181185 </div>
182186 </div>
183187
c comment · e edit title · m merge · a approve · r request changes · ? shortcuts