Submitted about 5 years ago

Pricing page with toggle (and animation!)

@Yintii

A solution to the Pricing component with toggle challenge

Solution retrospective

I had a lot of fun doing this one, I used a lot of the tips and new things I learned from the community and this one is done as well! Tell me what you all think. :)

Code

Couldn’t fetch repository

Please log in to post a comment

Community feedback

Shashi Lo•1,345
@shashilo
Posted about 5 years ago
This was a good job Kele. You sure did forget the background, but you didn't miss any of the other elements. I like the animation of the button. It's nice and smooth.

The details. If you compare the design to your project, it's missing a many details. Here are the items of improvement that I noticed:
- Annually and Monthly content on desktop is too wide.
- The entire switch selector should be clickable, not just the circle. This will provide better usability and act like an input button.
- $ text should be smaller like a subscript.
- Size of the Professional section is too tall. It's content should align with the other sections as well.
- Learn More button's should have text-uppercase and they should act as a button with hover state.
Kele 'Yintii' Heart•185
@Yintii
Posted about 5 years ago
Omg I forgot about the background image entirely 🤣😂

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord