改图标
This commit is contained in:
parent
d5bdb10b81
commit
3f9e0814d9
@ -8,9 +8,9 @@ import {
|
|||||||
Button,
|
Button,
|
||||||
Menu,
|
Menu,
|
||||||
} from "@chakra-ui/react";
|
} from "@chakra-ui/react";
|
||||||
import { SunIcon, MoonIcon, HamburgerIcon } from "@chakra-ui/icons";
|
|
||||||
import NextLink from "next/link";
|
import NextLink from "next/link";
|
||||||
import { useColorMode } from "@/components/ui/color-mode";
|
import { useColorMode } from "@/components/ui/color-mode";
|
||||||
|
import { FiMoon, FiSun, FiMenu } from "react-icons/fi";
|
||||||
|
|
||||||
export default function Header() {
|
export default function Header() {
|
||||||
const { colorMode, toggleColorMode } = useColorMode();
|
const { colorMode, toggleColorMode } = useColorMode();
|
||||||
@ -85,7 +85,7 @@ export default function Header() {
|
|||||||
onClick={toggleColorMode}
|
onClick={toggleColorMode}
|
||||||
variant="ghost"
|
variant="ghost"
|
||||||
>
|
>
|
||||||
{colorMode === "light" ? <MoonIcon /> : <SunIcon />}
|
{colorMode === "light" ? <FiMoon size={20} /> : <FiSun size={20} />}
|
||||||
</IconButton>
|
</IconButton>
|
||||||
|
|
||||||
<Menu.Root>
|
<Menu.Root>
|
||||||
@ -95,7 +95,7 @@ export default function Header() {
|
|||||||
variant="outline"
|
variant="outline"
|
||||||
display={{ md: "none" }}
|
display={{ md: "none" }}
|
||||||
>
|
>
|
||||||
<HamburgerIcon />
|
<FiMenu size={20} />
|
||||||
</IconButton>
|
</IconButton>
|
||||||
</Menu.Trigger>
|
</Menu.Trigger>
|
||||||
<Menu.Positioner>
|
<Menu.Positioner>
|
||||||
|
@ -1,43 +0,0 @@
|
|||||||
"use client";
|
|
||||||
|
|
||||||
import {
|
|
||||||
Toaster as ChakraToaster,
|
|
||||||
Portal,
|
|
||||||
Spinner,
|
|
||||||
Stack,
|
|
||||||
Toast,
|
|
||||||
createToaster,
|
|
||||||
} from "@chakra-ui/react";
|
|
||||||
|
|
||||||
export const toaster = createToaster({
|
|
||||||
placement: "bottom-end",
|
|
||||||
pauseOnPageIdle: true,
|
|
||||||
});
|
|
||||||
|
|
||||||
export const Toaster = () => {
|
|
||||||
return (
|
|
||||||
<Portal>
|
|
||||||
<ChakraToaster toaster={toaster} insetInline={{ mdDown: "4" }}>
|
|
||||||
{(toast) => (
|
|
||||||
<Toast.Root width={{ md: "sm" }}>
|
|
||||||
{toast.type === "loading" ? (
|
|
||||||
<Spinner size="sm" color="blue.solid" />
|
|
||||||
) : (
|
|
||||||
<Toast.Indicator />
|
|
||||||
)}
|
|
||||||
<Stack gap="1" flex="1" maxWidth="100%">
|
|
||||||
{toast.title && <Toast.Title>{toast.title}</Toast.Title>}
|
|
||||||
{toast.description && (
|
|
||||||
<Toast.Description>{toast.description}</Toast.Description>
|
|
||||||
)}
|
|
||||||
</Stack>
|
|
||||||
{toast.action && (
|
|
||||||
<Toast.ActionTrigger>{toast.action.label}</Toast.ActionTrigger>
|
|
||||||
)}
|
|
||||||
{toast.closable && <Toast.CloseTrigger />}
|
|
||||||
</Toast.Root>
|
|
||||||
)}
|
|
||||||
</ChakraToaster>
|
|
||||||
</Portal>
|
|
||||||
);
|
|
||||||
};
|
|
Loading…
x
Reference in New Issue
Block a user