Sort of on a tangent to the actual content of the page, but what documentation system/CMS is this particular web page UI? It seems very fast and relatively uncluttered for the menu on the left side, content pane, top horizontal menu bar.
back
3 comments
https://github.com/bluesky-social/atproto-website
If I'm understanding this codebase right, it's a hand-rolled framework based on MDX and Next.js; the UI elements you're referring to were designed from scratch and aren't based on any existing CMS theme.
Some of it looks like tailwind css and they have a syntax highlighting addon that shows up in the homepage source as well.
some modified vercel template by the looks of it
No sure I agree on fast. At least on mobile the sidebar has an show/hide slide animation that takes a sizeable fraction of a second. In fact is one of the slowest animations for this I have seen.
I disable animations entirely on devices I use where possible. They just waste time and that adds up if you use something regularly.
I haven't looked at it on mobile, that's unfortunate to hear. I don't see any animation when interacting with it on a desktop browser, snapping open a left side header menu item to see sub-items seems instant.
I meant showing/hiding the side bar itself, not headings in it. Using the triple dash menu button in the top left corner.
Yeah, I see what you mean now, I am looking at it on mobile and that animated slider to show or hide the entire menu seems like it takes unnecessarily long.
Indeed, and any animation at all is too long for UI elements in my opinion.
It should take time for you too appreciate the main text becoming blurry and unreadable and to prepare your brain for the new batch of text
Gonna go out on a limb here and say css transitions are not what they are talking about.
Agreed. Is there an easy way besides the simple OS feature ?
Looks like astro starlight
There’s a next-route-announcer tag on the page, so probably not Astro. (Can’t recommend Astro Starlight enough though!)