"Add new" button bug

[daniluk4000]

I noticed a bug when using the new Theme Switcher in the Customizer. For large texts, such as the Russians, the button moves to the next line and looks disgusting.

[daniluk4000]

Bug

[daniluk4000]

Bug Fix Concept

[celloexpressions]

white-space: nowrap; should fix it. Related: #31289 changed the button style and position, but probably doesn't fix this.

[bilalcoder]

patch which makes enough space for 'Add New' button

[DrewAPicture]

Hi @bilacoder, thanks for the patch!

In 31721.diff​, we should probably more-closely target the elements for that specific Customizer control, as things like .wrap h2 are used in many other places in the admin, not just the Customizer. The same goes for floating #customize-controls a, as that affects links in basically any Customizer control.

Targeting .customize-themes-panel as the top-level element might be a better starting place.

[celloexpressions]

Actually, this definitely needs to wait for #31289 or be combined in there. The selector is definitely changing, and with .button this may not even be an issue, haven't tried it.

[ocean90]

Btw: This can be an issue with all add-new buttons, see 31721.png​

[daniluk4000]

Confirmed

[daniluk4000]

And what about this concept?

[samuelsidler]

If this is really an issue (or potential issue) with all add-new buttons, I don't think it blocks 4.2.

Can we get UI feedback here on what should be done?

[SergeyBiryukov]

Replying to samuelsidler:

If this is really an issue (or potential issue) with all add-new buttons, I don't think it blocks 4.2.

It became much more prominent with the new theme switcher in Customizer, which squeezes the heading into a narrow column. We don't do that in the rest of the admin.

.wrap .add-new-h2 { white-space: nowrap } appears to resolve this: 31721.2.after.png​.

[DrewAPicture]

Replying to SergeyBiryukov:

.wrap .add-new-h2 { white-space: nowrap } appears to resolve this: 31721.2.after.png​.

As I mentioned above, going general on the selector might have other negative effects elsewhere in the admin. See any other issues in changing that to nowrap?

[SergeyBiryukov]

Replying to DrewAPicture:

As I mentioned above, going general on the selector might have other negative effects elsewhere in the admin.

But the point is to fix this for all the "Add New" headings, per comment:4.

See any other issues in changing that to nowrap?

Nope.

[MechaCoder]

Replying to SergeyBiryukov:

Replying to DrewAPicture:

As I mentioned above, going general on the selector might have other negative effects elsewhere in the admin.

But the point is to fix this for all the "Add New" headings, per comment:4.

See any other issues in changing that to nowrap?

Nope.

Sorry; when i tested it the nowrap not all the link can be seen pm very large string values the a tag rendered beyond screen edge

[SergeyBiryukov]

Replying to MechaCoder:

Sorry; when i tested it the nowrap not all the link can be seen pm very large string values the a tag rendered beyond screen edge

Could you share a screenshot?

[helen]

Punting this from 4.2 as it's a long-existing thing on admin screens, for the theme switcher in the customizer both @ocean90 and I would rather just remove it completely: #31837.

[MechaCoder]

sorry for the late response but still trying to work things out :-(

​https://docs.google.com/presentation/d/1813ndQCs8H3kKxcu7cJCEOc1HUeHpjfOMhvzDESv5C4/edit?usp=sharing

@helen - also on the page and post listing page, it a button i uses often to copy client built content?

also my noticing may have pushed the sting to far, but i was thinking of poeple with blackberrys and very small phones. i hope i haven't offended anyone ^_, also if some could tell me where the code is being rendered the function's file than i think i have a fix which will make it elegant, still new to core

[SergeyBiryukov]

Replying to MechaCoder:

​https://docs.google.com/presentation/d/1813ndQCs8H3kKxcu7cJCEOc1HUeHpjfOMhvzDESv5C4/edit?usp=sharing

No apologies necessary, thanks for the screenshot.

I don't think "Add New" would be that long in any translation :) But yeah, a more elegant solution would be nice.

To find the code, I'd suggest searching for 'Add New' in core files, there's a separate string for each screen.

[MechaCoder]

@SergeyBiryukov no my way is not working sorry i will continue working on it but i think your fix is the most elegant for a moment sorry for holding up the ticket

[afercia]

As far as I see this button was in trunk at some point and then removed in [31968]. Any reason to keep this ticket open?