It really makes more sense (because pretty much every other tabbed UI is like this, not just vertical ones) to have the close button on the right side of the tab, and the pin button on the left.
I tried wrangling the CSS to no avail. GPT-4o was no help. My edits made the close icons clumsily stick to the text's right side, meanwhile the pin icons are immovable for whatever reason.
I almost thought I'd solved it perfectly by using absolute left/right repositioning of the icons, but being absolute means that the icons remain static once you scroll down.
It really makes more sense (because pretty much every other tabbed UI is like this, not just vertical ones) to have the close button on the right side of the tab, and the pin button on the left.
I tried wrangling the CSS to no avail. GPT-4o was no help. My edits made the close icons clumsily stick to the text's right side, meanwhile the pin icons are immovable for whatever reason.
I almost thought I'd solved it perfectly by using
absoluteleft/right repositioning of the icons, but beingabsolutemeans that the icons remain static once you scroll down.