For those who don’t want to watch the video, the trick is to nest blocks, where the title of a given tree level is in the element and the subtree consists of more details elements outside the summary, and use the rule
The way I read those pages is that the details element is simply a group of stuff with a summary and the behavior that everything except the summary will only be displayed if the user wants to see it.
For those who don’t want to watch the video, the trick is to nest blocks, where the title of a given tree level is in the element and the subtree consists of more details elements outside the summary, and use the rule
Technically the trees are still trees and they’re still interactive without the rule. The rule just makes the tree/hierarchy visually noticeable 🙃
I like this method of adding tree-like styling to these: https://iamkate.com/code/tree-views/
Is this an in spec use of Summary/Details tags? Like, as opposed to using it for menus and modals? Maybe yes if information, no if navigation?
After poking around on …
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details,
https://w3c.github.io/aria/#group
https://www.w3.org/TR/2011/WD-html5-author-20110809/the-details-element.html
… I tend to think it is.
The way I read those pages is that the details element is simply a group of stuff with a summary and the behavior that everything except the summary will only be displayed if the user wants to see it.