Cascade and modern layout, CSS architecture and Tailwind v4, responsive design, WCAG 2.2 and accessible components in Vue.
Pages
- Cascade, layout and modern CSSSpecificity and cascade layers, custom properties and logical properties, flexbox versus grid and subgrid, container queries, :has(), nesting and @scope, modern colour, view transitions, anchor positioning, popover and dialog, and the Baseline vocabulary for support.
- CSS architecture and Tailwind v4Ownership models for styles — scoped SFC styles, CSS Modules, utility-first with Tailwind v4's CSS-first configuration, design tokens as custom properties, theming and dark mode, how Nuxt UI composes Tailwind variants with app.config tokens, and what happened to BEM and CSS-in-JS.
- Responsive and adaptive designMobile-first with fluid type and spacing, container queries over media queries for components, viewport units and safe areas, touch targets and pointer queries, user preference queries for motion, contrast and colour scheme, images that do not shift layout, and print.
- Accessibility fundamentalsWCAG 2.2 and its new criteria, the European Accessibility Act, semantic HTML first, the rules of ARIA, keyboard and focus management, forms and errors, colour and motion, screen reader testing, and the tooling that makes accessibility verifiable.
- Accessible components in Vue and NuxtBuilding the widgets that go wrong most — modal dialogs, comboboxes, tabs, menus, toasts, forms — with Reka UI and Nuxt UI or by hand following the ARIA Authoring Practices, plus route announcements, focus on navigation, reduced motion, and testing with role-based locators.
Notes for the whole section