Refactor solutions section layout

This commit is contained in:
gpt-engineer-app[bot]
2025-10-24 13:40:13 +00:00
parent bb1051516d
commit 3540e3ed7f

View File

@ -205,10 +205,9 @@ const Index = () => {
</p> </p>
</div> </div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-8 mb-12"> <div className="mb-12">
<div className="space-y-6"> <h3 className="text-2xl font-semibold text-primary mb-6">Short-Term Solutions</h3>
<div className="bg-card p-6 rounded-lg shadow-[var(--shadow-card)] border border-border"> <div className="bg-card p-6 rounded-lg shadow-[var(--shadow-card)] border border-border mb-8">
<h3 className="text-xl font-semibold text-primary mb-3">Short-Term Solutions</h3>
<ul className="space-y-3 text-foreground"> <ul className="space-y-3 text-foreground">
<li className="flex items-start"> <li className="flex items-start">
<span className="text-accent font-bold mr-3">•</span> <span className="text-accent font-bold mr-3">•</span>
@ -232,9 +231,11 @@ const Index = () => {
</li> </li>
</ul> </ul>
</div> </div>
</div>
<div className="bg-card p-6 rounded-lg shadow-[var(--shadow-card)] border border-border"> <div className="mb-12">
<h3 className="text-xl font-semibold text-primary mb-3">Long-Term Solutions</h3> <h3 className="text-2xl font-semibold text-primary mb-6">Long-Term Solutions</h3>
<div className="bg-card p-6 rounded-lg shadow-[var(--shadow-card)] border border-border mb-8">
<ul className="space-y-3 text-foreground"> <ul className="space-y-3 text-foreground">
<li className="flex items-start"> <li className="flex items-start">
<span className="text-accent font-bold mr-3">1.</span> <span className="text-accent font-bold mr-3">1.</span>
@ -256,12 +257,14 @@ const Index = () => {
</div> </div>
</div> </div>
<div className="space-y-6"> <div className="mb-12">
<h3 className="text-2xl font-semibold text-primary mb-6">Available Parking Infrastructure</h3>
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
<div className="rounded-lg overflow-hidden shadow-[var(--shadow-card)] border-2 border-accent"> <div className="rounded-lg overflow-hidden shadow-[var(--shadow-card)] border-2 border-accent">
<img <img
src={doubletreeHilton} src={doubletreeHilton}
alt="DoubleTree Hilton with underground parking beneath Enterprise Place" alt="DoubleTree Hilton with underground parking beneath Enterprise Place"
className="w-full h-[200px] object-cover" className="w-full h-[250px] object-cover"
/> />
<div className="bg-accent/5 p-4 border-t-2 border-accent"> <div className="bg-accent/5 p-4 border-t-2 border-accent">
<h3 className="font-semibold text-lg text-primary">DoubleTree Hilton - The Ideal Solution</h3> <h3 className="font-semibold text-lg text-primary">DoubleTree Hilton - The Ideal Solution</h3>
@ -273,7 +276,7 @@ const Index = () => {
<img <img
src={asahiBuilding} src={asahiBuilding}
alt="Asahi Building with underground parking" alt="Asahi Building with underground parking"
className="w-full h-[200px] object-cover" className="w-full h-[250px] object-cover"
/> />
<div className="bg-card p-4 border-t border-border"> <div className="bg-card p-4 border-t border-border">
<h3 className="font-semibold text-lg text-primary">Asahi Building</h3> <h3 className="font-semibold text-lg text-primary">Asahi Building</h3>
@ -285,7 +288,7 @@ const Index = () => {
<img <img
src={unusedSite} src={unusedSite}
alt="Unused building site that could be converted to parking" alt="Unused building site that could be converted to parking"
className="w-full h-[200px] object-cover" className="w-full h-[250px] object-cover"
/> />
<div className="bg-card p-4 border-t border-border"> <div className="bg-card p-4 border-t border-border">
<h3 className="font-semibold text-lg text-primary">Unused Building Site</h3> <h3 className="font-semibold text-lg text-primary">Unused Building Site</h3>
@ -297,7 +300,7 @@ const Index = () => {
<img <img
src={dukesCourt} src={dukesCourt}
alt="Dukes Court with car park facilities" alt="Dukes Court with car park facilities"
className="w-full h-[200px] object-cover" className="w-full h-[250px] object-cover"
/> />
<div className="bg-card p-4 border-t border-border"> <div className="bg-card p-4 border-t border-border">
<h3 className="font-semibold text-lg text-primary">Dukes Court</h3> <h3 className="font-semibold text-lg text-primary">Dukes Court</h3>
@ -309,7 +312,7 @@ const Index = () => {
<img <img
src={emptyBuildingParking} src={emptyBuildingParking}
alt="Empty building with available parking spaces" alt="Empty building with available parking spaces"
className="w-full h-[200px] object-cover" className="w-full h-[250px] object-cover"
/> />
<div className="bg-card p-4 border-t border-border"> <div className="bg-card p-4 border-t border-border">
<h3 className="font-semibold text-lg text-primary">Underutilized Parking</h3> <h3 className="font-semibold text-lg text-primary">Underutilized Parking</h3>