From 96e28e3017ca840743e773557bf998d3e6d25e60 Mon Sep 17 00:00:00 2001 From: Paul Bailey Date: Sun, 16 Nov 2025 17:12:57 +0000 Subject: [PATCH] Add Why Clean Our Beaches page with environmental facts - Create new WhyCleanPage with comprehensive environmental information - Include sections on marine life impact, wave power generation, economic impact, and human health - Add button to homepage for easy access to environmental facts - Update routing to include /why-clean path - Use responsive button layout with flex-wrap for mobile support --- src/App.tsx | 11 ++- src/pages/HomePage.tsx | 16 +++- src/pages/WhyCleanPage.tsx | 160 +++++++++++++++++++++++++++++++++++++ src/pages/index.ts | 1 + 4 files changed, 185 insertions(+), 3 deletions(-) create mode 100644 src/pages/WhyCleanPage.tsx diff --git a/src/App.tsx b/src/App.tsx index 96f33bc..3574907 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -20,7 +20,8 @@ import { AnalyticsPage, PhotoUploadDemo, LocationSelectorDemo, - ReportDetailDemo + ReportDetailDemo, + WhyCleanPage } from './pages'; const queryClient = new QueryClient({ @@ -65,6 +66,14 @@ function App() { } /> + + + + } + /> {/* Protected routes */} -
+
View Map + + Why Clean Our Beaches? +
-
+
View Map + + Why Clean Our Beaches? +
diff --git a/src/pages/WhyCleanPage.tsx b/src/pages/WhyCleanPage.tsx new file mode 100644 index 0000000..d1e48ff --- /dev/null +++ b/src/pages/WhyCleanPage.tsx @@ -0,0 +1,160 @@ +/** + * Why Clean Our Beaches page - Environmental facts and impact information + */ +export function WhyCleanPage() { + return ( +
+
+ {/* Header */} +
+

+ Why Clean Our Beaches? +

+

+ Understanding the environmental impact of beach litter and why action matters +

+
+ + {/* Environmental Impact Section */} +
+

+ 🌊 + Environmental Impact +

+
+

+ Beach litter poses a severe threat to marine ecosystems and coastal environments. + Plastic waste, which makes up the majority of beach litter, can take hundreds of + years to decompose, breaking down into microplastics that contaminate the food chain. +

+

+ Key impacts include: +

+
    +
  • Marine animals mistake plastic for food, leading to ingestion and entanglement
    • +
  • Toxic chemicals from degrading plastics leach into water and sediment
    • +
  • Microplastics accumulate in fish and shellfish, entering the human food chain
    • +
  • Beach litter destroys habitats for nesting birds and marine life
    • +
  • Coastal vegetation is damaged by debris accumulation
    • +
+
+
+ + {/* Marine Life Section */} +
+

+ 🐢 + Impact on Marine Life +

+
+

+ Over 100,000 marine mammals and sea turtles die each year from plastic entanglement + or ingestion. Seabirds are particularly vulnerable, with studies showing that 90% of + seabirds have plastic in their stomachs. +

+

+ Specific threats: +

+
    +
  • Fishing nets and lines cause entanglement and drowning
    • +
  • Plastic bags are mistaken for jellyfish by sea turtles
    • +
  • Bottle caps and small plastics block digestive systems
    • +
  • Chemical pollutants affect reproduction and development
    • +
  • Ghost fishing gear continues to trap and kill marine life for years
    • +
+
+
+ + {/* Renewable Energy Section */} +
+

+ ⚡ + Impact on Wave Power Generation +

+
+

+ Ireland is investing heavily in renewable ocean energy, including wave power generators. + Beach and ocean litter poses significant operational challenges to these technologies: +

+
    +
  • Floating debris can damage or clog wave energy converters
    • +
  • Plastic waste interferes with moving parts and turbines
    • +
  • Fishing nets and ropes can entangle underwater equipment
    • +
  • Maintenance costs increase due to debris removal requirements
    • +
  • Equipment efficiency decreases when fouled by marine litter
    • +
  • Installation and operation of offshore devices becomes more hazardous
    • +
+

+ Clean oceans are essential for Ireland's transition to renewable energy and achieving + climate goals. Marine litter directly undermines these efforts. +

+
+
+ + {/* Economic Impact Section */} +
+

+ 💰 + Economic Impact +

+
+

+ Beach litter has significant economic consequences for coastal communities: +

+
    +
  • Tourism revenue decreases as beaches become less attractive
    • +
  • Local governments spend millions annually on beach cleanup
    • +
  • Fishing industries suffer from contaminated catches and damaged equipment
    • +
  • Property values decline in areas with polluted coastlines
    • +
  • Healthcare costs increase from pollution-related illnesses
    • +
+
+
+ + {/* Human Health Section */} +
+

+ 🏥 + Human Health Concerns +

+
+

+ Beach litter directly affects human health and safety: +

+
    +
  • Sharp objects like broken glass and metal cause injuries
    • +
  • Microplastics in seafood may contain harmful chemicals
    • +
  • Bacteria and pathogens thrive on marine debris
    • +
  • Chemical pollutants from plastics can cause hormonal disruption
    • +
  • Beach users face increased risk of cuts, infections, and illness
    • +
+
+
+ + {/* What You Can Do Section */} +
+

+ 🤝 + What You Can Do +

+
+

+ Every action counts in protecting Ireland's beautiful coastline. Here's how you can help: +

+
    +
  • Report litter using this platform to track pollution patterns
    • +
  • Participate in organized beach cleanup events
    • +
  • Reduce single-use plastics in your daily life
    • +
  • Properly dispose of waste and recycle whenever possible
    • +
  • Educate others about the impact of marine litter
    • +
  • Support policies and businesses that prioritize ocean health
    • +
+

+ Together, we can make a difference. Start by reporting litter today. +

+
+
+
+
+ ); +} diff --git a/src/pages/index.ts b/src/pages/index.ts index 665dae7..0a951cb 100644 --- a/src/pages/index.ts +++ b/src/pages/index.ts @@ -6,3 +6,4 @@ export { AnalyticsPage } from './AnalyticsPage'; export { PhotoUploadDemo } from './PhotoUploadDemo'; export { default as LocationSelectorDemo } from './LocationSelectorDemo'; export { ReportDetailDemo } from './ReportDetailDemo'; +export { WhyCleanPage } from './WhyCleanPage';