Completed
- Adding prefers-reduced-motion
Class Central Classrooms beta
YouTube videos curated by Class Central.
Classroom Contents
Build a Responsive, Animated Accordion That Looks Pretty Good
Automatically move to the next video in the Classroom when playback concludes
- 1 - Introduction
- 2 - The inspiration for what I’m going to build
- 3 - Building things out the right way
- 4 - The HTML
- 5 - The SVG icons
- 6 - The generic CSS stuff
- 7 - Setting up the panel styles
- 8 - Styling the icons
- 9 - Setting up the size of the panels and fixing up the button
- 10 - Dealing with the overflowing text
- 11 - The JavaScript - adding the interactions
- 12 - Adding the animations
- 13 - Fixing up the typography and text positioning
- 14 - Making the text more readable
- 15 - Adding prefers-reduced-motion
- 16 - Adding a background to the titles
- 17 - Making it responsive
- 18 - Improving the keyboard interactions
- 19 - Using containment
