Add PublicFooter-kc component and update imports across pages
This commit is contained in:
84
src/components/PublicFooter-kc.js
Normal file
84
src/components/PublicFooter-kc.js
Normal file
@@ -0,0 +1,84 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import { Link } from 'react-router-dom';
|
||||||
|
import { Button } from './ui/button';
|
||||||
|
|
||||||
|
const PublicFooter = () => {
|
||||||
|
const loafLogo = `${process.env.PUBLIC_URL}/loaf-logo.png`;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
{/* Main Footer */}
|
||||||
|
<footer className="bg-[#644c9f] px-20 border-t border-[rgba(0,0,0,0.1)] py-4 md:py-[35px] flex items-center justify-center">
|
||||||
|
<div className=" flex flex-col lg:flex-row gap-8 sm:gap-12 md:gap-16 lg:gap-20 xl:gap-30 items-center justify-around w-full max-w-7xl">
|
||||||
|
<div className="w-32 sm:w-40 md:w-48 lg:w-[180px] flex-shrink-0">
|
||||||
|
<img src={loafLogo} alt="LOAF Logo" className="w-full h-auto aspect-square object-contain" />
|
||||||
|
</div>
|
||||||
|
<nav className="flex sm:px-4 px-2 flex-col sm:flex-row gap-32 items-start justify-center w-full lg:w-auto">
|
||||||
|
<div className="flex-col gap-2 w-full sm:w-auto sm:min-w-[163px] hidden sm:flex">
|
||||||
|
<div className="">
|
||||||
|
<p className="text-white text-xl font-semibold" style={{ fontFamily: "'Poppinss Sans', sans-serif" }}>About</p>
|
||||||
|
</div>
|
||||||
|
<Link to="/about/history" className="text-[#ddd8eb] text-sm sm:text-base font-medium hover:text-white transition-colors" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>History</Link>
|
||||||
|
<Link to="/about/mission-values" className="text-[#ddd8eb] text-sm sm:text-base font-medium hover:text-white transition-colors" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>Mission and Values</Link>
|
||||||
|
<Link to="/about/board" className="text-[#ddd8eb] text-sm sm:text-base font-medium hover:text-white transition-colors" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>Board of Directors</Link>
|
||||||
|
</div>
|
||||||
|
<div className="hidden sm:flex flex-col gap-2 w-full sm:w-auto sm:min-w-[148px]">
|
||||||
|
<div className="">
|
||||||
|
<p className="text-white text-xl font-semibold" style={{ fontFamily: "'Poppins Sans', sans-serif" }}>Connect</p>
|
||||||
|
</div>
|
||||||
|
<Link to="/become-a-member" className="text-[#ddd8eb] text-sm sm:text-base font-medium hover:text-white transition-colors" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>Become a Member</Link>
|
||||||
|
<Link to="/contact-us" className="text-[#ddd8eb] text-sm sm:text-base font-medium hover:text-white transition-colors" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>Contact Us</Link>
|
||||||
|
<Link to="/resources" className="text-[#ddd8eb] text-sm sm:text-base font-medium hover:text-white transition-colors" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>Resources</Link>
|
||||||
|
</div>
|
||||||
|
<div className="flex flex-col gap-2 justify-center w-full sm:w-auto sm:min-w-[220px] md:min-w-[271px] text-center">
|
||||||
|
<div className="pb-4 w-full flex ">
|
||||||
|
<Link to="/donate" className="block">
|
||||||
|
<Button style={{ fontFamily: "'Nunito Sans', sans-serif" }} className="bg-[#ff9e77] hover:bg-[#ff8c64] text-[#48286e] rounded-full px-14 py-6 text-[19px] leading-6 sm:text-lg font-semibold ">
|
||||||
|
Donate
|
||||||
|
</Button>
|
||||||
|
</Link>
|
||||||
|
</div>
|
||||||
|
<div className=' w-full flex justify-center '>
|
||||||
|
<p className="text-[#ddd8eb] text-sm sm:text-base font-medium text-left w-full" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
|
||||||
|
LOAF is supported by<br />the Hollyfield Foundation
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
|
||||||
|
{/* Bottom Footer */}
|
||||||
|
<footer className="bg-gradient-to-r from-[#48286e] to-[#644c9f] border-t border-[rgba(0,0,0,0.1)] px-4 sm:px-16 py-5">
|
||||||
|
<div className="flex flex-col sm:flex-row gap-4 sm:gap-6 justify-between items-center max-w-7xl mx-auto">
|
||||||
|
<nav className="flex flex-col sm:flex-row gap-4 sm:gap-8 items-center order-1 sm:order-none">
|
||||||
|
<<<<<<< HEAD
|
||||||
|
<a href="/#terms" className="text-[#c5b4e3] text-sm sm:text-base font-medium hover:text-white transition-colors whitespace-nowrap" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
|
||||||
|
Terms of Service
|
||||||
|
</a>
|
||||||
|
<a href="/#privacy" className="text-[#c5b4e3] text-sm sm:text-base font-medium hover:text-white transition-colors whitespace-nowrap" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
|
||||||
|
=======
|
||||||
|
<Link to="/terms-of-service" className="text-[#c5b4e3] text-sm sm:text-base font-medium hover:text-white transition-colors whitespace-nowrap" style={{ fontFamily: "'Inter', sans-serif" }}>
|
||||||
|
Terms of Service
|
||||||
|
</Link>
|
||||||
|
<Link to="/privacy-policy" className="text-[#c5b4e3] text-sm sm:text-base font-medium hover:text-white transition-colors whitespace-nowrap" style={{ fontFamily: "'Inter', sans-serif" }}>
|
||||||
|
>>>>>>> main
|
||||||
|
Privacy Policy
|
||||||
|
</Link>
|
||||||
|
</nav>
|
||||||
|
<p className="text-[#c5b4e3] text-sm sm:text-base font-medium text-center order-2 sm:order-none" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
|
||||||
|
© 2025 LOAF. All Rights Reserved.
|
||||||
|
</p>
|
||||||
|
<p className="text-[#c5b4e3] text-sm sm:text-base font-medium text-center order-3 sm:order-none" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
|
||||||
|
Designed and Managed by{' '}
|
||||||
|
<a href="https://konceptkit.com/" className="text-white transition-colors whitespace-nowrap">
|
||||||
|
Koncept Kit
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default PublicFooter;
|
||||||
@@ -2,7 +2,7 @@ import React from 'react';
|
|||||||
import { Link } from 'react-router-dom';
|
import { Link } from 'react-router-dom';
|
||||||
import { Button } from '../components/ui/button';
|
import { Button } from '../components/ui/button';
|
||||||
import PublicNavbar from '../components/PublicNavbar';
|
import PublicNavbar from '../components/PublicNavbar';
|
||||||
import PublicFooter from '../components/PublicFooter';
|
import PublicFooter from '../components/PublicFooter-kc';
|
||||||
import { ArrowDown } from 'lucide-react';
|
import { ArrowDown } from 'lucide-react';
|
||||||
|
|
||||||
const BecomeMember = () => {
|
const BecomeMember = () => {
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import PublicNavbar from '../components/PublicNavbar';
|
import PublicNavbar from '../components/PublicNavbar';
|
||||||
import PublicFooter from '../components/PublicFooter';
|
import PublicFooter from '../components/PublicFooter-kc';
|
||||||
import { Card } from '../components/ui/card';
|
import { Card } from '../components/ui/card';
|
||||||
|
|
||||||
const BoardOfDirectors = () => {
|
const BoardOfDirectors = () => {
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
import React, { useState } from 'react';
|
import React, { useState } from 'react';
|
||||||
import PublicNavbar from '../components/PublicNavbar';
|
import PublicNavbar from '../components/PublicNavbar';
|
||||||
import PublicFooter from '../components/PublicFooter';
|
import PublicFooter from '../components/PublicFooter-kc';
|
||||||
import { Button } from '../components/ui/button';
|
import { Button } from '../components/ui/button';
|
||||||
import { Card } from '../components/ui/card';
|
import { Card } from '../components/ui/card';
|
||||||
import { Input } from '../components/ui/input';
|
import { Input } from '../components/ui/input';
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
import React, { useState } from 'react';
|
import React, { useState } from 'react';
|
||||||
import PublicNavbar from '../components/PublicNavbar';
|
import PublicNavbar from '../components/PublicNavbar';
|
||||||
import PublicFooter from '../components/PublicFooter';
|
import PublicFooter from '../components/PublicFooter-kc';
|
||||||
import { Button } from '../components/ui/button';
|
import { Button } from '../components/ui/button';
|
||||||
import { Card } from '../components/ui/card';
|
import { Card } from '../components/ui/card';
|
||||||
import { Input } from '../components/ui/input';
|
import { Input } from '../components/ui/input';
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { useNavigate } from 'react-router-dom';
|
import { useNavigate } from 'react-router-dom';
|
||||||
import PublicNavbar from '../components/PublicNavbar';
|
import PublicNavbar from '../components/PublicNavbar';
|
||||||
import PublicFooter from '../components/PublicFooter';
|
import PublicFooter from '../components/PublicFooter-kc';
|
||||||
import { Card } from '../components/ui/card';
|
import { Card } from '../components/ui/card';
|
||||||
import { Button } from '../components/ui/button';
|
import { Button } from '../components/ui/button';
|
||||||
import { CheckCircle, Heart } from 'lucide-react';
|
import { CheckCircle, Heart } from 'lucide-react';
|
||||||
|
|||||||
@@ -7,7 +7,7 @@ import { Label } from '../components/ui/label';
|
|||||||
import { Card } from '../components/ui/card';
|
import { Card } from '../components/ui/card';
|
||||||
import { toast } from 'sonner';
|
import { toast } from 'sonner';
|
||||||
import PublicNavbar from '../components/PublicNavbar';
|
import PublicNavbar from '../components/PublicNavbar';
|
||||||
import PublicFooter from '../components/PublicFooter';
|
import PublicFooter from '../components/PublicFooter-kc';
|
||||||
import { ArrowRight, ArrowLeft, Mail, CheckCircle } from 'lucide-react';
|
import { ArrowRight, ArrowLeft, Mail, CheckCircle } from 'lucide-react';
|
||||||
|
|
||||||
const ForgotPassword = () => {
|
const ForgotPassword = () => {
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import PublicNavbar from '../components/PublicNavbar';
|
import PublicNavbar from '../components/PublicNavbar';
|
||||||
import PublicFooter from '../components/PublicFooter';
|
import PublicFooter from '../components/PublicFooter-kc';
|
||||||
import { Button } from '../components/ui/button';
|
import { Button } from '../components/ui/button';
|
||||||
import { Card } from '../components/ui/card';
|
import { Card } from '../components/ui/card';
|
||||||
import { Pen } from 'lucide-react';
|
import { Pen } from 'lucide-react';
|
||||||
|
|||||||
@@ -3,7 +3,7 @@ import { Link } from 'react-router-dom';
|
|||||||
import { Button } from '../components/ui/button';
|
import { Button } from '../components/ui/button';
|
||||||
import { Card } from '../components/ui/card';
|
import { Card } from '../components/ui/card';
|
||||||
import PublicNavbar from '../components/PublicNavbar';
|
import PublicNavbar from '../components/PublicNavbar';
|
||||||
import PublicFooter from '../components/PublicFooter';
|
import PublicFooter from '../components/PublicFooter-kc';
|
||||||
|
|
||||||
const Landing = () => {
|
const Landing = () => {
|
||||||
// LOAF brand assets (local)
|
// LOAF brand assets (local)
|
||||||
|
|||||||
@@ -8,7 +8,7 @@ import { Label } from '../components/ui/label';
|
|||||||
import { Card } from '../components/ui/card';
|
import { Card } from '../components/ui/card';
|
||||||
import { toast } from 'sonner';
|
import { toast } from 'sonner';
|
||||||
import PublicNavbar from '../components/PublicNavbar';
|
import PublicNavbar from '../components/PublicNavbar';
|
||||||
import PublicFooter from '../components/PublicFooter';
|
import PublicFooter from '../components/PublicFooter-kc';
|
||||||
import { ArrowRight, ArrowLeft } from 'lucide-react';
|
import { ArrowRight, ArrowLeft } from 'lucide-react';
|
||||||
|
|
||||||
const Login = () => {
|
const Login = () => {
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import PublicNavbar from '../components/PublicNavbar';
|
import PublicNavbar from '../components/PublicNavbar';
|
||||||
import PublicFooter from '../components/PublicFooter';
|
import PublicFooter from '../components/PublicFooter-kc';
|
||||||
import { Card } from '../components/ui/card';
|
import { Card } from '../components/ui/card';
|
||||||
|
|
||||||
const MissionValues = () => {
|
const MissionValues = () => {
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { Link } from 'react-router-dom';
|
import { Link } from 'react-router-dom';
|
||||||
import PublicNavbar from '../components/PublicNavbar';
|
import PublicNavbar from '../components/PublicNavbar';
|
||||||
import PublicFooter from '../components/PublicFooter';
|
import PublicFooter from '../components/PublicFooter-kc';
|
||||||
|
|
||||||
export default function PrivacyPolicy() {
|
export default function PrivacyPolicy() {
|
||||||
return (
|
return (
|
||||||
|
|||||||
@@ -5,7 +5,7 @@ import { Button } from '../components/ui/button';
|
|||||||
import { Card } from '../components/ui/card';
|
import { Card } from '../components/ui/card';
|
||||||
import { toast } from 'sonner';
|
import { toast } from 'sonner';
|
||||||
import PublicNavbar from '../components/PublicNavbar';
|
import PublicNavbar from '../components/PublicNavbar';
|
||||||
import PublicFooter from '../components/PublicFooter';
|
import PublicFooter from '../components/PublicFooter-kc';
|
||||||
import { ArrowRight, ArrowLeft } from 'lucide-react';
|
import { ArrowRight, ArrowLeft } from 'lucide-react';
|
||||||
import RegistrationStepIndicator from '../components/registration/RegistrationStepIndicator';
|
import RegistrationStepIndicator from '../components/registration/RegistrationStepIndicator';
|
||||||
import RegistrationStep1 from '../components/registration/RegistrationStep1';
|
import RegistrationStep1 from '../components/registration/RegistrationStep1';
|
||||||
|
|||||||
@@ -7,7 +7,7 @@ import { Label } from '../components/ui/label';
|
|||||||
import { Card } from '../components/ui/card';
|
import { Card } from '../components/ui/card';
|
||||||
import { toast } from 'sonner';
|
import { toast } from 'sonner';
|
||||||
import PublicNavbar from '../components/PublicNavbar';
|
import PublicNavbar from '../components/PublicNavbar';
|
||||||
import PublicFooter from '../components/PublicFooter';
|
import PublicFooter from '../components/PublicFooter-kc';
|
||||||
import { ArrowRight, Lock, AlertCircle } from 'lucide-react';
|
import { ArrowRight, Lock, AlertCircle } from 'lucide-react';
|
||||||
|
|
||||||
const ResetPassword = () => {
|
const ResetPassword = () => {
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
import React, { useState } from 'react';
|
import React, { useState } from 'react';
|
||||||
import PublicNavbar from '../components/PublicNavbar';
|
import PublicNavbar from '../components/PublicNavbar';
|
||||||
import PublicFooter from '../components/PublicFooter';
|
import PublicFooter from '../components/PublicFooter-kc';
|
||||||
import { Card } from '../components/ui/card';
|
import { Card } from '../components/ui/card';
|
||||||
import { ChevronDown, ExternalLink, Phone, Mail, MapPin } from 'lucide-react';
|
import { ChevronDown, ExternalLink, Phone, Mail, MapPin } from 'lucide-react';
|
||||||
|
|
||||||
@@ -133,16 +133,14 @@ const Resources = () => {
|
|||||||
{resource.name}
|
{resource.name}
|
||||||
</span>
|
</span>
|
||||||
<ChevronDown
|
<ChevronDown
|
||||||
className={`h-6 w-6 flex-shrink-0 ml-3 transition-transform duration-300 ${
|
className={`h-6 w-6 flex-shrink-0 ml-3 transition-transform duration-300 ${isExpanded ? 'rotate-180' : ''
|
||||||
isExpanded ? 'rotate-180' : ''
|
|
||||||
}`}
|
}`}
|
||||||
/>
|
/>
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
{/* Accordion Content */}
|
{/* Accordion Content */}
|
||||||
<div
|
<div
|
||||||
className={`transition-all duration-300 ease-in-out ${
|
className={`transition-all duration-300 ease-in-out ${isExpanded ? 'max-h-[1000px] opacity-100 mt-3' : 'max-h-0 opacity-0'
|
||||||
isExpanded ? 'max-h-[1000px] opacity-100 mt-3' : 'max-h-0 opacity-0'
|
|
||||||
}`}
|
}`}
|
||||||
>
|
>
|
||||||
<Card className="p-6 bg-white rounded-2xl border-2 border-[#ddd8eb] shadow-lg">
|
<Card className="p-6 bg-white rounded-2xl border-2 border-[#ddd8eb] shadow-lg">
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { Link } from 'react-router-dom';
|
import { Link } from 'react-router-dom';
|
||||||
import PublicNavbar from '../components/PublicNavbar';
|
import PublicNavbar from '../components/PublicNavbar';
|
||||||
import PublicFooter from '../components/PublicFooter';
|
import PublicFooter from '../components/PublicFooter-kc';
|
||||||
|
|
||||||
export default function TermsOfService() {
|
export default function TermsOfService() {
|
||||||
return (
|
return (
|
||||||
|
|||||||
@@ -5,7 +5,7 @@ import { Button } from '../components/ui/button';
|
|||||||
import { Card } from '../components/ui/card';
|
import { Card } from '../components/ui/card';
|
||||||
import { CheckCircle, XCircle, Loader2 } from 'lucide-react';
|
import { CheckCircle, XCircle, Loader2 } from 'lucide-react';
|
||||||
import PublicNavbar from '../components/PublicNavbar';
|
import PublicNavbar from '../components/PublicNavbar';
|
||||||
import PublicFooter from '../components/PublicFooter';
|
import PublicFooter from '../components/PublicFooter-kc';
|
||||||
|
|
||||||
const API_URL = process.env.REACT_APP_BACKEND_URL;
|
const API_URL = process.env.REACT_APP_BACKEND_URL;
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user