161 lines
4 KiB
CSS
161 lines
4 KiB
CSS
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
|
|
|
|
/* Hide main tabs toolbar */
|
|
#TabsToolbar {
|
|
visibility: collapse !important;
|
|
}
|
|
|
|
/*** NAV BAR ***/
|
|
/* Hide urlbar */
|
|
#nav-bar {
|
|
/* customize this value. */
|
|
--navbar-margin: -55px;
|
|
|
|
margin-top: var(--navbar-margin);
|
|
margin-bottom: 0;
|
|
z-index: -100;
|
|
transition: all 0.3s ease !important;
|
|
opacity: 0;
|
|
}
|
|
|
|
#navigator-toolbox:focus-within > #nav-bar,
|
|
#navigator-toolbox:hover > #nav-bar
|
|
{
|
|
margin-top: 0;
|
|
margin-bottom: var(--navbar-margin);
|
|
z-index: 100;
|
|
opacity: 1;
|
|
}
|
|
|
|
#main-window[chromehidden*="toolbar"] {
|
|
visibility: collapse;
|
|
height: -55px !important;
|
|
min-height: -55px !important;
|
|
}
|
|
|
|
/* But unfocus it when we invoke it with ctrl+L */
|
|
#nav-bar:focus-within {
|
|
height: auto !important;
|
|
margin-bottom: 0px !important;
|
|
opacity: 1 !important;
|
|
overflow: show !important;
|
|
}
|
|
|
|
#urlbar-container {
|
|
min-height: 0 !important;
|
|
}
|
|
|
|
#urlbar {
|
|
top: 0 !important;
|
|
}
|
|
|
|
#urlbar-input-container {
|
|
height: 28px !important;
|
|
}
|
|
|
|
/* hides the sidebar header */
|
|
#sidebar-header {
|
|
display: none !important;
|
|
}
|
|
|
|
.tab[selected="true"] {
|
|
visibility: collapse;
|
|
}
|
|
|
|
.tabbrowser-tab {
|
|
visibility: collapse;
|
|
}
|
|
|
|
.tabbrowser-tab[visuallyselected="true"] {
|
|
visibility: collapse;
|
|
}
|
|
/* 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: 40px;
|
|
--uc-sidebar-hover-width: 210px;
|
|
--uc-autohide-sidebar-delay: 600ms; /* Wait 0.6s before hiding sidebar */
|
|
--uc-autohide-transition-duration: 115ms;
|
|
--uc-autohide-transition-type: linear;
|
|
--browser-area-z-index-sidebar: 3;
|
|
position: relative;
|
|
min-width: var(--uc-sidebar-width) !important;
|
|
width: var(--uc-sidebar-width) !important;
|
|
max-width: var(--uc-sidebar-width) !important;
|
|
z-index: var(--browser-area-z-index-sidebar,3);
|
|
}
|
|
#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 var(--uc-autohide-transition-duration) var(--uc-autohide-transition-type) 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;
|
|
}
|
|
|