diff --git a/website/src/components/Header/Header.tsx b/website/src/components/Header/Header.tsx index bdf011a4..2d0ef7cc 100644 --- a/website/src/components/Header/Header.tsx +++ b/website/src/components/Header/Header.tsx @@ -1,4 +1,4 @@ -import { Box, Button } from "@chakra-ui/react"; +import { Box, Button, useColorMode } from "@chakra-ui/react"; import { Popover } from "@headlessui/react"; import { AnimatePresence, motion } from "framer-motion"; import Image from "next/image"; @@ -54,10 +54,16 @@ function AccountButton() { } export function Header(props) { - const borderClass = props.transparent ? "" : props.borderClass ?? "border-b border-gray-100"; + const { colorMode } = useColorMode(); + const borderClass = props.transparent + ? "" + : colorMode === "light" + ? "border-b border-gray-400" + : "border-b border-zinc-800"; + return ( -