ui: Set footer to stick to viewport bottom (#48)

TheMythologist · web-flow · commit 53da3db6eec9 · 2026-01-11T23:14:41.000+08:00
diff --git a/app/layout.tsx b/app/layout.tsx
@@ -23,9 +23,9 @@ export default function RootLayout({
   return (
     <html lang='en'>
       <body className={inter.className}>
-        <div className='min-h-screen bg-white'>
+        <div className='flex min-h-screen flex-col bg-white'>
           <Header />
-          <main>{children}</main>
+          <main className='flex grow flex-col'>{children}</main>
           <Toaster richColors position='bottom-center' />
           <Footer />
         </div>
diff --git a/components/student-group/StudentGroups.tsx b/components/student-group/StudentGroups.tsx
@@ -83,7 +83,7 @@ export default function StudentGroups({ orgs }: StudentGroupsProps) {
   const totalPages = Math.ceil(igCardsToDisplay.length / PAGE_SIZE);
 
   return (
-    <div className='relative flex'>
+    <div className='relative flex flex-1'>
       {orgs.length === 0 && (
         <div className='bg-opacity-60 absolute inset-0 z-50 flex items-center justify-center bg-white'>
           <div className='h-24 w-24'>
