Interactive Rating Component with HTML, CSS and Vanilla JS

Hi there. You did a good job 😎

keep improving your programming skills🛠️

your solution looks great, however, if you want to improve it, you can follow these steps:

✅ it is better to avoid double cycles

for(let i of circulos) {
  i.onclick = function() {
    for (let circulo of circulos) {
      circulo.style.background = 'var(--DarkBlue)';
      circulo.style.color = 'var(--MediumGrey)';        
    }

✅ it would be better to do it with css

document.addEventListener('mousemove', function(e){
    if(e.target == i && i.style.background == 'var(--DarkBlue)') {
      i.style.background = 'var(--LightGrey)';
      i.style.color = 'var(--White)'; 
    }
    if(e.target != i && i.style.background != 'var(--primary)') {
      i.style.background = 'var(--DarkBlue)';
      i.style.color = 'var(--MediumGrey)';
    }
  });

I hope my feedback will be helpful. You can mark it as useful if so 👍

Good luck and fun coding 🤝⌨️