All solutions

So far this has been the most challenging project I made, I'm not sure if my JavaScript is good enough, I made everything work, but I think I need to improve my code to make it more readable and maybe work with fewer lines. Question for everyone: for my bookmark button, whenever I click on it to change its styles my :hover effect, disappears, any idea how to fix this without using "mouseover" and "mouseout" events?

Things to improve:

• I must add aria-label to some elements to improve controls for screen readers.
• I did not know that you can not put "label" tags inside "button" tags, I did that to make the modal selection effect.
• Fix bookmark hover effect.
• Add smooth animation to some elements.

I'm trying to improve my "good practices" if anyone can check my js I'd be very grateful!

The only js was to lock the screen when the menu was enabled.

I spent some time learning how to change the appearance of the slider, there were many different ways such as using box-shadow, using a div, or jquery. But I wanted to use an efficient method so I worked with a background color and a background image, the image is the progress bar, and depending on what you select, its width will change [0%, 25%, 50%, 75%, 100%]. There might be better ways to do this but I found this one more suitable for me. Apart from that everything was easy!

-Edit: somehow the screenshot does not show my solution properly.

This was the hardest challenge so far, I always try to make them pixel-perfect using PureRef (extremely useful software), at the beginning, it was easy for the mobile except for the size of some pictures which I had to make bigger and position them properly. Secondly, I wanted to challenge myself so I did not use Js. I worked with selectors and inputs but I realized it is easy to use a few JavaScript lines instead. (It's more readable and will help your future partners if they work with your code).

In the end, this challenge took me way more time than I expected but it helped me to use some properties such as clamp() I had to watch Kevin Powell's video a couple of times 😂. Also, the background-size and position gave me a lot of headaches. Good luck to anyone who tries this one!

Any improvements are welcome!

Any help is welcome

If anyone wants to help me to improve my code (JS) I'd be very grateful!

Hi, this challenge took me some time to complete but I finished it with some help, but I got stuck with the reset btn, I couldn't figure out how to make it "disabled" when the values are $0.00 in the result section. (below / right) If anybody could help me I would be very grateful!

Hi, I need some help to improve my code, please. I used vanilla JS to complete this challenge and no libraries like chart.js, my issue is that my logic to change the bar color depending on the day of the week works. But it's impractical, I know there's a way to improve it but I was stuck for a couple of days with it. Any help would be amazing!

Greetings, This challenge took me more time than I thought, but I learned way too much. After I finished this challenge I realized that I could improve my logic way more, there are a lot of unnecessary functions in my code but that helped me to understand how my future projects will improve. Any feedback is welcome.

Any improvements are welcome!

Any improvements for this challenge are welcome!

Greetings everyone, I would like to ask you for some feedback about my js code. I intended to clear all inputs after every text field was correct but I couldn't figure out how to do it. I also used "nextElementSibling" to show the error messages because I didn't know how to add the elements to my forEach function. Thanks.

Hi! If anyone can check my JavaScript code and send me some tips I'll really appreciate it! I want to improve my logic as much as I can in this case I used an email regex for the validation but I saw that you can use validity.typeMismatch() for email input. I know there are many ways to solve this challenge and I'd be very happy to read your feedback!

I'm still practicing Bootstrap and this challenge took me a little bit more than the rest. Any feedback is welcome!

Greetings, It's been a while since I uploaded a solution, I wanted to practice some Bootstrap, and I realized that It's an amazing tool but not for making components since if you want to complete the challenges as "pixel perfect" you have to modify Bootstrap variables and It can take you more time than you expected. Any feedback is welcome as always!

It took me some time to realize how to make the interaction until I found out that I had to set the "social media" container with opacity: 0 or visibility: hidden, and then make it visible, but my main obstacle was the share button, I wanted to use only one and I ended up using two... Gladly I also realized how to improve my code for the next challenge!

I could have used some js including forEach() to display the answers but I found it easier doing all the "interaction" only with basic CSS

• I also could have used smoother animations but didn't want to spend a lot of time on this challenge.

Any feedback is welcome! :)

This was my first time using vanilla JS on my own, I knew what I had to do but before I had to search for methods for my functions. There are some things I could improve such as blocking the submit button until an option has been chosen or maybe another button to come back to the first rating card...

Any feedback is VERY welcome! :)

Can anyone help me with the background designs? I couldn't make them less rounded.. Also, any feedback is welcome!

Hey, you! could you please check my code and let me know how can I improve it, please Thanks! :)

• After completing this challenge I realized that for this kind of challenges using a framework like Bootstrap is a better option. My conclusion comes after noticing the amount of time it took me to complete it, knowing that I could do it faster using any framework.
• Also I tried my best to make it pixel perfect, I know I can improve some things on this project but I'm happy with it

Any feedback is welcome! :)

I'm aware that I didn't put the footer links inside an <ul> > <li> apart from that any feedback is welcome!