Never mind, I fixed it! For anyone who wants to do the same: Inside the Tree Style Tab / All Configs menu, I had to uncheck "FaviconizePinned Tabs".
Now all my pinned tabs are stacked on top of each other. Not quite what I was going for, but acceptable.
Ended up with a similar issue in SideBerry. The option there is "Show titles of pinned tabs". Turning it on is the fix.
Woah, I didn't even know you could do that. What CSS did you use for this? I use SideBerry and would like to do the same thing.
Found a config on the internet:
:root {
--sidebar-hover-width: 52px;
--sidebar-visible-width: 320px;
}
#TabsToolbar, #sidebar-header {
display: none !important;
}
#sidebar-box {
position: relative !important;
overflow:hidden;
max-width: var(--sidebar-hover-width) !important;
}
#sidebar-box:hover {
transition: all 200ms !important;
max-width: var(--sidebar-visible-width) !important;
}
Here's the one I used:
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/autohide_sidebar.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */
/* Show sidebar only when the cursor is over it */
/* The border controlling sidebar width will be removed so you'll need to modify these values to change width */
#sidebar-box {
--uc-sidebar-width: 60px;
--uc-sidebar-hover-width: 210px;
--uc-autohide-sidebar-delay: 100ms; /* Wait 0.6s before hiding sidebar */
position: relative;
min-width: var(--uc-sidebar-width) !important;
width: var(--uc-sidebar-width) !important;
max-width: var(--uc-sidebar-width) !important;
z-index: 1;
background-color: #110a0d !important;
}
#sidebar-box[positionend] {
direction: rtl;
}
#sidebar-box[positionend] > * {
direction: ltr;
}
#sidebar-box[positionend]:-moz-locale-dir(rtl) {
direction: ltr;
}
#sidebar-box[positionend]:-moz-locale-dir(rtl) > * {
direction: rtl;
}
#main-window[sizemode="fullscreen"] #sidebar-box {
--uc-sidebar-width: 1px;
}
#sidebar-splitter {
display: none;
}
#sidebar-header {
overflow: hidden;
/* color: var(--chrome-color, inherit) !important; */
padding-inline: 0 !important;
}
#sidebar-header::before,
#sidebar-header::after {
content: "";
display: flex;
padding-left: 8px;
}
#sidebar-header,
#sidebar {
transition: min-width 115ms linear var(--uc-autohide-sidebar-delay) !important;
min-width: var(--uc-sidebar-width) !important;
will-change: min-width;
}
#sidebar-box:hover > #sidebar-header,
#sidebar-box:hover > #sidebar {
min-width: var(--uc-sidebar-hover-width) !important;
transition-delay: 0ms !important;
}
.sidebar-panel {
/* background-color: transparent !important; */
/* color: var(--newtab-text-primary-color) !important; */
}
.sidebar-panel #search-box {
-moz-appearance: none !important;
/* background-color: rgba(249, 249, 250, 0.1) !important; */
color: inherit !important;
}
/* Add sidebar divider and give it background */
#sidebar,
#sidebar-header {
background-color: inherit !important;
border-inline: 1px solid rgb(80, 80, 80);
border-inline-width: 0px 1px;
}
#sidebar-box:not([positionend]) > :-moz-locale-dir(rtl),
#sidebar-box[positionend] > * {
border-inline-width: 1px 0px;
}
/* Move statuspanel to the other side when sidebar is hovered so it doesn't get covered by sidebar */
#sidebar-box:not([positionend]):hover ~ #appcontent #statuspanel {
inset-inline: auto 0px !important;
}
#sidebar-box:not([positionend]):hover ~ #appcontent #statuspanel-label {
margin-inline: 0px !important;
border-left-style: solid !important;
}`___`
A place to discuss the news and latest developments on the open-source browser Firefox