'use client'
import './globals.css'
import Head from 'next/head'
import Navbar from '@/components/Navbar'
import SiteTree from '@/components/SiteTree'
import components from '@/components/mdx'
import { MDXProvider } from '@mdx-js/react'
import { Inter, Besley, Cabin } from 'next/font/google'
import { usePathname } from 'next/navigation'
import { IconContext } from 'react-icons'
import { useEffect, useState } from 'react'
export const inter = Inter({ subsets: ['latin'] })
export const besley = Besley({ subsets: ['latin'] })
export const cabin = Cabin({ subsets: ['latin'] })
export const metadata = {
title: 'Mikayla Dobson | Software Engineer',
description: 'Integrating artistry and technology to create beautiful software',
}
export default function RootLayout({ children }: { children: React.ReactNode }) {
const pathname = usePathname();
const [bg, setBg] = useState('bg-slate-900');
const [overlay, setOverlay] = useState(false);
const [pageIsScrolled, setPageIsScrolled] = useState(false);
useEffect(() => {
switch (pathname) {
case '/contact':
setBg('bg-darkPlum');
setOverlay(true);
break;
case '/':
case '/about':
default:
setBg('bg-slate-900');
setOverlay(false);
break;
}
}, [pathname])
useEffect(() => {
document.addEventListener('scroll', () => {
if (window.scrollY > 0) {
setPageIsScrolled(true);
} else {
setPageIsScrolled(false);
}
})
}, [])
return (
{metadata.title}
{children}
)
}