mirror of
https://github.com/elkowar/dots-of-war.git
synced 2024-12-25 21:52:23 +00:00
94 lines
2.9 KiB
CSS
94 lines
2.9 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";
|
||
|
|
||
|
:root {
|
||
|
--initial-width : 70px; /* initial width of the sidebar */
|
||
|
--sidebar-width : 250px; /* expanded width of the sidebar */
|
||
|
--toolbar-height : 0;
|
||
|
--menubar-height : 0;
|
||
|
--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*/
|
||
|
}
|
||
|
|
||
|
/* show bookmarks toolbar on new tab only */
|
||
|
#main-window #PersonalToolbar {
|
||
|
visibility : collapse !important;
|
||
|
z-index : 1!important;
|
||
|
position : relative!important;
|
||
|
margin-left: var(--initial-width); /* shift toolbar to the right based on initial width */
|
||
|
margin-top : var(--toolbar-height) !important;
|
||
|
}
|
||
|
|
||
|
#main-window[title^="Firefox Developer Edition"] #PersonalToolbar {
|
||
|
visibility: visible !important;
|
||
|
margin-top: -1px !important;
|
||
|
}
|
||
|
|
||
|
/*
|
||
|
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 Developer Edition"] #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 the title bar */
|
||
|
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
|
||
|
|
||
|
/* to hide the native tabs */
|
||
|
#TabsToolbar {
|
||
|
visibility: collapse;
|
||
|
}
|
||
|
|
||
|
/* to hide the sidebar header */
|
||
|
#sidebar-header {
|
||
|
visibility: collapse;
|
||
|
}
|
||
|
/* Hide splitter, when using Tree Style Tab. */
|
||
|
#sidebar-box[sidebarcommand="treestyletab_piro_sakura_ne_jp-sidebar-action"] + #sidebar-splitter {
|
||
|
display: none !important;
|
||
|
}
|
||
|
|
||
|
|