[site/layout][s]: fixed layout

This commit is contained in:
olayway 2022-06-02 11:25:30 +02:00
parent a00a90a345
commit cf95061bec
2 changed files with 32 additions and 33 deletions

View File

@ -17,10 +17,7 @@ export default function Layout({ children }) {
<link rel="preconnect" href="https://fonts.gstatic.com" crossOrigin="" /> <link rel="preconnect" href="https://fonts.gstatic.com" crossOrigin="" />
</Head> </Head>
<Nav /> <Nav />
<main className="max-w-7xl relative mx-auto px-2 sm:px-6 md:px-8"> <main>
{/* <div className="hidden md:block w-[16rem] fixed top-16 left-[max(0px,calc(50%-40rem))] bottom-0 right-auto px-8 overflow-y-auto border-2 border-red-500"> */}
{/* <Sidebar /> */}
{/* </div> */}
{children} {children}
</main> </main>
<footer className="w-full h-24 mt-16"> <footer className="w-full h-24 mt-16">

View File

@ -87,21 +87,22 @@ export default function MdxPage({ body, frontMatter, editUrl }) {
{ name: "keywords", content: keywords ? keywords : "" }, { name: "keywords", content: keywords ? keywords : "" },
]} ]}
/> />
<article className="prose dark:prose-invert prose-a:break-all mx-auto lg:mr-[20rem] p-6"> <div className="max-w-7xl mx-auto px-2 sm:px-6 md:px-8">
<header> <article className="prose dark:prose-invert prose-a:break-all mx-auto lg:mr-[20rem] p-6">
<div className="mb-6"> <header>
{title && <h1 className="mb-0">{title}</h1>} <div className="mb-6">
{date && ( {title && <h1 className="mb-0">{title}</h1>}
<p className="text-gray-900 dark:text-gray-500 text-sm pl-2"> {date && (
on {date} <p className="text-gray-900 dark:text-gray-500 text-sm pl-2">
</p> on {date}
)} </p>
)}
{description && <p className="">{description}</p>} {description && <p className="">{description}</p>}
{youtubeId && <LiteYouTubeEmbed id={youtubeId} />} {youtubeId && <LiteYouTubeEmbed id={youtubeId} />}
{podcast && ( {podcast && (
<div className="pt-4"> <div className="pt-4">
<ul className="list-disc"> <ul className="list-disc">
<li> <li>
<a <a
className="flex items-center" className="flex items-center"
target="_blank" target="_blank"
@ -113,23 +114,23 @@ export default function MdxPage({ body, frontMatter, editUrl }) {
</div> </div>
<p className="m-0">Listen to this podcast</p> <p className="m-0">Listen to this podcast</p>
</a> </a>
</li> </li>
</ul> </ul>
</div> </div>
)} )}
</div> </div>
</header> </header>
<main className="my-6"> <main className="my-6">
<MdxContent body={body} observer={observer}/> <MdxContent body={body} observer={observer}/>
{editUrl && ( {editUrl && (
<div className="mt-12 mb-6"> <div className="mt-12 mb-6">
<a <a
className="flex no-underline font-semibold text-yellow-li" className="flex no-underline font-semibold text-yellow-li"
href={editUrl} href={editUrl}
target="_blank" target="_blank"
> >
Edit this page Edit this page
<span className="mx-1"> <span className="mx-1">
<svg <svg
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
className="h-6 w-6" className="h-6 w-6"
@ -143,13 +144,14 @@ export default function MdxPage({ body, frontMatter, editUrl }) {
strokeLinejoin="round" strokeLinejoin="round"
d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"
/> />
</svg> </svg>
</span> </span>
</a> </a>
</div> </div>
)} )}
</main> </main>
</article> </article>
</div>
</> </>
); );
} }