[inopinatus]

I've got a toolkit of pure CSS widgets I privately call "You might not need Javascript". Dropdowns, modal/lightbox, concertina, slideovers, toggles, popover, transitions, no problem.

Hacks with :checked are well known, but you can do a ton of stuff with :focus-within, :invalid, :target, :hover, <details>/<summary>/[open], grids/flexbox/visibility, and the adjacent-sibling selector. <dialog> is almost there, although it still needs a JS activation hook.

It feels really good to have a complete application UI that works with JS disabled, and I can still progressively enhance it with JS for necessary perversions of HTML like ARIA etc.

[marlowe221]

As new web developer, I would LOVE to learn how to do this kind of thing purely in CSS!

[inopinatus]

My process:

* trial

* error

* reading the HTML, DOM, and CSS standards documents very thoroughly end-to-end

* stackoverflow

* repeat