v12021.12.22 :: Made it easier to change colors in userChrome.css

This commit is contained in:
t. Macleod Sawyer 2021-12-22 12:54:43 -06:00 committed by GitHub
parent 1233ef3412
commit 22f2ca711b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -1,10 +1,23 @@
/*
/*
Title: Drannex42's Personal userChrome.css for Firefox
Description: This is my personal userChrome for Firefox, I specifically clean up the interface, change the folder icon to Vivaldi's (much better) and reduce padding in some areas, and add some in others. This overall creates a much more streamlined interface.
Features: Streamlines interface, folder icon replacement, works best with my custom Tree Style Tabs interface (check it out! treestyletabs.css in the /firefox/ directory), removes tab bar.
Version: 12021.09.07 :: Fixed sidebar margin at top. Make sure you update Sideberry to include proper alignment.
Version: 12021.12.14 :: Fixed sidebar header position and background color.
*/
:root {
--sidebar-width: 50px;
--toolbar-height: -50px;
--menubar-height: -71px;
--toolmenubar-height: -80px;
--sidebar-padding: calc(var(--sidebar-width) + 5px);
--toolbar-start-end-padding: 5px !important;
--toolbar-start-end-padding: 5px !important;
--sidebar-bg-color: #fafafa; /* Change this if you have a different theme than the default light one to match the rest of your sideberry theme colors */
}
#main-window[tabsintitlebar="true"]:not([extradragspace="true"]) #TabsToolbar > .toolbar-items {
opacity: 0;
pointer-events: none;
@ -18,17 +31,16 @@
}
/*Collapse in default state and add transition*/
#sidebar-box #sidebar:hover {
#sidebar-box #sidebar:hover {
/*! overflow: visible !important; */
min-width: 40px;
max-width: 40px;
border-right: 1px solid var(--panel-separator-color);
z-index: 2;
--sidebar-background-color: #fafafa !important;
}
/*All other sidebar-boxes should be larger on hover*/
#sidebar-box:hover {
#sidebar-box:hover {
min-width: 350px !important;
max-width: 350px !important;
z-index: 1;
@ -48,7 +60,7 @@
#sidebar-header {
border: none !important;
background: var(--sidebar-background-color) !important;
background: var(--sidebar-bg-color) !important;
}
#sidebar-close, #sidebar-title, #sidebar-switcher-arrow {
@ -59,6 +71,8 @@
#sidebar-switcher-target {
border: none !important;
margin-left: 4.5px !important;
padding-top: 4px !important;
padding-bottom: 3px !important;
}
#sidebar-switcher-target:focus-visible:not(:hover, [open]), #sidebar-close:focus-visible:not(:hover, [open]) {
@ -66,17 +80,6 @@
}
:root {
--sidebar-width: 50px;
--toolbar-height: -50px;
--menubar-height: -68px;
--toolmenubar-height: -80px;
--sidebar-padding: calc(var(--sidebar-width) + 5px);
--toolbar-start-end-padding: 5px !important;
--toolbar-start-end-padding: 5px !important;
}
#main-window #PersonalToolbar {
margin-left: var(--sidebar-width);
padding: 2px 5px !important;