Skip to content

update barriers sections and footer icons #21

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
munyanezaarmel merged 2 commits into from
Mar 23, 2025
Merged

update barriers sections and footer icons #21

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
db0701d
update barriers sections and footer icons
munyanezaarmel Mar 23, 2025
98d15f5
fix lint
munyanezaarmel Mar 23, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 10 additions & 7 deletions app/components/BarrierCard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,16 +14,19 @@ interface BarrierCardProps {
export function BarrierCard({ icon, title }: BarrierCardProps) {
const getIcon = () => {
switch (icon) {
case "connectivity":
return <Wifi className="h-8 w-8 text-[#2D6A4F]" />
case "awareness":
return <HelpCircle className="h-8 w-8 text-[#2D6A4F]" />
return <HelpCircle className="h-8 w-8 text-[#17412C]" />

case "tool":
return <HelpCircleIcon className="h-8 w-8 text-[#17412C]" />

case "connectivity":
return <Wifi className="h-8 w-8 text-[#17412C]" />

case "cost":
return <DollarSign className="h-8 w-8 text-[#2D6A4F]" />
return <DollarSign className="h-8 w-8 text-[#17412C]" />
case "staff":
return <Users className="h-8 w-8 text-[#2D6A4F]" />
case "tool":
return <HelpCircleIcon className="h-8 w-8 text-[#2D6A4F]" />
return <Users className="h-8 w-8 text-[#17412C]" />
}
}

Expand Down
4 changes: 2 additions & 2 deletions app/components/Home.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -310,7 +310,7 @@ const EnAccessToolMap = ({}: EnAccessToolMapProps) => {

{/* Tool categories as badges */}
{tool.categories && tool.categories.length > 0 && (
<CardFooter className="flex gap-2">
<CardFooter className="flex gap-2 mt-4">
{tool.categories.map((category, index) => {
// Rotate through different colors for category badges
const colors = ["bg-[#43BC80] ", "bg-[#8BDC7F] "]
Expand All @@ -330,7 +330,7 @@ const EnAccessToolMap = ({}: EnAccessToolMapProps) => {
</Card>
))
) : (
<div className="col-span-full flex justify-center items-center py-10">
<div className="col-span-full flex justify-center items-center py-4">
{/* <Empty
description={
<span className="text-gray-600">
Expand Down
36 changes: 21 additions & 15 deletions app/components/Landing.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { Button } from "@/components/ui/button"
import EnAccessToolMap from "../components/Home"
import { StatisticCard } from "../components/StatisticCard"
import { BarrierCard } from "../components/BarrierCard"
import { Facebook, Instagram, Linkedin, Twitter } from "lucide-react"
import { FaFacebookF, FaYoutube, FaLinkedinIn, FaGithub } from "react-icons/fa"
import { Modal } from "antd"
import QuestionaireFilter from "../components/Questionairefilter"
export default function Landing() {
Expand Down Expand Up @@ -70,7 +70,7 @@ export default function Landing() {
</Modal>

{/* Empowering SMEs Section */}
<section className="py-12 px-4 bg-[#F9FBFA]">
<section className="pb-4 px-4 bg-[#F9FBFA]">
<div className="max-w-6xl mx-auto">
<h2 className="text-2xl md:text-3xl font-extrabold mb-4">
<span className="text-[#43BC80]">Empowering</span>{" "}
Expand Down Expand Up @@ -132,7 +132,9 @@ export default function Landing() {
<div className="max-w-6xl mx-auto">
<div className="grid md:grid-cols-2 gap-8 mb-8">
<div>
<p className="text-sm text-gray-600 mb-2">Made by</p>
<p className="text-base text-[#0D261A] font-bold pb-8 ">
Made by
</p>
<div className="h-12 relative">
<Image
src="/supporter1.png"
Expand All @@ -144,7 +146,9 @@ export default function Landing() {
</div>
</div>
<div>
<p className="text-sm text-gray-600 mb-2">Funded by</p>
<p className="text-base text-[#0D261A] font-bold pb-8">
Funded by
</p>
<div className="h-12 relative">
<Image
src="/GoodEnergiesFoundation.png"
Expand All @@ -157,25 +161,27 @@ export default function Landing() {
</div>
</div>

<div className="mb-8">
<p className="text-sm text-gray-600 mb-2">Connect with us</p>
<div className="mb-8 pt-8">
<p className="text-base text-[#0D261A] font-bold mb-8">
Connect with us
</p>
<div className="flex gap-4">
<Link href="#" className="text-[#1B4332]">
<Facebook size={24} />
<Link href="#" className="text-white bg-[#17412C] p-2 rounded-lg">
<FaFacebookF size={24} />
</Link>
<Link href="#" className="text-[#1B4332]">
<Twitter size={24} />
<Link href="#" className="text-white bg-[#17412C] p-2 rounded-lg">
<FaYoutube size={24} />
</Link>
<Link href="#" className="text-[#1B4332]">
<Linkedin size={24} />
<Link href="#" className="text-white bg-[#17412C] p-2 rounded-lg">
<FaLinkedinIn size={24} />
</Link>
<Link href="#" className="text-[#1B4332]">
<Instagram size={24} />
<Link href="#" className="text-white bg-[#17412C] p-2 rounded-lg">
<FaGithub size={24} />
</Link>
</div>
</div>

<div className="flex justify-center gap-4 text-xs text-gray-600">
<div className="flex justify-center gap-4 text-sm text-[#091A12] underline font-bold">
<Link href="#">Imprint</Link>
<Link href="#">Privacy Policy</Link>
<Link href="#">Cookies</Link>
Expand Down
6 changes: 3 additions & 3 deletions app/components/StatisticCard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,9 +5,9 @@ interface StatisticCardProps {

export function StatisticCard({ percentage, description }: StatisticCardProps) {
return (
<div className="border border-gray-200 rounded-lg p-6">
<div className="flex flex-col">
<div className="text-5xl font-bold text-[#1B4332] mb-2">
<div className="border border-gray-200 rounded-lg p-8">
<div className="flex gap-4 flex-col lg:flex-row">
<div className="text-5xl font-bold text-[#0D261A] mb-2 font-raleway">
{percentage}
</div>
<p className="text-gray-600">{description}</p>
Expand Down
100 changes: 100 additions & 0 deletions package-lock.json
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@
"next": "15.0.3",
"react": "19.0.0-rc-66855b96-20241106",
"react-dom": "19.0.0-rc-66855b96-20241106",
"react-icons": "^5.5.0",
"tailwind-merge": "^3.0.2",
"tailwindcss-animate": "^1.0.7"
},
Expand Down