120 lines
3.7 KiB
CSS
120 lines
3.7 KiB
CSS
|
|
/* material firefox imports */
|
|
/* @import "../global/variables.css"; */
|
|
/* @import "../global/global.css"; */
|
|
/* @import "../icons/icons.css"; */
|
|
/* @import "../tabbar/tabbar.css"; */
|
|
/* @import "../navbar/navbar.css"; */
|
|
/* @import "../personalbar/personalbar.css"; */
|
|
/* @import "../popup/popup.css"; */
|
|
/* @import "../urlbar/urlbar.css"; */
|
|
/* @import "../findbar/findbar.css"; */
|
|
|
|
/* 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: 30px; */
|
|
/* --uc-sidebar-hover-width: 210px; */
|
|
/* position: relative; */
|
|
/* min-width: var(--uc-sidebar-width) !important; */
|
|
/* width: var(--uc-sidebar-width) !important; */
|
|
/* max-width: var(--uc-sidebar-width) !important; */
|
|
/* } */
|
|
|
|
/* #sidebar-splitter{ display: none } */
|
|
|
|
/* #sidebar-header{ overflow: hidden; color: var(--chrome-color, inherit) !important} */
|
|
|
|
/* #sidebar{ */
|
|
/* transition: min-width 115ms linear !important; */
|
|
/* min-width: var(--uc-sidebar-width) !important; */
|
|
/* will-change: min-width; */
|
|
/* } */
|
|
|
|
/* #sidebar-box:hover > #sidebar{ min-width: var(--uc-sidebar-hover-width) !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: var(--toolbar-non-lwt-bgcolor) !important; */
|
|
/* border-right: 1px solid rgb(80,80,80); */
|
|
/* } */
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* Made for the treestyletab stuff */
|
|
|
|
:root {
|
|
--initial-width : 50px; /* initial width of the sidebar */
|
|
--sidebar-width : 250px; /* expanded width of the sidebar */
|
|
--toolbar-height : 0;
|
|
--menubar-height : -40px;
|
|
--toolmenubar-height: -40px; /* sum of previous two */
|
|
--shadow-color : #28282F; /* shadow color. set to #00000000 for no shadow. same as folder color from hntp and tab-hover color from tst*/
|
|
}
|
|
|
|
/*
|
|
There's two main sidebar components.
|
|
1. #sidebar-box (outer)
|
|
2. #sidebar (inner)
|
|
*/
|
|
/* lock outer to height by doing the inverse margin of the toolbar element */
|
|
/* set outer width = initial width */
|
|
#sidebar-box {
|
|
z-index : 1000 !important;
|
|
position : relative!important;
|
|
//margin-top : var(--menubar-height) !important;
|
|
padding-top : calc(-1*var(--menubar-height));
|
|
border-radius: 0 5px 0px 0;
|
|
min-width : var(--initial-width) !important;
|
|
max-width : var(--initial-width) !important;
|
|
}
|
|
|
|
/* inner width = expanded width & move inner to only show initial-width long section */
|
|
#sidebar-box #sidebar {
|
|
min-width : var(--sidebar-width) !important;
|
|
max-width : var(--sidebar-width) !important;
|
|
transform : translateX(calc(var(--initial-width) - var(--sidebar-width))) !important;
|
|
border-radius: 0 3px 0px 0;
|
|
transition : all 0.2s ease-in-out;
|
|
}
|
|
|
|
/* move inner to show entire sidebar */
|
|
#sidebar-box #sidebar:hover {
|
|
transform : translateX(0) !important;
|
|
box-shadow: 2px 0 33px var(--shadow-color);
|
|
}
|
|
|
|
#main-window[title^="Firefox"] #sidebar-box {
|
|
margin-top: var(--toolmenubar-height) !important;
|
|
}
|
|
|
|
/* hide sidebar header for tree style tabs sidebar */
|
|
#sidebar-box[sidebarcommand="treestyletab_piro_sakura_ne_jp-sidebar-action"] #sidebar-header {
|
|
display: none;
|
|
}
|
|
|
|
|
|
/* Hide splitter, when using Tree Style Tab. */
|
|
#sidebar-box[sidebarcommand="treestyletab_piro_sakura_ne_jp-sidebar-action"] + #sidebar-splitter {
|
|
display: none !important;
|
|
}
|