hover over stars hover over previous

.rating {
  display: inline-flex;
  flex-direction: row-reverse;
}
i {
  width: 20px;
  height: 20px;
  margin: 5px;
  border: 1px solid black;
  transition: all 0.3s ease-in;
}
i:hover ~ i,
i:hover {
  background: black;
}