jeffemmett
/
web3
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[components/layout,MDX]: prep layout for TOCs

This commit is contained in:
olayway 2022-05-24 00:00:32 +02:00
parent ee95033e87
commit 2baae59588
2 changed files with 16 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
site/components/Layout.js
View File

@ -17,16 +17,14 @@ export default function Layout({ children }) {
<link rel="preconnect" href="https://fonts.gstatic.com" crossOrigin="" />
</Head>
<Nav />
<main className="max-w-7xl mx-auto px-2 sm:px-6 lg:px-8 border-2 border-green-500">
<div className="hidden lg: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">
<main className="max-w-7xl mx-auto px-2 sm:px-6 md:px-8 border-2 border-green-500">
<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>
<div className="lg:pl-[16rem]">
{children}
</div>
</main>
<footer className="w-full h-24 mt-16">
<div className="max-w-7xl mx-auto py-12 px-4 overflow-hidden sm:px-6 lg:px-8">
<div className="max-w-7xl mx-auto py-12 px-4 overflow-hidden sm:px-6 md:px-8">
<nav className="-mx-5 -my-2 flex flex-wrap justify-center" aria-label="Footer">
{navLinks.map((item) => (
<div key={item.name} className="px-5 py-2">

42
site/components/MDX.js
View File

@ -84,7 +84,7 @@ export default function MdxPage({ children }) {
{ name: "keywords", content: keywords ? keywords : "" }
]}
/>
<article className="prose max-w-none dark:prose-invert prose-a:break-all mx-auto p-6 xl:mr-50 xl:pr-10 border-2 border-yellow-500">
<article className="px-8 md:pl-[14rem] lg:pr-[14rem] prose max-w-none dark:prose-invert prose-a:break-all mx-auto border-2 border-yellow-500">
<header>
<div className="mb-6">
{title && <h1 className="mb-0">{title}</h1>}
@ -117,21 +117,6 @@ export default function MdxPage({ children }) {
</header>
<main>
<div className="my-6">
<<<<<<< HEAD
<Component components={components} />
</div>
{editUrl && (
<div className='mt-12 mb-6'>
<a className="flex no-underline font-semibold text-yellow-li" href={editUrl} target="_blank">
Edit this page
<span className="mx-1">
<svg xmlns="http://www.w3.org/2000/svg" className="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth="2">
<path strokeLinecap="round" strokeLinejoin="round" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14" />
</svg>
</span>
</a>
</div>)}
=======
<Component components={components} />
</div>
{editUrl && (
@ -139,25 +124,24 @@ export default function MdxPage({ children }) {
<a className="flex no-underline font-semibold text-yellow-li" href={editUrl} target="_blank">
Edit this page
<span className="mx-1">
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth="2">
<svg xmlns="http://www.w3.org/2000/svg" className="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth="2">
<path strokeLinecap="round" strokeLinejoin="round" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14" />
</svg>
</span>
</a>
</div>)}
>>>>>>> 34c9b77 ([components/sidebar][f]: layout ajd for sidebar)
</main>
{/* <div className="hidden xl:block w-50 fixed inset-0 right-auto overflow-y-auto"> */}
{/* <nav> */}
{/* <ul> */}
{/* <li>Heading 1</li> */}
{/* <li>Heading 2</li> */}
{/* <li>Heading 3</li> */}
{/* <li>Heading 4</li> */}
{/* <li>Heading 5</li> */}
{/* </ul> */}
{/* </nav> */}
{/* </div> */}
<div className="hidden lg:block w-[16rem] px-8 fixed top-16 right-[max(0px,50%-40rem)] bottom-0 overflow-y-auto border-2 border-blue-500">
<nav>
<ul>
<li>Heading 1</li>
<li>Heading 2</li>
<li>Heading 3</li>
<li>Heading 4</li>
<li>Heading 5</li>
</ul>
</nav>
</div>
</article>
</>
);