Sorry for the 'tumblr-spection' preview 🙃 I wasn't very inspired 😅
The latest tumblr UI update was… a choice. Not bad per say, but too centered around mobile users with the buttons being so spaced out. So I did a bit of CSS 'magic' and fixed it.
While I was at it, I made a properly commented code snippet so you can pick and choose what you want, and remove want you don't. There's a choice to be made at lines 57-80, you either keep Option 1 OR Option 2. I repeat: either one, or the other, not both.
https://pastecode.io/s/6y5f354q
Other 'features' include:
hiding of either the Share button, the Blaze button, or both;
re-ordering of the buttons;
optional separator between tags and buttons (commented out by default, please see lines 22-27;
optional (but enabled by default) inner margin for posts when under 540px wide screens (see line 90).
How to use?
This code is meant to be copy-pasted (once you've removed what you don't want to keep) into a browser extension that can load custom scripts for any given page (such as www.tumblr.com). There are multiple of them, with varying degrees of complexity, and for different browsers. The choice is up to you.
Me personally, I'm using Custom Style Script, which despite the name can also load custom JS code, but my snippet above is CSS (style), so you need an extension that can load custom CSS.
A bit more info
Should work on all tumblr pages where the buttons appear (just make sure you configure your extension properly so it applies to all of them). As well as work correctly on all browsers.
Once your browser's window goes under 400px, it switches back to the default layout, because now it makes total sense to have the buttons spaced out like that. However, it will still keep the other extra features (reorder, hidden buttons, separator, etc).
And in case you were wondering, this is what the buttons section looks like on posts that you own:
Hope this helps fellow tumblr users out there 🙂
