Files
Patriot_Hacks-24/Project/app/mission/page.tsx
2025-10-24 02:07:59 -04:00

54 lines
3.9 KiB
TypeScript
Executable File

'use client'
import Image from 'next/image';
import { Button } from "@nextui-org/react";
import Link from "next/link";
export default function MissionPage() {
return (
<div className="relative min-h-screen bg-orange-900/5">
{/* Large "About Us" text at the top */}
<div className="absolute top-0 left-0 right-0 z-10 flex justify-center items-center h-40">
<h1 className="text-6xl font-bold bg-gradient-to-r from-[#FF705B] to-[#FFB457] text-transparent bg-clip-text drop-shadow-lg">Our Mission</h1>
</div>
<div className="relative min-h-screen">
<Image
src="/demo.png"
alt="Demo image"
width={1920}
height={3000}
className="w-full h-auto"
/>
<div className="absolute bottom-0 left-0 right-0 bg-gradient-to-t from-background via-background to-transparent h-80 dark:from-background dark:via-background">
{/* text at the bottom */}
<div className="flex flex-col self-end items-center pb-16">
<p className="mt-40 text-lg text-center max-w-2xl">
One of the most neglected aspects of a building&apos;s carbon footprint is waste mismanagement and poor recycling practices. According to the EPA, landfills account for <span className="bg-gradient-to-r from-[#FF705B] to-[#FFB457] text-transparent bg-clip-text">15% of U.S. methane emissions</span>, with commercial buildings generating over <span className="bg-gradient-to-r from-[#FF705B] to-[#FFB457] text-transparent bg-clip-text">30% of the nation&apos;s total waste</span>.
<br />
<br />
Studies show that up to <span className="bg-gradient-to-r from-[#FF705B] to-[#FFB457] text-transparent bg-clip-text">25% of items</span> in recycling bins are actually non-recyclable, contaminating entire loads. Only 32% of commercial waste is recycled, compared to a potential 75% that could be. Proper recycling can reduce a building&apos;s carbon emissions <span className="bg-gradient-to-r from-[#FF705B] to-[#FFB457] text-transparent bg-clip-text">by up to 40%</span>.
<br />
<br />
<strong>Carbin</strong> uses a machine learning algorithm to identify the type of waste at the trash chute, nudging the occupants to recycle correctly with a friendly reminder. Our long term goal is to <span className="bg-gradient-to-r from-[#FF705B] to-[#FFB457] text-transparent bg-clip-text">educate building occupants</span>, something we know will truly revolutionize waste management, make efficient sorting and recycling the norm, and significantly curtail the carbon impact of our daily operations.
</p>
<Button
as={Link}
href="/buildings"
variant="solid"
size="lg"
endContent={
<svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5" viewBox="0 0 20 20" fill="currentColor">
<path fillRule="evenodd" d="M10.293 3.293a1 1 0 011.414 0l6 6a1 1 0 010 1.414l-6 6a1 1 0 01-1.414-1.414L14.586 11H3a1 1 0 110-2h11.586l-4.293-4.293a1 1 0 010-1.414z" clipRule="evenodd" />
</svg>
}
className="mb-2 mt-6 bg-orange-500 text-white"
>
Intrigued? Explore participating buildings
</Button>
</div>
</div>
</div>
</div >
);
}