Fix "on this page" min-w

remix-run · Sep 25, 2024 · fe13a63 · fe13a63
1 parent d931a46
commit fe13a63
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 5 deletions.
diff --git a/.prettierignore b/.prettierignore
@@ -3,4 +3,6 @@ node_modules
 /build
 /public/build
 .env
-_redirects
+_redirects
+
+/data
diff --git a/app/components/on-this-page.tsx b/app/components/on-this-page.tsx
@@ -5,7 +5,7 @@ import iconsHref from "~/icons.svg";
 
 export function LargeOnThisPage({ doc }: { doc: SerializeFrom<Doc> }) {
   return (
-    <div className="sticky top-36 order-1 mt-20 hidden max-h-[calc(100vh-9rem)] w-56 flex-shrink-0 self-start overflow-y-auto pb-10 xl:block">
+    <div className="sticky top-36 order-1 mt-20 hidden max-h-[calc(100vh-9rem)] w-56 min-w-min flex-shrink-0 self-start overflow-y-auto pb-10 xl:block">
       <nav className="mb-3 flex items-center font-semibold">On this page</nav>
       <ul className="md-toc flex flex-col flex-wrap gap-3 leading-[1.125]">
         {doc.headings.map((heading, i) => (
@@ -15,7 +15,9 @@ export function LargeOnThisPage({ doc }: { doc: SerializeFrom<Doc> }) {
           >
             <Link
               to={`#${heading.slug}`}
-              dangerouslySetInnerHTML={{ __html: heading.html || "" }}
+              dangerouslySetInnerHTML={{
+                __html: heading.html || "",
+              }}
               className="block py-1 text-sm text-gray-400 hover:text-gray-900 active:text-red-brand dark:text-gray-400 dark:hover:text-gray-50 dark:active:text-red-brand"
             />
           </li>

diff --git a/app/pages/guide.tsx b/app/pages/guide.tsx
@@ -64,6 +64,6 @@ export const meta: MetaFunction<typeof loader> = ({
 };
 
 export default function DocPage() {
-  let { doc } = useLoaderData<typeof loader>();
+  let { doc } = useLoaderData<typeof loader>(); 
   return <DocLayout doc={doc} />;
 }
diff --git a/app/pages/home.tsx b/app/pages/home.tsx
@@ -15,7 +15,7 @@ export let loader = async () => {
   return { stats };
 };
 
-export const meta: MetaFunction = ({ data, matches }) => {
+export const meta: MetaFunction = ({ matches }) => {
   let { isProductionHost } = getRootMatchData(matches);
   let robots = isProductionHost ? "index,follow" : "noindex, nofollow";
   return [