diff --git a/app/css/additional-styles/custom-animation.css b/app/css/additional-styles/custom-animation.css deleted file mode 100644 index 9e5dca690..000000000 --- a/app/css/additional-styles/custom-animation.css +++ /dev/null @@ -1,11 +0,0 @@ -@keyframes fadein-opacity { - 0%{ - opacity: 0; - } - 100%{ - opacity: 1; - } -} -.animate-fadein-opacity{ - animation: fadein-opacity 0.6s ease-in-out ; -} \ No newline at end of file diff --git a/app/css/additional-styles/fonts.css b/app/css/additional-styles/fonts.css deleted file mode 100644 index f793661fe..000000000 --- a/app/css/additional-styles/fonts.css +++ /dev/null @@ -1,74 +0,0 @@ -@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap'); - -.roboto-thin { - font-family: "Roboto", sans-serif; - font-weight: 100; - font-style: normal; - } - - .roboto-light { - font-family: "Roboto", sans-serif; - font-weight: 300; - font-style: normal; - } - - .roboto-regular { - font-family: "Roboto", sans-serif; - font-weight: 400; - font-style: normal; - } - - .roboto-medium { - font-family: "Roboto", sans-serif; - font-weight: 500; - font-style: normal; - } - - .roboto-bold { - font-family: "Roboto", sans-serif; - font-weight: 700; - font-style: normal; - } - - .roboto-black { - font-family: "Roboto", sans-serif; - font-weight: 900; - font-style: normal; - } - - .roboto-thin-italic { - font-family: "Roboto", sans-serif; - font-weight: 100; - font-style: italic; - } - - .roboto-light-italic { - font-family: "Roboto", sans-serif; - font-weight: 300; - font-style: italic; - } - - .roboto-regular-italic { - font-family: "Roboto", sans-serif; - font-weight: 400; - font-style: italic; - } - - .roboto-medium-italic { - font-family: "Roboto", sans-serif; - font-weight: 500; - font-style: italic; - } - - .roboto-bold-italic { - font-family: "Roboto", sans-serif; - font-weight: 700; - font-style: italic; - } - - .roboto-black-italic { - font-family: "Roboto", sans-serif; - font-weight: 900; - font-style: italic; - } - \ No newline at end of file diff --git a/app/css/style.css b/app/css/style.css index 10c7c35e5..e7d74f4d3 100644 --- a/app/css/style.css +++ b/app/css/style.css @@ -5,8 +5,6 @@ @import "additional-styles/utility-patterns.css"; @import "additional-styles/range-slider.css"; @import "additional-styles/toggle-switch.css"; -@import "additional-styles/fonts.css"; -@import "additional-styles/custom-animation.css"; @import "additional-styles/theme.css"; @import "tailwindcss/utilities"; diff --git a/components/ui/PearDark26x24.svg b/components/ui/PearDark26x24.svg new file mode 100644 index 000000000..8ce06e324 --- /dev/null +++ b/components/ui/PearDark26x24.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + + + + + + + diff --git a/components/ui/authbutton.tsx b/components/ui/authbutton.tsx index f592f6213..3da718a65 100644 --- a/components/ui/authbutton.tsx +++ b/components/ui/authbutton.tsx @@ -2,6 +2,7 @@ import { createClient } from "@/utils/supabase/server"; import { redirect } from "next/navigation"; import Link from "next/link"; import Image from "next/image"; +import { CircleUserRound } from "lucide-react"; export default async function AuthButton() { const supabase = createClient(); @@ -17,48 +18,38 @@ export default async function AuthButton() { return (
{error || !data?.user ? ( - <> - - - - - - - - - - +
+ - Sign in -
/
- Sign up - + + Sign in + + / + + Sign up + +
) : ( <> - Settings -
/
-
Sign out
- {/* Settings -
- -
*/} + / + )}
diff --git a/components/ui/header.tsx b/components/ui/header.tsx index b0935dd52..a3ec6b846 100644 --- a/components/ui/header.tsx +++ b/components/ui/header.tsx @@ -1,103 +1,36 @@ import Link from "next/link"; import MobileMenu from "./mobile-menu"; import AuthButton from "./authbutton"; -import PearLightLogo from "./PearLight70x70.svg"; +import PearDarkLogo from "./PearDark26x24.svg"; export default function Header() { + // navigation bar links + const navLinks = [ + { label: "About", path: "/about" }, + { label: "Discord", path: "https://discord.gg/AKy5FmqCkF" }, + { label: "Github", path: "/~https://github.com/trypear/pearai-app" }, + ]; return ( -
+
-
+
{/* Site branding */} -
+
    {/* Logo */} -
      -
      -
      - - - - - - - - - - - - - - - - - - - - - - - About -
      - Discord - - Github - -
      -
    -
- {/* Desktop navigation */} + + + + {/* Nav titles */} + {navLinks.map((link, index) => ( + + {link.label} + + ))} + {process.env.NODE_ENV !== "production" && }{" "} {/* AuthButton is hidden in production */} diff --git a/components/ui/mobile-menu.tsx b/components/ui/mobile-menu.tsx index a39d1423f..f8421f89e 100644 --- a/components/ui/mobile-menu.tsx +++ b/components/ui/mobile-menu.tsx @@ -40,7 +40,7 @@ export default function MobileMenu() { {/* Hamburger button */}
diff --git a/tailwind.config.js b/tailwind.config.js index 534bae5be..1b8eac8ec 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -173,10 +173,15 @@ module.exports = { from: { height: "var(--radix-accordion-content-height)" }, to: { height: "0" }, }, + "fadein-opacity": { + "0%": { opacity: "0" }, + "100%": { opacity: "1" }, + }, }, animation: { "accordion-down": "accordion-down 0.2s ease-out", "accordion-up": "accordion-up 0.2s ease-out", + "fadein-opacity": "fadein-opacity 0.6s ease-in-out", }, }, },