Animations with CSS and Styled Components

🦕 Next button was positioned differently to the bottom right hand side so that this doesn't cover over other major content on pages.
🧷 tweaks have been made in some styled components.
🦈 Once learner is on Avatar selection page, learner can hover from hover effect over then avatar shakes.
🦀 Once Avatar is selected from page, this avatar is shown with shake animation within progress bar. this was with adding className called circle-avatar.
💅 Animation created with styled components using keyframes and transform to make every avatar dance and bounce for fun interactivity 💃 🕺
👯 dance/bounce animation includes shadow effect which has it's own transform animation.
🦋 In the landing page for interactivity the avatars have a floating animation created in styled components with keyframes.
🐧 styling updated for landing page on avatars to make responsive.
🐌 Media queries used in styled components buttons for mobile view to make them slightly smaller in size.
🐞 Media query for grid layout-(adjusting sizing for row gap and column gap).

✨ 🦖 I think I've described everything here 😸 ✨

Name	Link
Latest commit	4b4e17603bda64fb25b286b871c4a10905d20b47
Latest deploy log	https://app.netlify.com/sites/alislearning/deploys/62e114002d139c0008bd527f
Deploy Preview	https://deploy-preview-73--alislearning.netlify.app
Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

fac24 / alis-learning