Skip to content
Submitted over 1 year ago

Tip Calculator (SASS + JavaScript + Tailwind) + Custom Colors and Font

accessibility, sass/scss, tailwind-css, lighthouse
P
Daniel 🛸•44,790
@danielmrz-dev
A solution to the Tip calculator app challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

Hello! I'm Daniel and this is my solution for this challenge! 😊

⚒️ Built with:

  • HTML
  • SASS
  • Tailwind
  • JavaScript
  • mobile first workflow approach

🛸 Features:

  • Custom Colors and Font-Family 🎨
  • Responsive layout using mobile first workflow approach 📲
  • Added a calculate button so the result only appears after you input the numbers and click on it 🔽

Another very good challenge to practice JavaScript logic. It's been a few weeks since I finished this one... I hadn't yet learned know how to use classList.add/remove/toggle, so the code is much bigger than necessary. But I'll leave that way cause I intend to revisit it in the future and do it again using other techniques and technologies that I'm studying.

If you have any suggestions on how I can improve this project, feel free to leave me a comment!

Feedback welcome 😊

Code

Please log in to post a comment

Log in

Community feedback

  • Ahmad Maartmesrini•120
    @Ahmad-Maartmesrini

    I love purple 💜 your design looks awesome, I think they used the green color here for this reason 💵 did you forget to update the readme file? it features the green design

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