Layered navigation system

[benborgers]

This introduces two levels of navigation: one for the entire NFToken site, and one just for the NFToken docs.

https://share.cleanshot.com/y932U5

I’m not too sure about the design of the mobile docs nav — happy to hear suggestions for other options!

To do

• [ ] Scrolling down on a docs page on mobile and then navigating to another page causes the underline on the primary nav to fly up weirdly.

Checklist

• [ ] Splash page looks good in desktop and mobile.
• [ ] “Learn more” and “Create an NFT” links work.
• [ ] Sidebar and header show on docs pages and are position: sticky when scrolling.
• [ ] Docs look good on mobile.
• [ ] Mobile nav works even when scrolled down the page.
• [ ] Mobile nav closes when a link is clicked.
• [ ] Page is not scrollable while mobile nav is open.
• [ ] Live Minting Demo works.
• [ ] All pages look good when browser font size is increased (in settings, not cmd+/cmd-).
• [ ] All pages look good in dark mode.
• [ ] All pages look good in Safari.
• [ ] All pages look good in Firefox.

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated
nftoken	✅ Ready (Inspect)	Visit Preview	Jul 10, 2022 at 7:18AM (UTC)

[benborgers]

Hmm we could separate out Create an NFT and Create a Mintlist into their own pages outside of the docs, and then group them under Mintlists and NFTs in the main navigation? The question then is where stuff like the code snippet on the Create an NFT page goes. Maybe there needs to be an NFTs page in the docs and a Create an NFT page outside of the docs.

Something like this?

[vpontis]

@benborgers I pushed some things here. I didn't like the Android style nav so I tried a two tiered tab system.

[benborgers]

I really like it!