Custom CSS to move tab close button to left and hide favicon on hover (like Vivaldi OSX)

[tze]

As OSX user I'm used to having the close button on the left side of a tab. This works fine via

.tab-close {
    right: unset;
    left: 5px;
}

However this only moves the tab close button to the left while still displaying the favicon. This looks allright but it would be nice to hide the favicon on hover. I can't manage to do that.

[dos1]

It's very easy:

.tab:hover:not(.pinned) .tab-icon-wrapper {
  opacity: 0;
}

I have the compact mode forced though, so if you use the thumbnails, you might have to adjust it a bit.

With such setup, you might also want to adjust the gradient on the right:

.tab:hover > .tab-title-wrapper::after {
  transform: translateX(36px);
}

[tze]

Works like a charm. Exactly what I had in mind, thanks @dos1 . Is this worth a pull request for the wiki? I guess it would be appreciated by OSX users.

[eoger]

Feel free to! Closing :)