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

Responsive done for computer screens

Browse Source
This commit is contained in:
Jason Jordan
2025-07-30 16:31:41 -04:00
parent 3bdc768714
commit 0e44bd53e6
17 changed files with 294 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/Navbar.tsx
+18 -11
View File
@@ -74,13 +74,18 @@ export interface MenuItem {
// },
// ];
const Navbar = () => {
interface NavbarProps {
collapseHeight: number;
}
const Navbar: React.FC<NavbarProps> = ({ collapseHeight }) => {
const [isScrolled, setIsScrolled] = useState(false);
useEffect(() => {
const handleScroll = () => {
const subtractedHeight = window.innerHeight - 80;
if (window.scrollY > subtractedHeight) {
// const subtractedHeight = window.innerHeight - 80;
const subtractedHeight = window.innerHeight - collapseHeight;
if (window.scrollY > collapseHeight) {
setIsScrolled(true);
} else {
setIsScrolled(false);
@@ -105,12 +110,14 @@ const Navbar = () => {
>
<div className="w-full px-3 justify-between items-center flex">
<div className={classnames('rounded-b-2xl bg-deepcove w-72', {"hidden" : isScrolled})}>
<Image
src="/images/bbstpa-forsite.png"
alt="Britton Logo"
width={205}
height={60}
/>
<Link href="/">
<Image
src="/images/bbstpa-forsite.png"
alt="Britton Logo"
width={205}
height={60}
/>
</Link>
</div>
<div className={classnames('rounded-b-2xl py-2 mb-1 bg-deepcove font-semibold text-platinum text-center text-lg uppercase w-72', {"hidden" : !isScrolled})}>
<Link href="/">
@@ -129,12 +136,12 @@ const Navbar = () => {
</Link>
</li>
<li>
<Link href="/" className="hover:text-bluemana">
<Link href="/providers" className="hover:text-bluemana">
Providers
</Link>
</li>
<li>
<Link href="/" className="hover:text-bluemana">
<Link href="/brokers" className="hover:text-bluemana">
Brokers
</Link>
</li>