Fixes for banner on beta (#4435)

Author: rickhanlonii

beta/src/components/Layout/Page.tsx

@@ -28,7 +28,7 @@ export function Page({routeTree, children}: PageProps) {
 
             <div className="flex flex-1 w-full h-full self-stretch">
               <div className="w-full min-w-0">
-                <main className="flex flex-1 self-stretch flex-col items-end justify-around">
+                <main className="flex flex-1 self-stretch mt-10 flex-col items-end justify-around">
                   {children}
                   <Footer />
                 </main>

beta/src/components/Layout/Toc.tsx

@@ -19,7 +19,7 @@ export function Toc({
   return (
     <nav
       role="navigation"
-      className="pt-6 fixed top-0 right-0"
+      className="pt-6 fixed top-10 right-0"
       style={{
         // This keeps the layout fixed width instead of adjusting for content.
         width: 'inherit',

beta/src/components/SocialBanner.tsx

@@ -14,7 +14,7 @@ const bannerLinkText = 'Help Provide Humanitarian Aid to Ukraine.';
 
 export default function SocialBanner() {
   return (
-    <div className="w-full bg-gray-100 dark:bg-gray-700 sticky py-2 h-16 sm:h-10 sm:py-0 flex items-center justify-center flex-col sm:flex-row">
+    <div className="w-full bg-gray-100 dark:bg-gray-700 fixed py-2 h-16 sm:h-10 sm:py-0 flex items-center justify-center flex-col sm:flex-row z-50">
       {bannerText}
       <ExternalLink
         className="ml-0 sm:ml-1 text-link dark:text-link-dark hover:underline"