Text-only buttons in toolbar have uneven padding

[karmatosed]

When you turn on the option for text-only options the following issue arises with padding:

Here is a suggestion of how a little tidy could be done, I will also work on a PR for this. The focus here is on tidying up some inconsistencies. This version takes it a little wider and far to 4px spacing, however I would like to explore how little space can be taken up, but still consistent.

Feedback

As with anything, I would welcome input on this. I consider it a bug as this I think was previously not an issue.

[mapk]

In the original PR, #24304, @tellthemachines went through several iterations to make sure the spacing and padding of each button was correct. Something must have caused a hiccup here.

If we can get back to that solution again, I think we'd be golden. :)

[tellthemachines]

Looking back at the history of that PR, I think this comment might have been overlooked, as there are no commits after it. The issue has probably been there since that PR was merged.

Happy to help with this, and get it into 5.6. Something like

.edit-post-header-toolbar__left > *+* {
    margin-left: 4px;
}

should fix it; and maybe reducing the margins on some of the right hand side buttons, as per @mapk 's original comment?

Are you working on a PR for this @karmatosed ? Let me know if you need anything!

[karmatosed]

@tellthemachines and @mapk thank you both so much for the context. I have worked on a speedy PR so hopefully that at least gets what was missing in.