forked from CaptaiNiveau/FirefoxSidebar
60e064e67a
* Resolves #33 * Resolves #34
144 lines
3.4 KiB
CSS
144 lines
3.4 KiB
CSS
/*
|
|
Extension (Core): Sidebar
|
|
Description: This is the core implementation of the sidebar used in drannex42's FirefoxSidebar.
|
|
Repository URL: https://github.com/drannex42/FirefoxSidebar
|
|
Version: v12022.11.22 (YYYYY.MM.DD)
|
|
*/
|
|
|
|
#main-window #TabsToolbar {
|
|
visibility: collapse;
|
|
}
|
|
|
|
|
|
|
|
#sidebar-box > #browser,
|
|
#webextpanels-window {
|
|
background: transparent !important;
|
|
|
|
}
|
|
|
|
#sidebar-box[sidebarcommand="treestyletab_piro_sakura_ne_jp-sidebar-action"]
|
|
#sidebar-header {
|
|
/*! display: none; */
|
|
}
|
|
|
|
/*Collapse in default state and add transition*/
|
|
#sidebar-box {
|
|
/*! overflow: visible !important; */
|
|
border-right: none !important; /* border-right: 1px solid var(--sidebar-border-color) !important; */
|
|
z-index: 2;
|
|
border-right: none !important;
|
|
width: 100% !important;
|
|
background: var(--custom-sidebar-bg, --sidebar-background);
|
|
|
|
/* lock sidebar to height by doing the inverse margin of the toolbar element */
|
|
z-index: 1000 !important;
|
|
position: relative !important;
|
|
margin-top: var(--menubar-height) !important;
|
|
border-right: none;
|
|
transition: none !important;
|
|
|
|
/* lock sidebar to specified width */
|
|
min-width: var(--sidebar-width) !important;
|
|
max-width: var(--sidebar-width) !important;
|
|
overflow: hidden !important;
|
|
transition-property: width;
|
|
transition-duration: 0.25s;
|
|
transition-delay: 0.25s;
|
|
transition-timing-function: ease-in;
|
|
}
|
|
|
|
#sidebar-box::after {
|
|
background: var(--sidebar-border-color) !important;
|
|
margin-left: 207px;
|
|
z-index: 9999999;
|
|
position: absolute;
|
|
content: " ";
|
|
width: 1px;
|
|
height: 100%;
|
|
top: 0;
|
|
right: 0px;
|
|
}
|
|
|
|
#sidebar-box:hover:after {
|
|
top: 42px;
|
|
}
|
|
|
|
/*All other sidebar-boxes should be larger on hover*/
|
|
#sidebar-box:hover, #sidebar-box #sidebar:hover {
|
|
min-width: 350px !important;
|
|
max-width: 350px !important;
|
|
z-index: 999;
|
|
margin-right: -300px !important;
|
|
}
|
|
|
|
/*Tree Style Tabs && Sideberry specific sidebar width and size*/
|
|
|
|
#sidebar-box[sidebarcommand="treestyletab_piro_sakura_ne_jp-sidebar-action"]:hover,
|
|
#sidebar-box[sidebarcommand="_3c078156-979c-498b-8990-85f7987dd929_-sidebar-action"]:hover,
|
|
#sidebar-box[sidebarcommand="_3c078156-979c-498b-8990-85f7987dd929_-sidebar-action"] #sidebar:hover {
|
|
min-width: 260px !important;
|
|
max-width: 260px !important;
|
|
margin-right: -210px !important;
|
|
}
|
|
|
|
#sidebar-header {
|
|
border: none !important;
|
|
border-right: 1px solid var(--sidebar-border-color);
|
|
background: var(--custom-sidebar-header-bg, transparent) !important;
|
|
}
|
|
|
|
#sidebar-close,
|
|
#sidebar-title,
|
|
#sidebar-switcher-arrow {
|
|
display: none;
|
|
border: none;
|
|
}
|
|
|
|
#sidebar-switcher-target {
|
|
border: none !important;
|
|
margin-left: 4.5px !important;
|
|
padding-top: 4px !important;
|
|
padding-bottom: 6px !important;
|
|
}
|
|
|
|
#sidebar-switcher-target:focus-visible:not(:hover, [open]),
|
|
#sidebar-close:focus-visible:not(:hover, [open]) {
|
|
outline: none !important;
|
|
}
|
|
|
|
|
|
|
|
.sidebar-splitter {
|
|
opacity: 0 !important;
|
|
width: 0px !important;
|
|
border: none !important;
|
|
--avatar-image-url: none !important;
|
|
}
|
|
|
|
#sidebarMenu-popup .subviewbutton {
|
|
min-width: 0px;
|
|
padding: 0;
|
|
margin: 0 !important;
|
|
}
|
|
|
|
toolbarseparator {
|
|
display: none;
|
|
}
|
|
|
|
#nav-bar-customization-target {
|
|
z-index: 99999;
|
|
position: relative;
|
|
}
|
|
|
|
.browser-toolbar {
|
|
padding-left: var(--sidebar-width) !important;
|
|
position: relative !important;
|
|
}
|
|
|
|
#PersonalToolbar {
|
|
padding: 2px 5px !important;
|
|
padding-top: 0px !important;
|
|
margin-top: 0px !important;
|
|
padding-left: calc(var(--sidebar-width) + 6px) !important;
|
|
}
|