nusmodifications / nusmods

🏫 Official course planning platform for National University of Singapore.
https://nusmods.com
MIT License
588 stars 319 forks source link

No spacing between text in workload visualisation component #3775

Closed kokrui closed 2 months ago

kokrui commented 3 months ago

On the course details and course search pages, we show the workload of each course using these colourful blocks:

Course Details page:

image

Course Search page:

image

When the hours for a specific workload type exceed some number, the number of hours is displayed. However, there is no spacing between the text for the number of hours and the label for the workload type directly to the right (if it exists).

For example: https://nusmods.com/courses/EBA5004/practical-language-processing

image

This looks odd, and we could consider adding a bit of spacing to the right of the "number of hours" label. We should make

Relevant code: https://github.com/nusmodifications/nusmods/blob/master/website/src/views/components/module-info/ModuleWorkload.tsx

sarthakladhwe commented 2 months ago

Hi @kokrui, I've implemented a dynamic spacing approach for the workload label based on the value of 'hours'. This should improve the alignment in various cases.