import "../styles/globals.css"; import type { AppProps } from "next/app"; import { ChakraProvider, extendTheme, withDefaultColorScheme, } from "@chakra-ui/react"; import Navbar from "components/Navbar"; import { mode } from "@chakra-ui/theme-tools"; import Head from "next/head"; import Script from "next/script"; import * as gtag from "configurations/gtag"; import { useRouter } from "next/router"; import { useEffect } from "react"; import AdDetector from "components/AdDetector"; const customTheme = extendTheme( { styles: { global: (props: any) => ({ body: { bg: mode("white", "#171717")(props), }, }), }, colors: { green: { 50: "#d4f3df", 100: "#b7ecca", 200: "#9be4b4", 300: "#61d48a", 400: "#45cd74", 500: "#32ba62", 600: "#2b9e53", 700: "#238144", 800: "#1b6435", 900: "#134826", }, components: { Link: { baseStyle: { color: "green", }, }, }, }, }, withDefaultColorScheme({ colorScheme: "green" }) ); function MyApp({ Component, pageProps }: AppProps) { const router = useRouter(); useEffect(() => { const handleRouteChange = (url: string) => { gtag.pageview(url); }; router.events.on("routeChangeComplete", handleRouteChange); router.events.on("hashChangeComplete", handleRouteChange); return () => { router.events.off("routeChangeComplete", handleRouteChange); router.events.off("hashChangeComplete", handleRouteChange); }; }, [router.events]); return ( <>