feat: homepage

src/app/layout.tsx

@@ -1,3 +1,4 @@
+import { Roboto_Flex } from 'next/font/google';
 import { ReactNode } from 'react';
 import Navbar from '../components/Navbar';
 
@@ -5,9 +6,14 @@ interface RootLayoutProps {
   children: ReactNode;
 }
 
+const robotoFlex = Roboto_Flex({
+  subsets: ['latin'],
+  display: 'swap',
+});
+
 export default function RootLayout({ children }: RootLayoutProps) {
   return (
-    <html>
+    <html lang="en" className={robotoFlex.className}>
       <body
         style={{
           margin: 0,
@@ -20,11 +26,14 @@ export default function RootLayout({ children }: RootLayoutProps) {
             display: 'flex',
             flexDirection: 'column',
             background: 'url(https://i.imgur.com/PhS06NJ.png)',
+            alignItems: 'center',
           }}
         >
           <Navbar />
 
-          {children}
+          <div style={{ flex: 1, maxWidth: 780, width: '100%' }}>
+            {children}
+          </div>
         </div>
       </body>
     </html>