[docs] Place Quick Nav after the main demo in the DOM

[vladmoroz]

Place Quick Nav after the main demo in the DOM so that keyboard focus follows the reading order

https://deploy-preview-845--base-ui.netlify.app/new/components/dialog

[vladmoroz]

A thinker figure looking at the lobotomised owl

[mui-bot]

Netlify deploy preview

https://deploy-preview-845--base-ui.netlify.app/

Generated by 🚫 dangerJS against cc6ae2b

[colmtuite]

@vladmoroz Imo, this won't be expected behaviour when headings become links.

[vladmoroz]

@vladmoroz Imo, this won't be expected behaviour when headings become links.

• Hmm what's the expected behaviour in that case?
• I wouldn't do heading links personally, I think quick nav is perfectly sufficient for grabbing a link to a section. I like plain, non-clickable headings. Would this be too much of a contentious choice?

[colmtuite]

Discussed on a call:

Imo, headings should be links in some fashion. I appreciate that it's annoying when the actual heading is clickable, it's nice to be able to select or click headings for no reason at all while you're reading. But we could put a link icon beside each heading, or something similar.

Imo, when focus is in the main content pane, it should remain there. Sidebar will/should be considered a separate pane. So focus should either go to sidebar first or last.