Added basic footer, few style changes to nav

This commit is contained in:
Jason Jordan
2025-07-01 16:56:24 -04:00
parent 30cd59658d
commit 129af6b414
7 changed files with 64 additions and 20 deletions
+13 -8
View File
@@ -13,7 +13,7 @@ const Navbar = () => {
useEffect(() => {
const handleScroll = () => {
// Find pixels from top to bottom of "tag line" div
if (window.scrollY > 355) {
if (window.scrollY > 280) {
setIsScrolled(true);
} else {
setIsScrolled(false);
@@ -30,14 +30,14 @@ const Navbar = () => {
return (
<nav className="sticky top-0 left-0 z-50 hidden lg:flex justify-center">
<div className={classnames(
"w-11/12 bg-britton-neutral p-1 text-britton-dark rounded-b-3xl", {
"min-h-5 border-1 border-britton-dark" : isScrolled,
"min-h-20" : !isScrolled
"w-11/12 bg-britton-neutral px-1 text-britton-dark rounded-b-3xl", {
"min-h-6 pb-1 border-b-2 border-x-2 border-britton-dark" : isScrolled,
"min-h-20 pb-4" : !isScrolled
}
)}
>
<div className="container mx-auto justify-between items-center flex">
<div className={classnames('rounded-3xl bg-britton-dark', {"hidden" : isScrolled})}>
<div className={classnames('rounded-b-3xl bg-britton-dark w-72', {"hidden" : isScrolled})}>
<Image
src="/images/bbstpa-forsite.png"
alt="Britton Logo"
@@ -45,6 +45,11 @@ const Navbar = () => {
height={80}
/>
</div>
<div className={classnames('rounded-b-3xl py-2 bg-britton-dark text-britton-neutral text-center text-xl uppercase w-72', {"hidden" : !isScrolled})}>
<Link href="/">
Britton Benefit Services
</Link>
</div>
{/* <div className={classnames(`bg-[url(/images/bbstpa-forsite.png)]`, {"hidden" : isScrolled})} /> */}
{/* <Image src="/images/bbstpa-forsite.png" alt="Britton Logo" className={classnames({"hidden" : isScrolled})}/> */}
{/* <div className={classnames("text-xl font-bold", {"hidden" : isScrolled})}>
@@ -52,7 +57,7 @@ const Navbar = () => {
&nbsp;&nbsp;&nbsp;Benefit <br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Services
</div> */}
<ul className="flex space-x-4 font-semibold text-lg uppercase">
<ul className={classnames("flex space-x-4 font-semibold text-lg uppercase", {"pl-2" : isScrolled})}>
<li>
<Link href="/services" className="hover:text-britton-light">
Employers
@@ -79,8 +84,8 @@ const Navbar = () => {
</Link>
</li>
</ul>
<div className="flex space-x-2 font-semibold">
<Button className="bg-britton-neutral hover:bg-britton-accent2 py-1 px-4 rounded border-1 border-britton-dark">
<div className={classnames("flex space-x-2 font-semibold", {"pt-1" : isScrolled})}>
<Button className="bg-britton-neutral text-britton-accent2 hover:text-britton-accent py-1 px-4 rounded border-1 border-britton-accent2 hover:border-britton-accent">
Sign In
</Button>
<Button className="bg-britton-dark hover:bg-britton-medium text-britton-light py-1 px-4 rounded">