search

Financial-Times / o-typography

Typography and vertical rhythm styles for FT branding
http://registry.origami.ft.com/components/o-typography
10 stars 2 forks source link

Improve external icon position and size. #224

Closed notlee closed 4 years ago

notlee commented 4 years ago

With text-decoration-thickness support the external icon underline does not extend under the icon. This is actually preferable.

Simon C:

Fine having the underline not extend - that would actually be preferable - the icon should be on the baseline though

I haven't been able to get rid of the underline when text-decoration-thickness is not supported without using a pseudo element, but that would allow the icon to wrap on its own and also we need to after pseudo element for the "opens in a new tab" screen reader notice.

So we'll maintain the cull underline when text-decoration-thickness is not supported:

Screenshot 2019-11-01 at 16 02 13

But intentionally not have an underline when text-decoration-thickness is supported:

Screenshot 2019-11-01 at 16 01 43
origamiserviceuser commented 4 years ago

o-typography bundle size difference from 5.12.0 to 7970c6f75ad345dd8bf319ebbbcff6aa477a3bd5 css, master: 11.67kb decrease (-0.90kb/gzip) css, internal: 8.21kb decrease (-0.35kb/gzip) css, whitelabel: 0.26kb increase (0.10kb/gzip) An insignificant difference was also found for: js