feat(website): color scheme / dark and light mode improvements

This commit is contained in:
iCrawl
2023-03-24 06:02:00 +01:00
parent 1c4af93898
commit 52f8e0670c
18 changed files with 104 additions and 92 deletions

View File

@@ -10,7 +10,7 @@ export interface OverloadSwitcherProps {
overloads: ReactNode[];
}
export function OverloadSwitcher({ overloads, children }: PropsWithChildren<{ overloads: ReactNode[] }>) {
export default function OverloadSwitcher({ overloads, children }: PropsWithChildren<{ overloads: ReactNode[] }>) {
const [overloadIndex, setOverloadIndex] = useState(1);
const overloadedNode = overloads[overloadIndex - 1]!;
const menu = useMenuState({ gutter: 8, sameWidth: true, fitViewport: true });
@@ -18,7 +18,7 @@ export function OverloadSwitcher({ overloads, children }: PropsWithChildren<{ ov
return (
<div className="flex flex-col place-items-start gap-2">
<MenuButton
className="bg-light-600 hover:bg-light-700 active:bg-light-800 dark:bg-dark-600 dark:hover:bg-dark-500 dark:active:bg-dark-400 focus:ring-width-2 focus:ring-blurple rounded p-3 outline-0 focus:ring"
className="bg-light-700 hover:bg-light-800 active:bg-light-800 dark:bg-dark-600 dark:hover:bg-dark-500 dark:active:bg-dark-400 focus:ring-width-2 focus:ring-blurple rounded p-3 outline-0 focus:ring"
state={menu}
>
<div className="flex flex-row place-content-between place-items-center gap-2">