Transcript
00:00 Remember, none of what we're doing here is present on the design in the Figma file. This is purely the light on top that we're going to wow the designers with. In this first exercise, we're going to focus on the content section here, and we're going to create a slide up, enter animation effect where the elements fade in while sliding up
00:19 a little bit. And we're going to add a staggered delay, so the logo will slide up first, and then the epic stack title, and then the paragraph with maybe about half a second delay or something like this. So your job is to define a slide up keyframe animation in the Tailwind config, and then
00:35 define an animation that consumes that slide up keyframe. So it's going to create an animate slide up utility that you can use on any element in the markup. So try to get that working first, and if you do, then you're going to add an animation delay on the heading tag and on the paragraph below. This might all sound complicated, but I'm sure you've got this.
00:55 Make sure you read up on the refresher in the workshop documentation to remind yourself or learn how to define keyframe animations and animations in CSS, but also in the Tailwind config, and then I'm sure you're going to work it out. Good luck.