Merge version_1 into main #2
217
src/app/page.tsx
217
src/app/page.tsx
@@ -2,6 +2,7 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import { Shield, AlertTriangle, TrendingUp } from "lucide-react";
|
||||
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
||||
import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
|
||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||
@@ -28,18 +29,11 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Overview",
|
||||
id: "overview",
|
||||
},
|
||||
{
|
||||
name: "Impacts",
|
||||
id: "impacts",
|
||||
},
|
||||
{
|
||||
name: "Responses",
|
||||
id: "responses",
|
||||
},
|
||||
{ name: "Overview", id: "overview" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Impacts", id: "impacts" },
|
||||
{ name: "Responses", id: "responses" },
|
||||
{ name: "FAQ", id: "faq" }
|
||||
]}
|
||||
brandName="The Great Smog"
|
||||
/>
|
||||
@@ -47,42 +41,16 @@ export default function LandingPage() {
|
||||
|
||||
<div id="overview" data-section="overview">
|
||||
<HeroBillboardRotatedCarousel
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="The Great Smog Event"
|
||||
description="A catastrophic meteorological event that paralyzed the London region in December 1952. Spanning the UK, this high-pressure system trapped toxic industrial pollutants across the Thames valley, creating a dense, deadly atmosphere."
|
||||
carouselItems={[
|
||||
{
|
||||
id: "1",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-green-mountain-covered-by-fog_198169-39.jpg?_wi=1",
|
||||
imageAlt: "London Smog 1952",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-green-mountain-covered-by-fog_198169-39.jpg?_wi=2",
|
||||
imageAlt: "Smog atmosphere",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-green-mountain-covered-by-fog_198169-39.jpg?_wi=3",
|
||||
imageAlt: "Industrial city haze",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-green-mountain-covered-by-fog_198169-39.jpg?_wi=4",
|
||||
imageAlt: "Pollution dense air",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-green-mountain-covered-by-fog_198169-39.jpg?_wi=5",
|
||||
imageAlt: "Historical event",
|
||||
},
|
||||
{
|
||||
id: "6",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-green-mountain-covered-by-fog_198169-39.jpg?_wi=6",
|
||||
imageAlt: "Atmospheric event",
|
||||
},
|
||||
{ id: "1", imageSrc: "http://img.b2bpic.net/free-photo/view-green-mountain-covered-by-fog_198169-39.jpg", imageAlt: "London Smog 1952" },
|
||||
{ id: "2", imageSrc: "http://img.b2bpic.net/free-photo/view-green-mountain-covered-by-fog_198169-39.jpg", imageAlt: "Smog atmosphere" },
|
||||
{ id: "3", imageSrc: "http://img.b2bpic.net/free-photo/view-green-mountain-covered-by-fog_198169-39.jpg", imageAlt: "Industrial city haze" },
|
||||
{ id: "4", imageSrc: "http://img.b2bpic.net/free-photo/view-green-mountain-covered-by-fog_198169-39.jpg", imageAlt: "Pollution dense air" },
|
||||
{ id: "5", imageSrc: "http://img.b2bpic.net/free-photo/view-green-mountain-covered-by-fog_198169-39.jpg", imageAlt: "Historical event" },
|
||||
{ id: "6", imageSrc: "http://img.b2bpic.net/free-photo/view-green-mountain-covered-by-fog_198169-39.jpg", imageAlt: "Atmospheric event" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -94,21 +62,12 @@ export default function LandingPage() {
|
||||
title="Geographical Context"
|
||||
description="The Great Smog originated from a stationary anticyclone over London, England. This high-pressure event extended across the British Isles, impacting dense urban corridors and suffocating the heart of the United Kingdom."
|
||||
bulletPoints={[
|
||||
{
|
||||
title: "Location",
|
||||
description: "London, United Kingdom, expanding to coastal regions.",
|
||||
},
|
||||
{
|
||||
title: "Time Period",
|
||||
description: "December 5th to December 9th, 1952.",
|
||||
},
|
||||
{
|
||||
title: "Scope",
|
||||
description: "A widespread high-pressure event trapping coal smoke and industrial output.",
|
||||
},
|
||||
{ title: "Location", description: "London, United Kingdom, expanding to coastal regions." },
|
||||
{ title: "Time Period", description: "December 5th to December 9th, 1952." },
|
||||
{ title: "Scope", description: "A widespread high-pressure event trapping coal smoke and industrial output." }
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/view-green-mountain-covered-by-fog_198169-39.jpg?_wi=7"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/view-green-mountain-covered-by-fog_198169-39.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -118,61 +77,11 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
id: "1",
|
||||
title: "Social & Health",
|
||||
author: "Healthcare",
|
||||
description: "Travel was halted by near-zero visibility. Hospitals faced an overwhelming surge of respiratory failure cases.",
|
||||
tags: [
|
||||
"Health Risk",
|
||||
"Visibility",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-mask-stands-street_1157-31565.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "Economic & Agriculture",
|
||||
author: "Economy",
|
||||
description: "Agricultural output suffered drastically as sunlight was blocked, leading to immediate yield reductions.",
|
||||
tags: [
|
||||
"Prices",
|
||||
"Yields",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/resilient-life-desert_23-2151961985.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "Environmental Event",
|
||||
author: "Environment",
|
||||
description: "The high-pressure system exacerbated stagnant air, preventing pollutant dispersion.",
|
||||
tags: [
|
||||
"Stagnation",
|
||||
"Heatwave",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/global-warming-illustration_23-2151878570.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
title: "Urban Logistics",
|
||||
author: "Transport",
|
||||
description: "Public transportation was completely paralyzed, and emergency services were unable to reach patients.",
|
||||
tags: [
|
||||
"Logistics",
|
||||
"Crisis",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-green-mountain-covered-by-fog_198169-39.jpg?_wi=8",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
title: "Industrial Output",
|
||||
author: "Manufacturing",
|
||||
description: "Industrial productivity ground to a halt as visibility inside factories dropped to critical levels.",
|
||||
tags: [
|
||||
"Industry",
|
||||
"Coal",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/global-warming-illustration_23-2151878570.jpg?_wi=2",
|
||||
},
|
||||
{ id: "1", title: "Social & Health", author: "Healthcare", description: "Travel was halted by near-zero visibility. Hospitals faced an overwhelming surge of respiratory failure cases.", tags: ["Health Risk", "Visibility"], imageSrc: "http://img.b2bpic.net/free-photo/woman-mask-stands-street_1157-31565.jpg" },
|
||||
{ id: "2", title: "Economic & Agriculture", author: "Economy", description: "Agricultural output suffered drastically as sunlight was blocked, leading to immediate yield reductions.", tags: ["Prices", "Yields"], imageSrc: "http://img.b2bpic.net/free-photo/resilient-life-desert_23-2151961985.jpg" },
|
||||
{ id: "3", title: "Environmental Event", author: "Environment", description: "The high-pressure system exacerbated stagnant air, preventing pollutant dispersion.", tags: ["Stagnation", "Heatwave"], imageSrc: "http://img.b2bpic.net/free-photo/global-warming-illustration_23-2151878570.jpg" },
|
||||
{ id: "4", title: "Urban Logistics", author: "Transport", description: "Public transportation was completely paralyzed, and emergency services were unable to reach patients.", tags: ["Logistics", "Crisis"], imageSrc: "http://img.b2bpic.net/free-photo/view-green-mountain-covered-by-fog_198169-39.jpg" },
|
||||
{ id: "5", title: "Industrial Output", author: "Manufacturing", description: "Industrial productivity ground to a halt as visibility inside factories dropped to critical levels.", tags: ["Industry", "Coal"], imageSrc: "http://img.b2bpic.net/free-photo/global-warming-illustration_23-2151878570.jpg" }
|
||||
]}
|
||||
title="Catastrophic Impacts"
|
||||
description="The smog caused systemic collapse across various societal and economic sectors, revealing the vulnerability of modern urban infrastructure."
|
||||
@@ -185,21 +94,9 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
title: "Immediate Action",
|
||||
value: "Emergency protocols implemented, though initially low effectiveness due to scale.",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
title: "Long-term Policy",
|
||||
value: "Implementation of the Clean Air Act, highly sustainable and effective globally.",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
title: "Effectiveness",
|
||||
value: "High durability in policy, significantly reducing pollutant mortality rates long-term.",
|
||||
},
|
||||
{ id: "m1", icon: Shield, title: "Immediate Action", value: "Emergency protocols implemented, though initially low effectiveness due to scale." },
|
||||
{ id: "m2", icon: AlertTriangle, title: "Long-term Policy", value: "Implementation of the Clean Air Act, highly sustainable and effective globally." },
|
||||
{ id: "m3", icon: TrendingUp, title: "Effectiveness", value: "High durability in policy, significantly reducing pollutant mortality rates long-term." }
|
||||
]}
|
||||
title="Response Analysis"
|
||||
description="Short and long term evaluation of policy and systemic responses to such extreme meteorological events."
|
||||
@@ -211,31 +108,11 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "What caused the Great Smog?",
|
||||
content: "A combination of freezing weather, an anticyclone, and windless conditions trapping coal smoke.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "What was the long term impact?",
|
||||
content: "It directly led to the 1956 Clean Air Act, transforming British environmental policy forever.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Are these events still a threat?",
|
||||
content: "While modern emission standards reduce risk, urbanization and atmospheric stagnation still pose threats globally.",
|
||||
},
|
||||
{
|
||||
id: "f4",
|
||||
title: "How many died?",
|
||||
content: "Estimates suggest at least 4,000 to 12,000 direct and indirect deaths occurred.",
|
||||
},
|
||||
{
|
||||
id: "f5",
|
||||
title: "Did other cities suffer?",
|
||||
content: "Other industrial cities across the UK and parts of Europe experienced similar, though less severe, smog events during that month.",
|
||||
},
|
||||
{ id: "f1", title: "What caused the Great Smog?", content: "A combination of freezing weather, an anticyclone, and windless conditions trapping coal smoke." },
|
||||
{ id: "f2", title: "What was the long term impact?", content: "It directly led to the 1956 Clean Air Act, transforming British environmental policy forever." },
|
||||
{ id: "f3", title: "Are these events still a threat?", content: "While modern emission standards reduce risk, urbanization and atmospheric stagnation still pose threats globally." },
|
||||
{ id: "f4", title: "How many died?", content: "Estimates suggest at least 4,000 to 12,000 direct and indirect deaths occurred." },
|
||||
{ id: "f5", title: "Did other cities suffer?", content: "Other industrial cities across the UK and parts of Europe experienced similar, though less severe, smog events during that month." }
|
||||
]}
|
||||
title="Event Clarification"
|
||||
description="Answers to common questions regarding the Great Smog and high-pressure system disasters."
|
||||
@@ -245,35 +122,21 @@ export default function LandingPage() {
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/view-green-mountain-covered-by-fog_198169-39.jpg?_wi=9"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/view-green-mountain-covered-by-fog_198169-39.jpg"
|
||||
logoText="Great Smog Archive"
|
||||
columns={[
|
||||
{
|
||||
title: "About",
|
||||
items: [
|
||||
{
|
||||
label: "History",
|
||||
href: "#overview",
|
||||
},
|
||||
{
|
||||
label: "Analysis",
|
||||
href: "#impacts",
|
||||
},
|
||||
],
|
||||
title: "About", items: [
|
||||
{ label: "History", href: "#overview" },
|
||||
{ label: "Analysis", href: "#impacts" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Resources",
|
||||
items: [
|
||||
{
|
||||
label: "Clean Air Act",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Policy Archive",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
title: "Resources", items: [
|
||||
{ label: "Clean Air Act", href: "#" },
|
||||
{ label: "Policy Archive", href: "#" }
|
||||
]
|
||||
}
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user