Styling changes and refactor

Switch google fonts to use Next.js font optimization, animate comment fade in, and refactor beer like handler and comment submit handler.

components/ui/Layout.tsx

@@ -4,10 +4,10 @@ import Navbar from './Navbar';
 const Layout: FC<{ children: ReactNode }> = ({ children }) => {
   return (
     <div className="flex h-screen flex-col">
-      <header className="top-0">
+      <header className="sticky top-0 z-50">
         <Navbar />
       </header>
-      <div className="animate-in fade-in top-0 h-full flex-1">{children}</div>
+      <div className="relative top-0 h-full flex-1">{children}</div>
     </div>
   );
 };