Skip to content

Instantly share code, notes, and snippets.

@delfick
Created September 10, 2022 23:40
Show Gist options
  • Save delfick/ca304c4c193aae851e022531bb527e3d to your computer and use it in GitHub Desktop.
Save delfick/ca304c4c193aae851e022531bb527e3d to your computer and use it in GitHub Desktop.
/*Hide Add Bookmark Button*/
#main
> div.mainbar
> div
> div.UrlBar-AddressField.button-textonly.below
> div.toolbar.toolbar-small.toolbar-insideinput
> div.BookmarkButton {
display: none;
}
#browser:not(:has(.toolbar-editor)) > footer > .toolbar-statusbar {
top: 23px;
left: 0;
right: 0;
margin: -23px auto 0;
width: fit-content;
border-radius: var(--radius);
border: none;
background-color: var(--colorBg);
box-shadow: 0 0 0 1px var(--colorBorder), 0 2px 6px hsl(0deg 0% 0% / 25%);
transition: top 0.25s ease-out 0.5s !important;
}
#browser:not(:has(.toolbar-editor))
> footer
> .toolbar-statusbar:is(:hover, :focus-within, :has(.button-pressed)) {
top: -3.5px;
transition: top 0.13s ease-out 0.1s !important;
}
#browser > footer > .toolbar-statusbar::before {
content: "";
position: absolute;
left: 0;
right: 0;
bottom: 100%;
height: 12px;
z-index: -1;
}
#browser:not(:has(.toolbar-editor)) > footer > .toolbar-statusbar .StatusInfo {
position: fixed;
left: 2px;
bottom: 2px;
min-height: 20px;
padding: 1px 3px;
background: var(--colorBgDark);
border-radius: var(--radiusHalf);
pointer-events: none;
}
/* tabbar on bottom of statusbar */
#browser.tabs-bottom:not(:has(.toolbar-editor)) > footer {
overflow: visible;
verflow: visible;
display: flex;
flex-flow: column;
}
#browser.tabs-bottom:not(:has(.toolbar-editor)) > footer > .toolbar-statusbar {
clip-path: inset(-100vmax -100vmax 100% -100vmax);
transition: top 0.25s ease-out 0.5s, clip-path 0.2s linear 0.4s !important;
}
#browser.tabs-bottom:not(:has(.toolbar-editor))
> footer
> .toolbar-statusbar:is(:hover, :focus-within, :has(.button-pressed)) {
clip-path: inset(-100vmax);
transition: top 0.13s ease-out 0.1s, clip-path 0.13s linear 0.1s !important;
}
#browser.tabs-bottom:not(:has(.toolbar-editor))
> footer
> .toolbar-statusbar
.StatusInfo {
bottom: unset;
margin-bottom: -4px;
}
#browser.tabs-bottom:not(:has(.toolbar-editor))
> footer
> .toolbar-statusbar:not(:hover):not(:focus-within):not(:has(.button-pressed))
.StatusInfo {
margin-bottom: 49px;
transition: margin-bottom 0s 1s !important;
}
/* optional: fix for minimalist find bar mod */
#browser:has(.find-in-page-enter) > footer {
position: fixed;
bottom: 0;
width: 100%;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment