Britton/next-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

trying out responsive hero on mac

Browse Source
This commit is contained in:
Jason Jordan
2025-07-10 11:52:38 -04:00
parent 06f29c816a
commit 76a1a828dc
7 changed files with 106 additions and 116 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/Navbar.tsx
+71 -73
View File
@@ -14,66 +14,66 @@ export interface MenuItem {
children?: MenuItem[];
}
const menuItems: MenuItem[] = [
{
id: "members",
title: "Members",
children: [
{
id: "findMedicalProvider",
title: "Find a Medical Provider",
route: "",
},
{
id: "obtainRxInformation",
title: "Obtain Rx Information",
route: "",
},
],
},
{
id: "employers",
title: "Employers",
children: [
{
id: "employerServices",
title: "Employer Services",
route: "",
},
{
id: "selfFundedPlans",
title: "Self-Funded Plans",
route: "",
},
{
id: "controlHealthCareCosts",
title: "Control Health Care Costs",
route: "",
},
],
},
{
id: "providers",
title: "Providers",
children: [
{
id: "eligibilityLookup",
title: "Eligibility Lookup",
route: "",
},
{
id: "contactBbs",
title: "Contact BBS",
route: "",
},
],
},
{
id: "brokers",
title: "Brokers",
route: "",
},
];
// const menuItems: MenuItem[] = [
// {
// id: "members",
// title: "Members",
// children: [
// {
// id: "findMedicalProvider",
// title: "Find a Medical Provider",
// route: "",
// },
// {
// id: "obtainRxInformation",
// title: "Obtain Rx Information",
// route: "",
// },
// ],
// },
// {
// id: "employers",
// title: "Employers",
// children: [
// {
// id: "employerServices",
// title: "Employer Services",
// route: "",
// },
// {
// id: "selfFundedPlans",
// title: "Self-Funded Plans",
// route: "",
// },
// {
// id: "controlHealthCareCosts",
// title: "Control Health Care Costs",
// route: "",
// },
// ],
// },
// {
// id: "providers",
// title: "Providers",
// children: [
// {
// id: "eligibilityLookup",
// title: "Eligibility Lookup",
// route: "",
// },
// {
// id: "contactBbs",
// title: "Contact BBS",
// route: "",
// },
// ],
// },
// {
// id: "brokers",
// title: "Brokers",
// route: "",
// },
// ];
const Navbar = () => {
@@ -81,9 +81,7 @@ const Navbar = () => {
useEffect(() => {
const handleScroll = () => {
// const viewportHeight = window.innerHeight;
const subtractedHeight = window.innerHeight - 80;
// Find pixels from top to bottom of "tag line" div
if (window.scrollY > subtractedHeight) {
setIsScrolled(true);
} else {
@@ -99,7 +97,7 @@ const Navbar = () => {
}, []);
return (
<nav className="sticky top-0 left-0 z-50 hidden lg:flex h-[85px] justify-center bg-transparent">
<nav className="sticky top-0 left-0 z-10 hidden lg:flex h-[85px] justify-center bg-transparent">
<div className={classnames(
"w-11/12 bg-britton-neutral px-1 text-britton-dark rounded-b-3xl", {
"h-13 pb-1 border-b-2 border-x-2 border-black" : isScrolled,
@@ -121,34 +119,34 @@ const Navbar = () => {
Britton Benefit Services
</Link>
</div>
{/* <ul className={classnames("flex space-x-4 font-semibold text-lg uppercase", {"pl-2" : isScrolled})}>
<ul className={classnames("flex space-x-4 font-semibold text-xl", {"pl-2" : isScrolled})}>
<li>
<Link href="/services" className="hover:text-britton-light">
<Link href="/" className="hover:text-britton-light">
Employers
</Link>
</li>
<li>
<Link href="/contact" className="hover:text-britton-light">
<Link href="/" className="hover:text-britton-light">
Members
</Link>
</li>
<li>
<Link href="/contact" className="hover:text-britton-light">
<Link href="/" className="hover:text-britton-light">
Providers
</Link>
</li>
<li>
<Link href="/contact" className="hover:text-britton-light">
<Link href="/" className="hover:text-britton-light">
Brokers
</Link>
</li>
<li>
<Link href="/contact" className="hover:text-britton-light">
Contact Us
<Link href="/" className="hover:text-britton-light">
Services
</Link>
</li>
</ul> */}
<div className={classnames("flex space-x-4 font-semibold text-lg", {"pl-2" : isScrolled})}>
</ul>
{/* <div className={classnames("flex space-x-4 font-semibold text-lg", {"pl-2" : isScrolled})}>
{menuItems.map((item) => {
return item.hasOwnProperty("children") ?
(
@@ -159,7 +157,7 @@ const Navbar = () => {
</Link>
);
})}
</div>
</div> */}
<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