← back to StudentLoanTracker

src/components/layout/Footer.tsx

54 lines

import Link from 'next/link';

export default function Footer() {
  return (
    <footer className="bg-[#0a1220] border-t border-[#1a2d47] mt-auto">
      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
        <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
          {/* About */}
          <div>
            <h3 className="text-white font-semibold mb-3">StudentLoanTracker</h3>
            <p className="text-gray-400 text-sm leading-relaxed">
              Free tools to help borrowers understand repayment options,
              track PSLF progress, and plan for summer enrollment gaps.
            </p>
          </div>

          {/* Links */}
          <div>
            <h3 className="text-white font-semibold mb-3">Tools</h3>
            <ul className="space-y-2 text-sm">
              <li><Link href="/calculator" className="text-gray-400 hover:text-teal-400 transition-colors">Repayment Calculators</Link></li>
              <li><Link href="/loans" className="text-gray-400 hover:text-teal-400 transition-colors">Loan Intake</Link></li>
              <li><Link href="/pslf" className="text-gray-400 hover:text-teal-400 transition-colors">PSLF Tracker</Link></li>
              <li><Link href="/servicers" className="text-gray-400 hover:text-teal-400 transition-colors">Servicer Directory</Link></li>
              <li><Link href="/summer-aid" className="text-gray-400 hover:text-teal-400 transition-colors">Summer Aid Planner</Link></li>
            </ul>
          </div>

          {/* Legal */}
          <div>
            <h3 className="text-white font-semibold mb-3">Legal</h3>
            <ul className="space-y-2 text-sm">
              <li><Link href="/terms" className="text-gray-400 hover:text-teal-400 transition-colors">Terms of Service</Link></li>
              <li><Link href="/privacy" className="text-gray-400 hover:text-teal-400 transition-colors">Privacy Policy</Link></li>
              <li><Link href="/disclaimer" className="text-gray-400 hover:text-teal-400 transition-colors">Disclaimer</Link></li>
            </ul>
          </div>
        </div>

        <div className="mt-8 pt-6 border-t border-[#1a2d47]">
          <p className="text-gray-500 text-xs text-center leading-relaxed">
            Not affiliated with the U.S. Department of Education. Not legal or financial advice.
            All calculations are estimates and may not reflect your actual repayment terms.
            Consult a qualified financial advisor for personalized guidance.
          </p>
          <p className="text-gray-600 text-xs text-center mt-2">
            &copy; {new Date().getFullYear()} StudentLoanTracker. All rights reserved.
          </p>
        </div>
      </div>
    </footer>
  );
}