Code edited in Lovable Code Editor
This commit is contained in:
@ -4,74 +4,18 @@ import { StatCard } from "@/components/StatCard";
|
|||||||
|
|
||||||
const Briefing = () => {
|
const Briefing = () => {
|
||||||
return (
|
return (
|
||||||
<div className="min-h-screen bg-background print:bg-white">
|
<div className="min-h-screen bg-background">
|
||||||
<style>{`
|
|
||||||
@media print {
|
|
||||||
@page {
|
|
||||||
margin: 0.5cm;
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
print-color-adjust: exact;
|
|
||||||
-webkit-print-color-adjust: exact;
|
|
||||||
}
|
|
||||||
|
|
||||||
nav {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
section {
|
|
||||||
padding: 0.5rem !important;
|
|
||||||
margin: 0 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1, h2, h3, p, span, div {
|
|
||||||
color: #000 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.stat-card {
|
|
||||||
background: #fff !important;
|
|
||||||
border: 2px solid #000 !important;
|
|
||||||
box-shadow: none !important;
|
|
||||||
padding: 0.5rem !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.stat-card svg {
|
|
||||||
width: 1.5rem !important;
|
|
||||||
height: 1.5rem !important;
|
|
||||||
margin-bottom: 0.25rem !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.stat-number {
|
|
||||||
color: #000 !important;
|
|
||||||
font-size: 1.5rem !important;
|
|
||||||
margin-bottom: 0.25rem !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.stat-label {
|
|
||||||
color: #000 !important;
|
|
||||||
font-size: 0.75rem !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
svg {
|
|
||||||
color: #000 !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
`}</style>
|
|
||||||
{/* Header */}
|
{/* Header */}
|
||||||
<section className="py-12 px-6">
|
<section className="py-12 px-6">
|
||||||
<div className="max-w-4xl mx-auto text-center">
|
<div className="max-w-4xl mx-auto text-center">
|
||||||
<h1 className="text-6xl md:text-7xl font-black text-primary mb-6 leading-tight uppercase">
|
<h1 className="text-6xl md:text-7xl font-black text-primary mb-6 leading-tight">
|
||||||
Save Victoria Way Carpark
|
Save Victoria Way Carpark
|
||||||
</h1>
|
</h1>
|
||||||
<p className="text-3xl md:text-4xl text-foreground font-semibold mb-8">
|
<p className="text-2xl md:text-3xl text-foreground font-semibold mb-4">
|
||||||
Dear Enterprise Place Residents
|
Dear Woking Residents
|
||||||
</p>
|
</p>
|
||||||
<p className="text-xl md:text-2xl text-foreground mb-4">
|
<p className="text-lg text-muted-foreground">
|
||||||
Our carpark was closed. We now walk through town to reach our cars.
|
Join your neighbors in calling for parking solutions
|
||||||
</p>
|
|
||||||
<p className="text-xl md:text-2xl text-foreground font-semibold">
|
|
||||||
This is not safe. This is not sustainable.
|
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
@ -79,40 +23,128 @@ const Briefing = () => {
|
|||||||
{/* Impact Stats */}
|
{/* Impact Stats */}
|
||||||
<section className="py-12 px-6 bg-muted">
|
<section className="py-12 px-6 bg-muted">
|
||||||
<div className="max-w-6xl mx-auto">
|
<div className="max-w-6xl mx-auto">
|
||||||
<h2 className="text-3xl font-bold text-primary mb-8 text-center uppercase">The Impact</h2>
|
<div className="grid grid-cols-1 md:grid-cols-4 gap-6">
|
||||||
<div className="impact-grid grid grid-cols-1 md:grid-cols-4 gap-6 print:grid-cols-4 print:gap-2">
|
<StatCard icon={Home} number="120+" label="Affected Households" />
|
||||||
<StatCard icon={Home} number="120+" label="Households" />
|
<StatCard icon={Users} number="300+" label="Residents Impacted" />
|
||||||
<StatCard icon={Users} number="300+" label="Residents" />
|
<StatCard icon={Car} number="0" label="Parking Spaces Provided" />
|
||||||
<StatCard icon={Car} number="0" label="Parking" />
|
<StatCard icon={AlertTriangle} number="0" label="Council Updates Since Closure" />
|
||||||
<StatCard icon={AlertTriangle} number="0" label="Updates" />
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
{/* What We Demand */}
|
{/* The Situation */}
|
||||||
<section className="py-12 px-6">
|
<section className="py-12 px-6">
|
||||||
<div className="max-w-4xl mx-auto text-center">
|
<div className="max-w-4xl mx-auto">
|
||||||
<h2 className="text-3xl font-bold text-primary mb-8 uppercase">What We Demand</h2>
|
<div className="bg-secondary/10 border-l-4 border-secondary p-6 rounded-r-lg mb-6">
|
||||||
|
<h3 className="text-xl font-semibold text-primary mb-2">Your Carpark Was Closed</h3>
|
||||||
<div className="mb-8">
|
<p className="text-foreground">
|
||||||
<h3 className="text-4xl md:text-5xl font-bold text-primary mb-6">Better. Closer. Safer. Parking.</h3>
|
Victoria Way Carpark was closed due to safety concerns. We support the council's decision to prioritize public safety, but Enterprise Place residents deserve parking solutions.
|
||||||
<p className="text-xl md:text-2xl text-foreground">
|
|
||||||
The council must provide Enterprise Place residents with a proper parking solution.
|
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div className="bg-card p-6 rounded-lg shadow-[var(--shadow-card)] border border-border mb-6">
|
||||||
|
<h3 className="text-xl font-semibold text-primary mb-4">What Enterprise Place Needs:</h3>
|
||||||
|
<ul className="space-y-3 text-foreground">
|
||||||
|
<li className="flex items-start">
|
||||||
|
<span className="text-accent font-bold mr-3">1.</span>
|
||||||
|
<span><strong>Regular Updates:</strong> No information has been provided on safety surveys, remediation progress, or future plans</span>
|
||||||
|
</li>
|
||||||
|
<li className="flex items-start">
|
||||||
|
<span className="text-accent font-bold mr-3">2.</span>
|
||||||
|
<span><strong>Parking Solutions:</strong> You need adequate parking for your vehicles—especially for night workers, families with children, and residents with disabilities</span>
|
||||||
|
</li>
|
||||||
|
<li className="flex items-start">
|
||||||
|
<span className="text-accent font-bold mr-3">3.</span>
|
||||||
|
<span><strong>Recognition of Impact:</strong> Walking through town late at night isn't safe, and carrying shopping long distances isn't practical</span>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* Proposed Solutions */}
|
||||||
|
<section className="py-12 px-6 bg-muted">
|
||||||
|
<div className="max-w-4xl mx-auto">
|
||||||
|
<h2 className="text-3xl font-bold text-primary mb-6">Solutions for You</h2>
|
||||||
|
|
||||||
|
<div className="bg-accent/10 border-l-4 border-accent p-6 rounded-r-lg mb-6">
|
||||||
|
<h3 className="text-xl font-semibold text-primary mb-2">The Answer Is Right Beneath Your Feet</h3>
|
||||||
|
<p className="text-foreground">
|
||||||
|
The DoubleTree Hilton hotel has an underground car park that runs directly beneath Enterprise Place—beneath YOUR building.
|
||||||
|
Why don't you have access to parking that sits directly under your homes?
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="bg-card p-6 rounded-lg shadow-[var(--shadow-card)] border border-border mb-6">
|
||||||
|
<h3 className="text-lg font-semibold text-primary mb-3">Short-Term Options:</h3>
|
||||||
|
<ul className="space-y-2 text-foreground text-sm">
|
||||||
|
<li className="flex items-start">
|
||||||
|
<span className="text-accent mr-2">•</span>
|
||||||
|
<span>Temporary parking permits for Enterprise Place residents</span>
|
||||||
|
</li>
|
||||||
|
<li className="flex items-start">
|
||||||
|
<span className="text-accent mr-2">•</span>
|
||||||
|
<span>Negotiate with nearby facilities (Dukes Court, Asahi Building)</span>
|
||||||
|
</li>
|
||||||
|
<li className="flex items-start">
|
||||||
|
<span className="text-accent mr-2">•</span>
|
||||||
|
<span>Convert unused sites to temporary parking</span>
|
||||||
|
</li>
|
||||||
|
<li className="flex items-start">
|
||||||
|
<span className="text-accent mr-2">•</span>
|
||||||
|
<span>Discounted rates at town centre carparks</span>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="bg-card p-6 rounded-lg shadow-[var(--shadow-card)] border border-border">
|
||||||
|
<h3 className="text-lg font-semibold text-primary mb-3">Long-Term Solutions:</h3>
|
||||||
|
<ul className="space-y-2 text-foreground text-sm">
|
||||||
|
<li className="flex items-start">
|
||||||
|
<span className="text-accent mr-2">1.</span>
|
||||||
|
<span>Provide access to DoubleTree Hilton underground car park</span>
|
||||||
|
</li>
|
||||||
|
<li className="flex items-start">
|
||||||
|
<span className="text-accent mr-2">2.</span>
|
||||||
|
<span>Repair and reopen Victoria Way Carpark</span>
|
||||||
|
</li>
|
||||||
|
<li className="flex items-start">
|
||||||
|
<span className="text-accent mr-2">3.</span>
|
||||||
|
<span>Build new multi-storey parking facility</span>
|
||||||
|
</li>
|
||||||
|
<li className="flex items-start">
|
||||||
|
<span className="text-accent mr-2">4.</span>
|
||||||
|
<span>Dedicated resident parking zones</span>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
{/* Call to Action */}
|
{/* Call to Action */}
|
||||||
<section className="py-12 px-6 bg-muted">
|
<section className="py-12 px-6">
|
||||||
<div className="max-w-4xl mx-auto text-center">
|
<div className="max-w-4xl mx-auto text-center">
|
||||||
<h2 className="text-3xl font-bold text-primary mb-8 uppercase">Demand Action</h2>
|
|
||||||
<div className="bg-primary/10 border-2 border-primary p-8 rounded-lg">
|
<div className="bg-primary/10 border-2 border-primary p-8 rounded-lg">
|
||||||
<h3 className="text-4xl font-bold text-primary mb-6">Sign the Petition</h3>
|
<h2 className="text-4xl font-bold text-primary mb-4">Make Your Voice Heard</h2>
|
||||||
<p className="text-5xl md:text-6xl font-bold text-primary">savevictoriaway.com</p>
|
<p className="text-lg text-foreground mb-6">
|
||||||
|
Join your fellow Enterprise Place residents and hundreds of others in demanding parking solutions.
|
||||||
|
</p>
|
||||||
|
<div className="bg-card p-4 rounded-lg inline-block">
|
||||||
|
<p className="text-sm text-muted-foreground mb-1">Sign the petition and learn more:</p>
|
||||||
|
<p className="text-2xl font-bold text-primary">savevictoriawaycarpark.com</p>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
{/* Footer */}
|
||||||
|
<footer className="py-8 px-6 bg-muted border-t border-border">
|
||||||
|
<div className="max-w-4xl mx-auto text-center">
|
||||||
|
<p className="text-sm text-muted-foreground">
|
||||||
|
For more information visit <strong className="text-foreground">savevictoriawaycarpark.com</strong>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
Reference in New Issue
Block a user