Quantcast
Channel: Issues for Drupal core
Viewing all articles
Browse latest Browse all 295807

Not all UI elements are following rems scaling

$
0
0

Problem/Motivation

User themes can have something like font-size: 1vw; (just for instance) set on html tag, to have proportional scaling of all UI elements no matter which resolution of the screen.

Almost all sizes of everything related to Navigation module are based on --admin-toolbar-rem CSS variable, which is doing its job great. However we still have few UI elements with the px sizes set, or some where don't have sizes set at all (for instance logotype)

test

test

Steps to reproduce

1. Standard profile installation
2. Enable Navigation module
3. Then on any page try to zoom out or zoom in
4. Then add for instance font-size: 1vw; to the html tag and try to zoom out or zoom it again

I found 3 UI elements (could be more, but seems only 3, at least i didn't find anything else) where we have to set or replace sizes in rems:
1. Logotype
2. Dividing line between sections in navigation bar
3. Outlines/borders, hovers and focuses (to be checked for all interactive elements which does have these states with outlines)

Proposed resolution

1. Convert existing hardcoded px values into rems (using --admin-toolbar-rem css variable)
2. For the elements like logotype - add sizes


Viewing all articles
Browse latest Browse all 295807

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>