mirror of
https://we.phorge.it/source/phorge.git
synced 2024-11-10 00:42:41 +01:00
Add more layout constraints to tokenizer CSS to prevent layout issues with Chinese glyphs in Firefox 73
Summary: Fixes T13495. See that task for details. Tokenizer tokens which contain Chinese glyphs are slightly taller than normal tokens in Firefox 73, and at some non-100% zoom levels in other browsers. This cauess the tokenizer list to layout and line break oddly. Fix this by clamping tokenizer sizes more aggressively. Specifying a `max-height` means they can no longer line wrap, so this also requires more specification of overflow behavior. Test Plan: Before: {F7216435} After: {F7216439} Maniphest Tasks: T13495 Differential Revision: https://secure.phabricator.com/D21026
This commit is contained in:
parent
e58ef418c7
commit
d3f4af4a3a
1 changed files with 11 additions and 1 deletions
|
@ -72,7 +72,17 @@ a.jx-tokenizer-token {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
color: {$sh-bluetext};
|
color: {$sh-bluetext};
|
||||||
min-height: 16px;
|
|
||||||
|
/* See T13495. Certain Chinese glyphs can cause layout artifacts unless
|
||||||
|
we're fairly aggressive about specifying element sizing. */
|
||||||
|
|
||||||
|
line-height: 18px;
|
||||||
|
min-height: 20px;
|
||||||
|
max-height: 20px;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
max-width: 95%;
|
||||||
}
|
}
|
||||||
|
|
||||||
a.jx-tokenizer-token:hover {
|
a.jx-tokenizer-token:hover {
|
||||||
|
|
Loading…
Reference in a new issue