Page MenuHomePhabricator

Wikipedia shop's responsive layout pads navigation bar layout and truncates searchbox early
Closed, ResolvedPublic


I visited the relaunched in Firefox 37 on Ubuntu 14.10
The search box is clipped to show only "Search the sh" placeholder text, while there is plenty of space to the left of the blue WIKIPEDIA STORE and to the right of the [0 items] shopping cart in the top navigation bar:

If I make the window slightly narrower, this extra space goes away, I can read the entire search box placeholder text, and the layout looks better:

If it's intentional to add the extra right and left padding to the top navigation bar as the window grows wider, then it's happening too soon.

Event Timeline

Spage raised the priority of this task from to Needs Triage.
Spage updated the task description. (Show Details)
Spage added a subscriber: Spage.
Restricted Application added a subscriber: Aklapper. · View Herald TranscriptApr 21 2015, 11:22 PM
vshchepakina set Security to None.
vshchepakina added a subscriber: violetto.

Search input's width is 300px.
When page area's width < 992px, nav bar will offset down due to no enough room. So it needs to reduce the width of search input on the screen with width < 992px;
However, Search the shop text will be cut off a part. What about reduce the size of text concurrently?

The truncation also occurs when it switches to the hamurger menu layout. Also, at some widths (and on my mobile devices) the "Women" link in the sidebar menu doesn't get positioned correctly:

Also, the search box text (when not truncated) says "search the *shop*". I think it should be "search the store" for the sake of consistent language.

Thanks! @Ragesoss
Will add new layout rule to fix this problem.

HuiZSF added a comment.EditedApr 25 2015, 9:49 PM

The offset problem has been fixed. Thanks :)
Also update the font-size for different nav-bars.

vshchepakina moved this task from Backlog to Next Up on the Shop-Theme board.Jun 3 2015, 5:08 PM
HuiZSF closed this task as Resolved.Jun 3 2015, 5:16 PM