This is a solution to the Tip calculator app challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.
Users should be able to:
- View the optimal layout for the app depending on their device's screen size
- See hover states for all interactive elements on the page
- Calculate the correct tip and total cost of the bill per person
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- Mobile-first workflow
- JavaScript
- bem - Block Element Modifier
- scss - Sassy Cascading Style Sheets
I used this feature of CSS for the first time.
.splitter__form-group-input,
.splitter__form-group-input,
.splitter__tip-input {
caret-color: #26C2AE;
}
If you want more help with writing markdown, we'd recommend checking out The Markdown Guide to learn more.
First I want to finish the javascript course I'm taking on freecodecamp, I'm also going through the learning path on Frontendmentor, and after that I want to focus more on React, Next.js and Node.js.
- ChatGPT - He is my hero, if I need something fast, if I can't understand something, or if I can't find it on the internet, I always ask him.
- W3Schools - This is my favorite documentation platform I've been using since I started programming, it's the best explained resource.
- YouTube - I'm always looking for news and listening to other developers, sharing their experiences so that I can see many different solutions to a problem.