Responsive Web Applications with Container Queries
summary
Claims that a component-first approach plus container queries makes a complex admin responsive quickly are backed by specifics: Shopify goes from monolithic templates to a component library, uses JavaScript-driven container queries (data attributes and a small runtime) so components toggle classes, adopts React and Polaris, and finishes a fully fluid responsive design in under a month. Caveats include perceived runtime delay, a few consciously broken templates, and many cases solved instead with flexbox and CSS Grid rather than true container-query specs.
AI-written summary · about
chapters (9)
- 0:00Start
- 0:51Beautiful Accounting Software
- 7:22A team of designers and developers for each platform
- 8:15Support Multiple Devices
- 9:13Monolithic app with accessible templates
- 14:23multiple viewports
- 29:07It's not about the properties, it's about the purpose.
- 38:20Make the right things easy and the wrong things hard
- 48:00Container Queries enable faster development
related talks
17mThe New Responsive: Web Design in a Component-Driven World
19mContainer Queries
17mContainer queries, the next step towards a truly modular CSS
28mContainer Queries: The Past, Future, and How You Can Actually Even Use Them Today
01h 01mThe Evolution of Responsive Web Design: What's Next?
26mResponsive Components: Present & Future
22mThe next step towards a truly modular CSS
48mWhat Are Container Queries and Why You Need Them