search

element-hq / element-web

A glossy Matrix collaboration client for the web.
https://element.io
GNU Affero General Public License v3.0
11.05k stars 1.97k forks source link

Change `font-size` variables' unit from `px` to `rem`? #25180

Closed luixxiul closed 1 year ago

luixxiul commented 1 year ago

Your use case

This is a question rather than a proposal.

What would you like to do?

Change font-size variables' unit from px to rem on https://github.com/matrix-org/matrix-react-sdk/blob/92906c2130b447f4bccd07eb5800c2cb513092a4/res/css/_font-sizes.pcss

Why would you like to do it?

 * That means that, slightly confusingly, `$font-10px` is only *actually* 10px at the default font size: at a base
 * `font-size` of 15, it is actually 15px.

https://github.com/matrix-org/matrix-react-sdk/blob/92906c2130b447f4bccd07eb5800c2cb513092a4/res/css/_font-sizes.pcss#L24-L25

If they are indeed confusing, why not changing the names to something like $font-1.2rem?

If changing like that confuses even more, why not either deprecating them or removing variables, since we have variables corresponding to every integral number from 1 to 52? $font-1px is always equal to 0.1rem, and $font-52px is to 5.2rem, for example.

How would you like to achieve it?

Have you considered any alternatives?

No response

Additional context

The internal discussion is not shared, so the situation around font attributes is unknown to anyone who are not the official internal team members.

robintown commented 1 year ago

I find it helpful that these variables are named in px units, because on our designs in Figma, font sizes are always given as px values. If they were named with rem instead, this would make it more difficult to build out interface components to design specifications, because I would have to frequently remind myself that our base font size is 10px (I didn't remember this fact off the top of my head, and for someone new to the project, it could take some time to discover). I believe that is also why we're not simply writing font sizes in rem units directly.

I think there may be a plan to start using semantic names for font sizes anyways, like Element Call does, once our design systems are better integrated into the code.

luixxiul commented 1 year ago

Closing in favor of the future plan for the font sizing