Currently a single bike slot displays the bike's current charge only by text. This may lead to users renting a bike with low battery because they don't notice quick enough-
This pull request replaces the :zap: emoji in the station slots with a similar icon displaying the current charge like a classic battery icon. Charges below 40% turn the icon red indicating low battery.
This is achieved by introducing the Icon as a new component which contains a svg:
The lightning icon is drawn with a path
The fill is created by drawing a rectangle with a clipping path
The fill is adjusted by the rectangles height which is inherited via a prop.
Currently a single bike slot displays the bike's current charge only by text. This may lead to users renting a bike with low battery because they don't notice quick enough-
This pull request replaces the :zap: emoji in the station slots with a similar icon displaying the current charge like a classic battery icon. Charges below 40% turn the icon red indicating low battery.
This is achieved by introducing the Icon as a new component which contains a svg: