diff --git a/.dockerignore b/.dockerignore new file mode 100644 index 0000000..d07ece8 --- /dev/null +++ b/.dockerignore @@ -0,0 +1,3 @@ + node_modules/ + .env + .git \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 5818a21..a0f0886 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { - "name": "next-web", - "version": "0.1.0", + "name": "britton-site", + "version": "2.0.0", "lockfileVersion": 3, "requires": true, "packages": { "": { - "name": "next-web", - "version": "0.1.0", + "name": "britton-site", + "version": "2.0.0", "dependencies": { "next": "15.3.4", "react": "^19.0.0", @@ -18,8 +18,10 @@ "@types/node": "^20", "@types/react": "^19", "@types/react-dom": "^19", + "classnames": "^2.5", "eslint": "^9", "eslint-config-next": "15.3.4", + "react-icons": "^5.5", "tailwindcss": "^4", "typescript": "^5" } @@ -2329,6 +2331,13 @@ "node": ">=18" } }, + "node_modules/classnames": { + "version": "2.5.1", + "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.5.1.tgz", + "integrity": "sha512-saHYOzhIQs6wy2sVxTM6bUDsQO4F50V9RQ22qBpEdCW+I+/Wmke2HOl6lS6dTpdxVhb88/I6+Hs+438c3lfUow==", + "dev": true, + "license": "MIT" + }, "node_modules/client-only": { "version": "0.0.1", "resolved": "https://registry.npmjs.org/client-only/-/client-only-0.0.1.tgz", @@ -5112,6 +5121,16 @@ "react": "^19.1.0" } }, + "node_modules/react-icons": { + "version": "5.5.0", + "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-5.5.0.tgz", + "integrity": "sha512-MEFcXdkP3dLo8uumGI5xN3lDFNsRtrjbOEKDLD7yv76v4wpnEq2Lt2qeHaQOr34I/wPN3s3+N08WkQ+CW37Xiw==", + "dev": true, + "license": "MIT", + "peerDependencies": { + "react": "*" + } + }, "node_modules/react-is": { "version": "16.13.1", "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", diff --git a/package.json b/package.json index a8b2271..36e520b 100644 --- a/package.json +++ b/package.json @@ -22,6 +22,8 @@ "tailwindcss": "^4", "eslint": "^9", "eslint-config-next": "15.3.4", - "@eslint/eslintrc": "^3" + "@eslint/eslintrc": "^3", + "react-icons": "^5.5", + "classnames": "^2.5" } } diff --git a/src/app/favicon.ico b/public/favicon.ico similarity index 100% rename from src/app/favicon.ico rename to public/favicon.ico diff --git a/public/file.svg b/public/file.svg deleted file mode 100644 index 004145c..0000000 --- a/public/file.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/public/globe.svg b/public/globe.svg deleted file mode 100644 index 567f17b..0000000 --- a/public/globe.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/public/images/bbstpa-forsite.png b/public/images/bbstpa-forsite.png new file mode 100644 index 0000000..8918918 Binary files /dev/null and b/public/images/bbstpa-forsite.png differ diff --git a/public/images/brittonLogoMask.png b/public/images/brittonLogoMask.png new file mode 100644 index 0000000..061b21e Binary files /dev/null and b/public/images/brittonLogoMask.png differ diff --git a/public/images/brittonLogoMask2.png b/public/images/brittonLogoMask2.png new file mode 100644 index 0000000..0c6b0b1 Binary files /dev/null and b/public/images/brittonLogoMask2.png differ diff --git a/public/images/brittonRoundedOctogon.png b/public/images/brittonRoundedOctogon.png new file mode 100644 index 0000000..8096fe1 Binary files /dev/null and b/public/images/brittonRoundedOctogon.png differ diff --git a/public/images/placeHolder.png b/public/images/placeHolder.png new file mode 100644 index 0000000..bb3b10a Binary files /dev/null and b/public/images/placeHolder.png differ diff --git a/public/next.svg b/public/next.svg deleted file mode 100644 index 5174b28..0000000 --- a/public/next.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/public/vercel.svg b/public/vercel.svg deleted file mode 100644 index 7705396..0000000 --- a/public/vercel.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/public/window.svg b/public/window.svg deleted file mode 100644 index b2b2a44..0000000 --- a/public/window.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/app/globals.css b/src/app/globals.css deleted file mode 100644 index a2dc41e..0000000 --- a/src/app/globals.css +++ /dev/null @@ -1,26 +0,0 @@ -@import "tailwindcss"; - -:root { - --background: #ffffff; - --foreground: #171717; -} - -@theme inline { - --color-background: var(--background); - --color-foreground: var(--foreground); - --font-sans: var(--font-geist-sans); - --font-mono: var(--font-geist-mono); -} - -@media (prefers-color-scheme: dark) { - :root { - --background: #0a0a0a; - --foreground: #ededed; - } -} - -body { - background: var(--background); - color: var(--foreground); - font-family: Arial, Helvetica, sans-serif; -} diff --git a/src/app/layout.tsx b/src/app/layout.tsx deleted file mode 100644 index f7fa87e..0000000 --- a/src/app/layout.tsx +++ /dev/null @@ -1,34 +0,0 @@ -import type { Metadata } from "next"; -import { Geist, Geist_Mono } from "next/font/google"; -import "./globals.css"; - -const geistSans = Geist({ - variable: "--font-geist-sans", - subsets: ["latin"], -}); - -const geistMono = Geist_Mono({ - variable: "--font-geist-mono", - subsets: ["latin"], -}); - -export const metadata: Metadata = { - title: "Create Next App", - description: "Generated by create next app", -}; - -export default function RootLayout({ - children, -}: Readonly<{ - children: React.ReactNode; -}>) { - return ( - - - {children} - - - ); -} diff --git a/src/app/page.tsx b/src/app/next_home_page.tsx similarity index 100% rename from src/app/page.tsx rename to src/app/next_home_page.tsx diff --git a/src/components/Button.tsx b/src/components/Button.tsx new file mode 100644 index 0000000..c7dc002 --- /dev/null +++ b/src/components/Button.tsx @@ -0,0 +1,32 @@ +"use client"; + +import React, { useState } from 'react'; +import classnames from 'classnames'; + +interface ButtonProps { + onClick?: () => void; + children: React.ReactNode; + className?: string; +} + +const Button: React.FC = ({ onClick, children, className }) => { + const [isHovered, setIsHovered] = useState(false); + + return ( + + ); +}; + +export default Button; \ No newline at end of file diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx new file mode 100644 index 0000000..4a01288 --- /dev/null +++ b/src/components/Navbar.tsx @@ -0,0 +1,95 @@ +"use client"; + +import React, { useState, useEffect } from 'react'; +import classnames from 'classnames'; +import Link from 'next/link'; +import Button from './Button'; +import Image from 'next/image'; + +const Navbar = () => { + + const [isScrolled, setIsScrolled] = useState(false); + + useEffect(() => { + const handleScroll = () => { + if (window.scrollY > 355) { + setIsScrolled(true); + } else { + setIsScrolled(false); + } + }; + + window.addEventListener('scroll', handleScroll); + + return () => { + window.removeEventListener('scroll', handleScroll); + }; + }, []); + + return ( + + ); +}; + +export default Navbar; \ No newline at end of file diff --git a/src/components/Section1.tsx b/src/components/Section1.tsx new file mode 100644 index 0000000..588eeb4 --- /dev/null +++ b/src/components/Section1.tsx @@ -0,0 +1,45 @@ +"use client"; + +import React, { useState } from 'react'; +import classnames from 'classnames'; +import Image from 'next/image'; + +interface SectionProps { + className?: string; + theme?: string; + title: string; + imageUrl: string; + invert?: boolean; + children: React.ReactNode; +} + +const Section1: React.FC = ( + { className, + theme, + title, + imageUrl, + invert, + children + } +) => { + return ( +
+
+
+ {title} +
+
+ {children} +
+
+ {/* Description of image */} +
+ {/*
*/} +
+ +
+
+ ); +}; + +export default Section1; \ No newline at end of file diff --git a/src/components/Section1Invert.tsx b/src/components/Section1Invert.tsx new file mode 100644 index 0000000..5ddf595 --- /dev/null +++ b/src/components/Section1Invert.tsx @@ -0,0 +1,45 @@ +"use client"; + +import React, { useState } from 'react'; +import classnames from 'classnames'; +import Image from 'next/image'; + +interface SectionProps { + className?: string; + theme?: string; + title: string; + imageUrl: string; + invert?: boolean; + children: React.ReactNode; +} + +const Section1Invert: React.FC = ( + { className, + theme, + title, + imageUrl, + invert, + children + } +) => { + return ( +
+ {/* Description of image */} +
+ {/*
*/} +
+ +
+
+
+ {title} +
+
+ {children} +
+
+
+ ); +}; + +export default Section1Invert; \ No newline at end of file diff --git a/src/components/Section1InvertLight.tsx b/src/components/Section1InvertLight.tsx new file mode 100644 index 0000000..5d62aa8 --- /dev/null +++ b/src/components/Section1InvertLight.tsx @@ -0,0 +1,45 @@ +"use client"; + +import React, { useState } from 'react'; +import classnames from 'classnames'; +import Image from 'next/image'; + +interface SectionProps { + className?: string; + theme?: string; + title: string; + imageUrl: string; + invert?: boolean; + children: React.ReactNode; +} + +const Section1InvertLight: React.FC = ( + { className, + theme, + title, + imageUrl, + invert, + children + } +) => { + return ( +
+ {/* Description of image */} +
+ {/*
*/} +
+ +
+
+
+ {title} +
+
+ {children} +
+
+
+ ); +}; + +export default Section1InvertLight; \ No newline at end of file diff --git a/src/components/Section1Light.tsx b/src/components/Section1Light.tsx new file mode 100644 index 0000000..17f32ff --- /dev/null +++ b/src/components/Section1Light.tsx @@ -0,0 +1,45 @@ +"use client"; + +import React, { useState } from 'react'; +import classnames from 'classnames'; +import Image from 'next/image'; + +interface SectionProps { + className?: string; + theme?: string; + title: string; + imageUrl: string; + invert?: boolean; + children: React.ReactNode; +} + +const Section1: React.FC = ( + { className, + theme, + title, + imageUrl, + invert, + children + } +) => { + return ( +
+
+
+ {title} +
+
+ {children} +
+
+ {/* Description of image */} +
+ {/*
*/} +
+ +
+
+ ); +}; + +export default Section1; \ No newline at end of file diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx new file mode 100644 index 0000000..c91fcf5 --- /dev/null +++ b/src/pages/_app.tsx @@ -0,0 +1,16 @@ +import '../styles/globals.css'; +import type { AppProps } from 'next/app'; +import Navbar from '../components/Navbar'; + +function MyApp({ Component, pageProps }: AppProps) { + return ( + <> +
+ + +
+ + ); +} + +export default MyApp; \ No newline at end of file diff --git a/src/pages/_document.tsx b/src/pages/_document.tsx new file mode 100644 index 0000000..141f4c0 --- /dev/null +++ b/src/pages/_document.tsx @@ -0,0 +1,13 @@ +import { Html, Head, Main, NextScript } from "next/document"; + +export default function Document() { + return ( + + + +
+ + + + ); +} \ No newline at end of file diff --git a/src/pages/index.tsx b/src/pages/index.tsx new file mode 100644 index 0000000..2d77ec9 --- /dev/null +++ b/src/pages/index.tsx @@ -0,0 +1,71 @@ +import Section1 from '../components/Section1'; +import Section1Invert from '../components/Section1Invert'; +import Section1Light from '../components/Section1Light'; +import Section1InvertLight from '../components/Section1InvertLight'; + +export default function Home() { + return ( + <> +
+
+ Healthcare that's truly affordable +
+
+ +
+
+ + Self-funding gives you the flexibility to design a plan that is best suited to meet your company's needs. And unlike traditional insurance plans that charge a fixed annual rate for claims, self-funded plans are billed monthly, and only for the services used. This saves you from the extra cost of paying for something your company might not use and lets you continuously evaluate your company’s plan, maximizing flexibility and mitigating risk to your company's bottom line. + +
+ + + + While self-funding protects you from paying higher month-to-month premiums for unutilized services, because self-funding bills per-claim, it does leave you susceptible to a catastrophic claim. To protect you against having to cover an excessive amount due to a catastrophic claim, self-funded plans give you the option to purchase stop-loss insurance. + + With stop-loss insurance, you pay a fixed fee and your claim costs are set a predetermined level. If a claim exceeds that level, the stop-loss insurance will pay the rest. This coverage can be purchased to cover catastrophic claims on one member (known as specific coverage) or it can cover claims that significantly exceed the expected level for the entire group (aggregate coverage). + +
+ + 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. + + +
+ + + This will all be new text talking about our login pages and other online support. + + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ac gravida massa. Morbi et posuere ligula. Cras ultrices luctus tincidunt. Nam arcu orci, porttitor sit amet dui vel, egestas consectetur eros. Maecenas tempus commodo lorem ac aliquam. Nunc mattis nisl non tortor semper fermentum. Interdum et malesuada fames ac ante ipsum primis in faucibus. Donec quam metus, dictum quis egestas a, semper nec elit. Donec maximus semper vestibulum. Nullam eu libero at metus cursus tristique sed et mi. Aliquam sodales nunc ex, ut euismod tortor venenatis vel. Proin finibus sodales nibh, sit amet luctus ligula ultrices dapibus. Quisque in lacinia dolor. + + + + + + + + + + +
+
+
+
+
+
+ + ); +} \ No newline at end of file diff --git a/src/styles/globals.css b/src/styles/globals.css new file mode 100644 index 0000000..961979d --- /dev/null +++ b/src/styles/globals.css @@ -0,0 +1,44 @@ +@import "tailwindcss"; + +:root { + --background: #ffffff; + --foreground: #171717; +} + +@theme { + --color-britton-dark: #04153E; + --color-britton-medium: #2A4B6F; + --color-britton-light: #6AC8F1; + --color-britton-neutral: #E0E0E0; + --color-britton-accent: #B87333; + --color-britton-accent2: #CD7F32; + /* --color-britton-neutral: #EEF2E3; */ + /* name colors like below AFTER we settle on them for sure */ + /* --color-britton-deepcove: #04153E; + --color-britton-bluetang: #2A4B6F; + --color-britton-bluemana: #6AC8F1; */ + /* --color-britton-deepcove-background: #04153E; + --color-britton-bluetang-background: #2A4B6F; + --color-britton-bluemana-background: #6AC8F1; */ + /* Add more custom colors as needed */ +} + +@theme inline { + --color-background: var(--background); + --color-foreground: var(--foreground); + --font-sans: var(--font-geist-sans); + --font-mono: var(--font-geist-mono); +} + +@media (prefers-color-scheme: dark) { + :root { + --background: #0a0a0a; + --foreground: #ededed; + } +} + +body { + background: var(--background); + color: var(--foreground); + font-family: Arial, Helvetica, sans-serif; +}