password-generator-app

Please log in to post a comment
Log in with GitHubCommunity feedback
- @j-hogben
Hi Jose,
You're solution looks good, functionality seems to be working really nicely, nice work!
I do have a suggestion for the styling:
- I notice from your js that the whole of the range slider colour changes to green if the value is > 0. It might be worth looking at this, adding an event listener and a background linear gradient to the slider so the background colour changes depending on the slider value/progress.
Something like this:
const sliderProgress = '#a4ffaf'; const sliderEmpty = '#08070b'; // WHEN SLIDER VALUE CHANGES, UPDATE TRACK COLOUR slider_range.addEventListener('input', (event) => { const sliderPosition = event.target.value; const progress = (sliderPosition / slider_range.max) * 100; slider_range.style.background = `linear-gradient(to right, ${sliderProgress}, ${sliderProgress} ${progress}%, ${sliderEmpty} ${progress}%)`; });
...should change the background colour of the slider at each 'input' to follow your slider thumb. Hope this is helpful in some way!
Looking good mate, keep it up!
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