Content-Length: 116649 | pFad | https://gist.github.com/MrOtherGuy/e9e0745410aa5e3ef578e1c2ee2617d2

A1 collapse_vertical_tabs_w_individual_reveal.css · GitHub
Skip to content

Instantly share code, notes, and snippets.

@MrOtherGuy
Created January 1, 2025 13:20
Show Gist options
  • Save MrOtherGuy/e9e0745410aa5e3ef578e1c2ee2617d2 to your computer and use it in GitHub Desktop.
Save MrOtherGuy/e9e0745410aa5e3ef578e1c2ee2617d2 to your computer and use it in GitHub Desktop.
#sidebar-main:has(>[expanded]){
--uc-vertical-tabs-width: 40px;
contain: inline-size;
width: var(--uc-vertical-tabs-width);
justify-content: flex-end;
overflow-x: visible !important;
will-change: unset !important;
pointer-events: none;
}
#sidebar-main > [expanded]{
width: calc(var(--uc-tab-transform-length) + var(--uc-vertical-tabs-width));
position: relative;
z-index: 2;
--uc-tab-transform-length: 200px;
--tab-inner-inline-margin: 4px
}
spacer:is([part="overflow-start-indicator"],[part="overflow-end-indicator"]){
width: var(--uc-vertical-tabs-width,auto);
align-self: end;
}
.wrapper > .tools-and-extensions[orientation="horizontal"],
sidebar-main[expanded] :is(#vertical-pinned-tabs-container,#vertical-tabs-newtab-button,#tabs-newtab-button){
transform: translateX(calc(var(--uc-tab-transform-length) - 4px));
transition: transform 87ms ease;
pointer-events: auto;
&:hover{
transform: translateX(0);
}
}
sidebar-main[expanded] #tabbrowser-arrowscrollbox[orient="vertical"] :is(.tab-group-label-container,.tabbrowser-tab){
margin-left: var(--uc-tab-transform-length) !important;
transition: min-width 100ms ease-out, max-width 100ms ease-out, margin-left 87ms ease-out !important;
pointer-events: auto;
&:hover{
margin-left: 0 !important;
}
}
.tools-and-extensions[orientation="horizontal"]{
justify-content: flex-start !important;
}
#sidebar-main[positionend] > [expanded] .tab-close-button{
display: none;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment








ApplySandwichStrip

pFad - (p)hone/(F)rame/(a)nonymizer/(d)eclutterfier!      Saves Data!


--- a PPN by Garber Painting Akron. With Image Size Reduction included!

Fetched URL: https://gist.github.com/MrOtherGuy/e9e0745410aa5e3ef578e1c2ee2617d2

Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy