mobile-config-firefox/chrome/overlay_sidebar_header.css
2023-01-03 16:30:29 +02:00

37 lines
No EOL
1.2 KiB
CSS

/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/overlay_sidebar_header.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */
/* This is a hack that only "kinda" works! */
/* Changes sidebar header to appear as small "notch" at the top of the sidebar. Hovering it will show full sidebar so you can have access to sidebar switcher button. The caveat is that you need to click the switcher button TWICE - otherwise the header and switcher popup will hide themselver as soon as cursor is moved on top of the switcher popup. */
#sidebar-header{
display: flex;
position: absolute;
width: inherit;
visibility: hidden;
background-color: inherit;
-moz-user-focus: normal;
}
#sidebar-header::before{
visibility: visible;
content: "";
border-bottom-left-radius: 8px;
border-bottom-right-radius: 8px;
background-color: inherit;
border: 1px solid var(--chrome-content-separator-color);
border-top: none;
height: 8px;
width: 14px;
margin-top: -9px;
margin-inline-start: -4px;
}
#sidebar-switcher-target.active{
pointer-events: none;
}
#sidebar-header:focus-within,
#sidebar-header:hover{
visibility: visible;
}
#sidebar-spacer{
flex-grow: 1;
}