mirror of
https://github.com/pheralb/svgl.git
synced 2025-02-05 22:48:17 +08:00
⚒️ Add nprogress & page transitions.
This commit is contained in:
parent
6ee9acba5a
commit
0c11cc399a
@ -8,19 +8,48 @@ import "@/styles/globals.css";
|
||||
// Layout ->
|
||||
import Layout from "@/layout";
|
||||
|
||||
// Nextjs Progressbar ->
|
||||
import NextNProgress from "nextjs-progressbar";
|
||||
|
||||
// Framer ->
|
||||
import { motion } from "framer-motion";
|
||||
|
||||
// SWR Config & services ->
|
||||
import { SWRConfig } from "swr";
|
||||
import { fetcher } from "@/services/fetcher";
|
||||
|
||||
function MyApp({ Component, pageProps }: AppProps) {
|
||||
function MyApp({ Component, pageProps, router }: AppProps) {
|
||||
return (
|
||||
<ChakraProvider theme={theme}>
|
||||
<SWRConfig value={{ fetcher }}>
|
||||
<Layout>
|
||||
<Component {...pageProps} />
|
||||
</Layout>
|
||||
</SWRConfig>
|
||||
</ChakraProvider>
|
||||
<>
|
||||
<NextNProgress
|
||||
color="#4343E5"
|
||||
startPosition={0.3}
|
||||
stopDelayMs={200}
|
||||
height={3}
|
||||
showOnShallow={true}
|
||||
/>
|
||||
<ChakraProvider theme={theme}>
|
||||
<SWRConfig value={{ fetcher }}>
|
||||
<Layout>
|
||||
<motion.div
|
||||
key={router.route}
|
||||
initial="initial"
|
||||
animate="animate"
|
||||
variants={{
|
||||
initial: {
|
||||
opacity: 0,
|
||||
},
|
||||
animate: {
|
||||
opacity: 1,
|
||||
},
|
||||
}}
|
||||
>
|
||||
<Component {...pageProps} />
|
||||
</motion.div>
|
||||
</Layout>
|
||||
</SWRConfig>
|
||||
</ChakraProvider>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
|
Loading…
x
Reference in New Issue
Block a user