Hungerbar.js

[Fweddi]

  return (
    <div className="bar">
      <div data-testid="hunger-bar" className="bar-level" style={{ width: props.hunger + "%" }} />
    </div>
  );
};

Your hungerbar decreases in width according to a dynamic state - amazing! We tried this on our project with the height of our timebar, and it, er, well you probably saw. It changed both the height and width. Do you know how you would fix our issue?

[sylv1ah]

It could be that you're using a svg where we used two nested divs and changed the width of the inner div according to our hunger state, I'm not too sure about about svgs but it could be that it has a set height and width and when you tried to only change the height it will also effect the width (so it looks like it scales, which I don't think you want?) Also question from me, how do you make svgs? I'm intrigued 🧐

[starsuit]

It might be worth letting go of the svg in favour of a div inside div thingy - but I know that's hard to hear...