Explain "recent" part of the completion bar

[m-aciek]

Make the completion bar with the recent progress part self-explanatory. That way the visualisation should be more understandable, and the whole table more informative.

cc @encukou

---

📊 Dashboard preview 📊: https://python-docs-translations.github.io/dashboard/73/merge/

[m-aciek]

I wonder now with text of different lengths in rows, doesn't it look better when aligned to left?

[StanFromIreland]

doesn't it look better when aligned to left?

I disagree here, in my opinion centered is better in the case of the completion bar.

[encukou]

To me, it looks great either way! Thank you for adding the info!

Format nitpick: putting the number in parentheses with a + and without recently, like (+53.80%), seems shorter but still understandable (with a note “the number in parentheses in shows change in the last 30 days”).

(FWIW, Python can add both + and %: "({:+.2%})".format(project.completion/100))

[encukou]

This looks great to me, thanks!

[StanFromIreland]

Maybe a minor padding?

[m-aciek]

Maybe a minor padding?

In practice it would be to display the appended text instead of inside the bar at lower width.

[m-aciek]

Maybe a minor padding?

It's not trivial to implement, as adding a padding CSS property to the bar breaks rendering of near-zero completion (it's too big). We would need to complicate the DOM model of the bar to get the width of the bare text, as we check now only for the bar width and width with the overflow, only when it happens. Let's merge it as is now.