From 0e44bd53e66e0e1145dab04be12d49c9412ee749 Mon Sep 17 00:00:00 2001 From: Jason Jordan Date: Wed, 30 Jul 2025 16:31:41 -0400 Subject: [PATCH] Responsive done for computer screens --- src/app/(informational)/brokers/page.tsx | 63 +++++++++++++++++++++ src/app/(informational)/employers/page.tsx | 60 ++++++++++++++++++++ src/app/(informational)/layout.tsx | 12 ++-- src/app/(informational)/members/page.tsx | 45 +++++++++------ src/app/(informational)/providers/page.tsx | 49 ++++++++++++++++ src/app/dashboard/layout.tsx | 17 ++---- src/app/dashboard/member/page.tsx | 24 +++++--- src/app/page.tsx | 2 +- src/components/BenefitsAAGWidget.tsx | 2 +- src/components/DashboardHeader.tsx | 8 +-- src/components/DeductableProgressWidget.tsx | 2 +- src/components/FindProvider.tsx | 2 +- src/components/InsuranceCard.tsx | 4 +- src/components/LandingPageHeader.tsx | 36 ++++++++++++ src/components/Navbar.tsx | 29 ++++++---- src/components/RecentClaimsWidget.tsx | 2 +- src/components/SideNav.tsx | 10 ++-- 17 files changed, 294 insertions(+), 73 deletions(-) create mode 100644 src/app/(informational)/brokers/page.tsx create mode 100644 src/app/(informational)/employers/page.tsx create mode 100644 src/app/(informational)/providers/page.tsx create mode 100644 src/components/LandingPageHeader.tsx diff --git a/src/app/(informational)/brokers/page.tsx b/src/app/(informational)/brokers/page.tsx new file mode 100644 index 0000000..19371da --- /dev/null +++ b/src/app/(informational)/brokers/page.tsx @@ -0,0 +1,63 @@ +import { Schibsted_Grotesk } from 'next/font/google' +import classnames from 'classnames'; +import InlineLink from "@/components/InlineLink"; +import QuickAccessLinks, { QuickLink } from '@/components/QuickAccessLinks'; +import LandingPageHeader from '@/components/LandingPageHeader'; + +const font = Schibsted_Grotesk({ subsets: ['latin'] }) + +const quickLinks: QuickLink[] = [ + { + display: "Member Login/Registration", + url: "/" + }, + { + display: "Link to Thing 1", + url: "/" + }, + { + display: "Link to Thing 2", + url: "/" + }, + { + display: "Link to another Thing", + url: "/" + } +] + + +export default function Brokers() { + return ( +
+ +
+
+
+ Partner with Britton Benefit Services to Grow Your Business and Serve Your Clients +
+ +
+ In the ever-changing health care market, finding cost-effective plans to help your clients save money is a serious challenge. At Britton Benefit Services, LLC we have a proven ourselves as leaders in Third-Party Benefits Administration through our performance in finding employers the right self-funded plans that work for them. Whether you need to review a plan document, manage information reports, review provider directories, or you are looking for access to marketing materials, you’ve come to the right place. +
+
+ Broker Services from Britton Benefit Services +
    +
  • + Discuss your client’s needs and provide additional insight +
    • +
  • + Learn more about our company and self-funding +
    • +
  • + Request a free, no-obligation quote to see the cost savings we can help you provide to your client +
    • +
+
+
+
+
+ ) +} \ No newline at end of file diff --git a/src/app/(informational)/employers/page.tsx b/src/app/(informational)/employers/page.tsx new file mode 100644 index 0000000..387630e --- /dev/null +++ b/src/app/(informational)/employers/page.tsx @@ -0,0 +1,60 @@ +import { Schibsted_Grotesk } from 'next/font/google' +import classnames from 'classnames'; +import InlineLink from "@/components/InlineLink"; +import QuickAccessLinks, { QuickLink } from '@/components/QuickAccessLinks'; +import LandingPageHeader from '@/components/LandingPageHeader'; + +const font = Schibsted_Grotesk({ subsets: ['latin'] }) + +const quickLinks: QuickLink[] = [ + { + display: "Employer Login/Registration", + url: "/" + }, + { + display: "Link to Thing 1", + url: "/" + }, + { + display: "Link to Thing 2", + url: "/" + }, + { + display: "Link to another Thing", + url: "/" + } +] + +export default function Employers() { + return ( +
+ +
+
+
+ Making Your Benefits Work for You and Your Employees +
+ +
+ At Britton Benefit Services, LLC we are leading the third-party benefits industry by working hard to make employee benefits more affordable for you and your employees. As a third-party administrator, we negotiate with leading PPOs and other organizations to help you find the best program for your employees without sacrificing the bottom line. This creates a major cost savings that you can pass on to your employees. +
+
+ In addition to the generous cost savings for you and your employees, we also offer a wide range of online services to help streamline and automate the benefit process for you and your employees. This means easier access to the benefit information you need and faster action on individual claims. By logging in to any of the services we provide, you can do the following: +
+
+ Look up in-network providers through our list of PPOs
+ • File insurance claims and review a claim’s status
+ • Research which type of plan is best for you
+ • Control your health care costs by selecting a PPO that’s actively competing for your business. +
+
+ Request a free, no-obligation quote today, and learn how our completely customizable benefits solutions can work for you. To learn more about our company and to discover the benefits of third-party benefits administration, review our services or contact us today. +
+
+
+
+ ) +} \ No newline at end of file diff --git a/src/app/(informational)/layout.tsx b/src/app/(informational)/layout.tsx index 4f12dbb..5bb0941 100644 --- a/src/app/(informational)/layout.tsx +++ b/src/app/(informational)/layout.tsx @@ -12,7 +12,7 @@ export default async function LandingPageLayout({ children }: { children: React. return ( <> - +
@@ -23,7 +23,7 @@ export default async function LandingPageLayout({ children }: { children: React.
-
+ {/*
-
-
-
- {children} -
+
*/} +
+ {children}
diff --git a/src/app/(informational)/members/page.tsx b/src/app/(informational)/members/page.tsx index eaf938c..c767c93 100644 --- a/src/app/(informational)/members/page.tsx +++ b/src/app/(informational)/members/page.tsx @@ -2,12 +2,13 @@ import { Schibsted_Grotesk } from 'next/font/google' import classnames from 'classnames'; import InlineLink from "@/components/InlineLink"; import QuickAccessLinks, { QuickLink } from '@/components/QuickAccessLinks'; +import LandingPageHeader from '@/components/LandingPageHeader'; const font = Schibsted_Grotesk({ subsets: ['latin'] }) const quickLinks: QuickLink[] = [ { - display: "Login/Registration", + display: "Member Login/Registration", url: "/" }, { @@ -27,23 +28,31 @@ const quickLinks: QuickLink[] = [ export default function Members() { return ( - <> - -
- At Britton Benefit Services, LLC we're making employee benefits more affordable. In addition to the cost savings you receive when your employer chooses Britton Benefit Services, LLC we also make sure the important information you need is at your fingertips. -
-
- That's why our member portal offers you 24/7 access to things like in-network provider lists, claim forms and prescription medication information. Select from any of the links below to get access to the benefit information and forms you need to file a claim, search for a provider or learn more about your benefits plan. -
-
- At Britton Benefit Services, LLC we're making employee benefits more affordable. In addition to the cost savings you receive when your employer chooses Britton Benefit Services, LLC we also make sure the important information you need is at your fingertips. -
-
- That's why our member portal offers you 24/7 access to things like in-network provider lists, claim forms and prescription medication information. Select from any of the links below to get access to the benefit information and forms you need to file a claim, search for a provider or learn more about your benefits plan. +
+ +
+
+
+ Member Tagline will go here when we come up with the wording +
+ +
+ At Britton Benefit Services, LLC we're making employee benefits more affordable. In addition to the cost savings you receive when your employer chooses Britton Benefit Services, LLC we also make sure the important information you need is at your fingertips. +
+
+ That's why our member portal offers you 24/7 access to things like in-network provider lists, claim forms and prescription medication information. Select from any of the links below to get access to the benefit information and forms you need to file a claim, search for a provider or learn more about your benefits plan. +
+
+ At Britton Benefit Services, LLC we're making employee benefits more affordable. In addition to the cost savings you receive when your employer chooses Britton Benefit Services, LLC we also make sure the important information you need is at your fingertips. +
+
+ That's why our member portal offers you 24/7 access to things like in-network provider lists, claim forms and prescription medication information. Select from any of the links below to get access to the benefit information and forms you need to file a claim, search for a provider or learn more about your benefits plan. +
+
- +
) } \ No newline at end of file diff --git a/src/app/(informational)/providers/page.tsx b/src/app/(informational)/providers/page.tsx new file mode 100644 index 0000000..1f1f696 --- /dev/null +++ b/src/app/(informational)/providers/page.tsx @@ -0,0 +1,49 @@ +import { Schibsted_Grotesk } from 'next/font/google' +import classnames from 'classnames'; +import InlineLink from "@/components/InlineLink"; +import QuickAccessLinks, { QuickLink } from '@/components/QuickAccessLinks'; +import LandingPageHeader from '@/components/LandingPageHeader'; + +const font = Schibsted_Grotesk({ subsets: ['latin'] }) + +const quickLinks: QuickLink[] = [ + { + display: "Member Login/Registration", + url: "/" + }, + { + display: "Link to Thing 1", + url: "/" + }, + { + display: "Link to Thing 2", + url: "/" + }, + { + display: "Link to another Thing", + url: "/" + } +] + + +export default function Providers() { + return ( +
+ +
+
+
+ Easy Access to HIPAA Compliant Patient Information and Much More +
+ +
+ You know that as a provider, you have a responsibility to your patients to respond promptly and accurately. At Britton Benefit Services, LLC it’s our goal to provide you with the prompt response to your inquiry and easy access to the information you need to care for your patients. In addition to 24/7 online support and access to HIPAA compliant patient information, you can find the information you need to verify eligibility, confirm benefits and check claim statuses. Simply select the navigation above to access the forms and information you need. +
+
+
+
+ ) +} \ No newline at end of file diff --git a/src/app/dashboard/layout.tsx b/src/app/dashboard/layout.tsx index fee9a5f..014102e 100644 --- a/src/app/dashboard/layout.tsx +++ b/src/app/dashboard/layout.tsx @@ -6,7 +6,6 @@ import Script from 'next/script'; import AccountDropdown from '../../components/AccountDropdown'; import SideNav from "@/components/SideNav"; -import DashboardHeader from "@/components/DashboardHeader"; import Image from 'next/image'; import classnames from 'classnames'; @@ -34,12 +33,12 @@ export default async function DashboardLayout({ children }: { children: React.Re
-
-
+
+
-
- -
- {children} -
-
-
+ {children}
diff --git a/src/app/dashboard/member/page.tsx b/src/app/dashboard/member/page.tsx index 60135b5..43d0a17 100644 --- a/src/app/dashboard/member/page.tsx +++ b/src/app/dashboard/member/page.tsx @@ -1,5 +1,6 @@ import classnames from 'classnames'; +import DashboardHeader from "@/components/DashboardHeader"; import FindProvider from '@/components/FindProvider'; import InsuranceCardWidget from '@/components/InsuranceCard'; import DeductableProgressWidget from '@/components/DeductableProgressWidget'; @@ -8,17 +9,22 @@ import BenefitsAAGWidget from '@/components/BenefitsAAGWidget'; export default function Member() { return ( -
-
-
-
- - +
+ +
+
+
+
+ + +
+ +
- - +
-
) diff --git a/src/app/page.tsx b/src/app/page.tsx index b480f21..806e9a6 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -7,7 +7,7 @@ import Footer from '@/components/Footer'; export default function Home() { return ( <> - + { return ( -
+

Benefits At A Glance

CLASSIC 5K 100/5000

diff --git a/src/components/DashboardHeader.tsx b/src/components/DashboardHeader.tsx index f8cb5f4..d1ac38f 100644 --- a/src/components/DashboardHeader.tsx +++ b/src/components/DashboardHeader.tsx @@ -13,13 +13,13 @@ const DashboardHeader: React.FC = ({ userDisplayName }) => )}> {userDisplayName}
-
+
-
-
+
+
diff --git a/src/components/DeductableProgressWidget.tsx b/src/components/DeductableProgressWidget.tsx index 74c3c98..8ac1c67 100644 --- a/src/components/DeductableProgressWidget.tsx +++ b/src/components/DeductableProgressWidget.tsx @@ -13,7 +13,7 @@ interface DeductableProgressWidgetProps { const DeductableProgressWidget = () => { return ( -
+

Paid

diff --git a/src/components/FindProvider.tsx b/src/components/FindProvider.tsx index 89bf9fa..7935b60 100644 --- a/src/components/FindProvider.tsx +++ b/src/components/FindProvider.tsx @@ -16,7 +16,7 @@ interface FindProviderProps { const FindProvider: React.FC = ({ zipOnly }) => { return ( -
+

Find A Provider By...

diff --git a/src/components/InsuranceCard.tsx b/src/components/InsuranceCard.tsx index 31abca8..78c0818 100644 --- a/src/components/InsuranceCard.tsx +++ b/src/components/InsuranceCard.tsx @@ -10,10 +10,10 @@ const font = Schibsted_Grotesk({ subsets: ['latin'] }) const InsuranceCardWidget = () => { return ( -
+
My Card
-
+
diff --git a/src/components/LandingPageHeader.tsx b/src/components/LandingPageHeader.tsx new file mode 100644 index 0000000..add9f52 --- /dev/null +++ b/src/components/LandingPageHeader.tsx @@ -0,0 +1,36 @@ +import classnames from 'classnames'; + +interface LandingPageHeaderProps { + headerText: string; +} + +const LandingPageHeader: React.FC = ({ headerText }) => { + + return ( +
+
+
+
+
+
+
+
+
+ {headerText} +
+
+
+
+
+ ); +}; + +export default LandingPageHeader; \ No newline at end of file diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx index 693a418..775a74f 100644 --- a/src/components/Navbar.tsx +++ b/src/components/Navbar.tsx @@ -74,13 +74,18 @@ export interface MenuItem { // }, // ]; -const Navbar = () => { +interface NavbarProps { + collapseHeight: number; +} + +const Navbar: React.FC = ({ 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 = () => { >
- Britton Logo + + Britton Logo +
@@ -129,12 +136,12 @@ const Navbar = () => {
  • - + Providers
  • - + Brokers
    • diff --git a/src/components/RecentClaimsWidget.tsx b/src/components/RecentClaimsWidget.tsx index dce5887..d40c0a0 100644 --- a/src/components/RecentClaimsWidget.tsx +++ b/src/components/RecentClaimsWidget.tsx @@ -12,7 +12,7 @@ interface RecentClaimsWidgetProps { const RecentClaimsWidget = () => { return ( -
    +

    Recent Claims

    diff --git a/src/components/SideNav.tsx b/src/components/SideNav.tsx index 47763d9..714d2c4 100644 --- a/src/components/SideNav.tsx +++ b/src/components/SideNav.tsx @@ -32,9 +32,10 @@ const SideNav: React.FC = ( return (
    @@ -45,10 +46,10 @@ const SideNav: React.FC = ( > {isSidebarOpen ? : } -
    +
    ); }