At the moment our breadcrumb nav dropdowns are styled as buttons… when we have category + subcategoy + tags our top bar can start feeling pretty heavy and gray (especially on mobile).
This is also a bit inconsistent of how we treat category dropdowns in the composer (and elsewhere). It’s a special case, but are we gaining anything from using the different style? Should we remove the background color to lighten things up and simplify?
There’s also the benefit of avoiding situations where a category color works OK on the main background color… but is kind of broken in the button.
Perhaps I just need to get used to it, but the New Topic (and edit and notification state if applicable) are still grey. We now have 3 styles, white box with black outline, red box with no outline, and grey box with no outline. Something just seems off.
I made a comment on GitHub about this, but it’s probably better to post it here. There is a cutoff issue that is still present on Safari and Chrome. You can see an example here with the letter “g” in the select-kit boxes for category and subcategory:
Moving the padding from the first selector mentioned above to the second will break the tags dropdown, but adding it to .category-name seems to be fine.
If you want I can make a PR, but just wanted to make sure this doesn’t break any conventions that are in place.
Text should no longer be cut off, I went a bit more extreme than your suggestions and ended up removing the line-height: 1 from those category dropdowns and removed padding to compensate for the increased line-height. line-height: 1 combined with overflow: hidden is just a recipe for eventual problems.
Ah right, I did the category dropdowns but not the mobile nav for latest/new/top — just updated it.
On the fence about some other dropdowns in the topic list nav… they’re technically dropdowns, but always immediately associated with other buttons. Going to hold off on those for now and revisit.
this:
