Page MenuHomePhabricator

Fix an issue where the profile menu could become enormous
ClosedPublic

Authored by epriestley on Jan 18 2016, 4:33 PM.
Tags
None
Referenced Files
Unknown Object (File)
Fri, May 3, 2:12 AM
Unknown Object (File)
Mon, Apr 29, 1:35 PM
Unknown Object (File)
Wed, Apr 24, 9:49 PM
Unknown Object (File)
Sun, Apr 21, 3:38 PM
Unknown Object (File)
Fri, Apr 19, 4:25 AM
Unknown Object (File)
Wed, Apr 17, 2:28 PM
Unknown Object (File)
Sat, Apr 13, 6:09 PM
Unknown Object (File)
Thu, Apr 11, 6:55 AM
Subscribers
None

Details

Summary

Ref T10054. Without max-width, Safari can make this too large with a long project name (maybe because of table-cell?).

Test Plan

Saw normal-width menu instead of huge menu on very long project.

Diff Detail

Repository
rP Phabricator
Branch
tag2
Lint
Lint Passed
Unit
No Test Coverage
Build Status
Buildable 10169
Build 12345: Run Core Tests
Build 12344: arc lint + arc unit

Event Timeline

epriestley retitled this revision from to Fix an issue where the profile menu could become enormous.
epriestley updated this object.
epriestley edited the test plan for this revision. (Show Details)
epriestley added a reviewer: chad.

Does the text not ellipsis?

webroot/rsrc/css/phui/phui-profile-menu.css
40

if this container has a width, it should do ... i think?

That does also fix it (at least, if I add box-sizing: border-box; or do the math myself) I think it's better to not require all the sub-elements to have explicit widths if we can get away with it -- if nothing else, I imagine that'll make collapsing a bit messier.

The text does ellipsis. Here's the pre-fix state:

Screen Shot 2016-01-18 at 8.40.26 AM.png (1×1 px, 261 KB)

Here's the post-fix state:

Screen Shot 2016-01-18 at 8.40.07 AM.png (1×1 px, 264 KB)

chad edited edge metadata.

oh ok, i didnt know if you were just hiding the overflow.

This revision is now accepted and ready to land.Jan 18 2016, 4:44 PM

The text does ellipsis.

...if forced to by max-width, that is.

I think this is just a weird interaction between width: ... and display: table-cell because removing display: table-cell (without max-width) gives us the correct width (it just creates other display-related issues):

Screen Shot 2016-01-18 at 8.46.06 AM.png (1×1 px, 264 KB)

This revision was automatically updated to reflect the committed changes.