Animated Hamburger Menu in CSS/JS | Build a responsive website from scratch (Part 2)

- Intro.
- Research hamburger animation.
- Using a helper CSS class with transform to build animation.
- Adjust transform-origin to fix "X" angles.
- Research transform-origin and adjust styles.
- Write JavaScript to add/remove helper class from hamburger.
- Fine tuning "X" angles.
- Start building overlay.
- Troubleshooting the overlay gradient background.
- Positioning the overlay under the header.
- Update SCSS/JS to put all "open" styles under the header.
- Start working on animating the overlay.
- Create CSS keyframe animation for fading in/out.
- Troubleshooting overlay animation.
- Got fade in animation working!.
- Display properties can't be animated.
- Create fade-out animation.
- Move fade animation to helper class for reusability.
- Troubleshooting fade-out not working.
- Solving with visibility: hidden!.
- Finally working, SO HAPPY :D.
- Closing .