When a status bar item updates frequently with something like a counter with a fixed number of digits it grows and shrinks depending on what digits are shown. This makes it look a bit broken, and it get worse if there are items to the sides of the counter.
I'd like to suggest that status bar items are rendered with fixed width/monospaced digits. I tried with making the whole VS Code UI render like this, with this CSS:
* { font-feature-settings: "tnum"; }
And I can't notice that it is bad anywhere. Here's what a timer-counter I wrote looks like with and without this CSS applied:
See also:
When a status bar item updates frequently with something like a counter with a fixed number of digits it grows and shrinks depending on what digits are shown. This makes it look a bit broken, and it get worse if there are items to the sides of the counter.
I'd like to suggest that status bar items are rendered with fixed width/monospaced digits. I tried with making the whole VS Code UI render like this, with this CSS:
And I can't notice that it is bad anywhere. Here's what a timer-counter I wrote looks like with and without this CSS applied:
See also: