From bfea1e7fd247ed5f8a2cc6911d5f8ec78d4af7e6 Mon Sep 17 00:00:00 2001
From: Darius Cepulis <dcepulis@mux.com>
Date: Tue, 10 Mar 2026 12:00:09 -0500
Subject: [PATCH] fix(site): move legacy banner to base layout and fix mobile
 text size (#855)

---
 site/src/components/LegacyBanner.astro | 4 ++--
 site/src/layouts/Base.astro            | 2 ++
 site/src/layouts/Docs.astro            | 2 --
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/site/src/components/LegacyBanner.astro b/site/src/components/LegacyBanner.astro
index f931b9b0..46750289 100644
--- a/site/src/components/LegacyBanner.astro
+++ b/site/src/components/LegacyBanner.astro
@@ -6,7 +6,7 @@ import { BANNER_DISMISS_KEY } from '@/consts';
   data-legacy-banner
   class:list={[
     "banner-dismissed:hidden",
-    "flex items-center justify-center gap-2 px-5 py-2 text-p2",
+    "flex items-center justify-center gap-2 px-5 py-2 text-p3 md:text-p2",
     "border-b border-manila-75 bg-manila-50 text-faded-black",
     "dark:border-soot dark:bg-warm-gray dark:text-manila-light",
   ]}
@@ -17,7 +17,7 @@ import { BANNER_DISMISS_KEY } from '@/consts';
       href="https://legacy.videojs.org"
       class="font-bold underline intent:no-underline"
     >
-      Visit the legacy docs
+      Visit legacy.videojs.org
     </a>
   </p>
   <button
diff --git a/site/src/layouts/Base.astro b/site/src/layouts/Base.astro
index ac2561c6..8a730fe1 100644
--- a/site/src/layouts/Base.astro
+++ b/site/src/layouts/Base.astro
@@ -8,6 +8,7 @@ import '@/styles/globals.css';
 
 import BannerInit from '@/components/BannerInit.astro';
 import { PreferenceSync } from '@/components/docs/PreferenceSync';
+import LegacyBanner from '@/components/LegacyBanner.astro';
 import ThemeInit from '@/components/ThemeInit.astro';
 
 interface Props {
@@ -155,6 +156,7 @@ const fullTitle =
     >
       <PreferenceSync client:idle />
 
+      <LegacyBanner />
       <slot />
     </div>
   </body>
diff --git a/site/src/layouts/Docs.astro b/site/src/layouts/Docs.astro
index 7baf1f55..2c565e28 100644
--- a/site/src/layouts/Docs.astro
+++ b/site/src/layouts/Docs.astro
@@ -8,7 +8,6 @@ import StyleInit from '@/components/docs/StyleInit.astro';
 import FilmGrain from '@/components/FilmGrain';
 import Footer from '@/components/FooterDocs.astro';
 import FooterEasterEgg from '@/components/FooterEasterEgg.astro';
-import LegacyBanner from '@/components/LegacyBanner.astro';
 import NavBarDocs from '@/components/NavBar/NavBarDocs.astro';
 import { FRAMEWORK_LABELS, type SupportedFramework } from '@/types/docs';
 import { getDocTitle } from '@/utils/docs/title';
@@ -42,7 +41,6 @@ const docsSidebarId = 'docs-sidebar';
     <DocsSidebarRestoration docsSidebarId={docsSidebarId} />
     <slot name="head" slot="head" />
   </Fragment>
-  <LegacyBanner />
   <div
     class:list={[
       "grid min-h-screen grid-cols-1",