Under-Engineered Patterns
summary
Claims minimal code and native HTML adapt controls across contexts: inputs match page type by using three CSS declarations (font plus letter and word spacing), selects drop the native arrow with appearance:none plus SVG arrow, checkboxes use accent-color for checked and focus, multi-selects become checkbox groups with a disclosure and a counted “26 selected” example, scrollable tables use tabindex + role region for keyboard scrolling, and the patterns work in dark mode, high-contrast, printing and with progressive enhancement.
AI-written summary · about
chapters (10)
- 0:00Introduction
- 1:06Under-engineered patterns
- 3:12Styling text fields
- 6:41Custom checkboxes & radios
- 15:30Select menus quirks
- 21:05Accessible toggle switches
- 25:03Multi-select lists
- 31:03CSS/JS dependencies
- 34:44Accessible scrollable tables
- 39:46Conclusion and resources
related talks
44mModern UI Patterns
40mStop using JavaScript for that - Moving features from JS to CSS and HTML
36mStop using JS for that: moving features from JS to CSS & HTML
31m"Stop using JavaScript for that: moving features from JS to CSS and HTML"
34mDon't Use JS for That: Moving Features to CSS and HTML
30mStop using JS for that: Moving features to CSS and HTML
44mSelect it! Styling new HTML UI capabilities
51mStyling new HTML UI capabilities