Last active
November 22, 2023 15:08
-
-
Save BobbyWibowo/29a915c3877e69be6674883bc02e5128 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** Import Lepton stylesheet (Chrome) *****************************************/ | |
@import url("css/leptonChrome.css"); | |
/** Add your custom styles below **********************************************/ | |
/* Enable option to edit bookmark URLs under Add Bookmark (blue star) menu */ | |
/* | |
.editBMPanel_locationRow { | |
display: initial !important; | |
} | |
*/ | |
/* Disable Email Image/Audio/Video and Set as Desktop Background context menu items */ | |
/* | |
#context-sendimage, | |
#context-sendvideo, | |
#context-sendaudio, | |
#context-sep-setbackground, | |
#context-setDesktopBackground { | |
display: none !important; | |
} | |
*/ | |
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/window_control_placeholder_support.css made available under Mozilla Public License v. 2.0 | |
See the above repository for updates as well as full license text. */ | |
/* Creates placeholders for window controls */ | |
/* This is a supporting file used by other stylesheets */ | |
/* This stylesheet is pretty much unnecessary if window titlebar is enabled */ | |
/* This file should preferably be imported before other stylesheets */ | |
/* Defaults for window controls on RIGHT side of the window */ | |
/* Modify these values to match your preferences */ | |
:root:is([tabsintitlebar], [sizemode="fullscreen"]) { | |
/* --uc-window-control-width: 138px; /* Space reserved for window controls (Win10) */ | |
/* Extra space reserved on both sides of the nav-bar to be able to drag the window */ | |
--uc-window-drag-space-pre: 20px; /* left side */ | |
--uc-window-drag-space-post: 20px; /* right side */ | |
} | |
/* Remove extra spaces when maximized/fullscreen */ | |
:root:is([tabsintitlebar][sizemode="maximized"], [sizemode="fullscreen"]) { | |
--uc-window-drag-space-pre: 0px; | |
--uc-window-drag-space-post: 0px; | |
} | |
@media (-moz-platform: windows-win7), | |
(-moz-platform: windows-win8) { | |
:root:is([tabsintitlebar], [sizemode="fullscreen"]) { | |
--uc-window-control-width: 105px; | |
} | |
} | |
@media (-moz-gtk-csd-available) { | |
:root:is([tabsintitlebar],[sizemode="fullscreen"]) { | |
--uc-window-control-width: 84px; | |
} | |
} | |
@media (-moz-platform: macos) { | |
:root:is([tabsintitlebar],[sizemode="fullscreen"]) { | |
--uc-window-control-width: 72px; | |
} | |
} | |
.titlebar-buttonbox, #window-controls { color: var(--toolbar-color) } | |
:root[sizemode="fullscreen"] .titlebar-buttonbox-container { display: none } | |
:root[sizemode="fullscreen"] #navigator-toolbox { position: relative; } | |
:root[sizemode="fullscreen"] #TabsToolbar > .titlebar-buttonbox-container:last-child, | |
:root[sizemode="fullscreen"] #window-controls { | |
position: absolute; | |
display: flex; | |
top: 0; | |
right:0; | |
height: 40px; | |
} | |
:root[sizemode="fullscreen"] #TabsToolbar > .titlebar-buttonbox-container:last-child, | |
:root[uidensity="compact"][sizemode="fullscreen"] #window-controls { height: 32px } | |
#nav-bar { | |
border-inline: var(--uc-window-drag-space-pre,0px) solid transparent; | |
border-inline-style: solid !important; | |
border-right-width: calc(var(--uc-window-control-width,0px) + var(--uc-window-drag-space-post,0px)); | |
background-clip: border-box !important; | |
} | |
/* Rules for window controls on left layout */ | |
@media (-moz-gtk-csd-reversed-placement), | |
(-moz-platform: macos) { | |
:root[tabsintitlebar="true"] #nav-bar { | |
border-inline-width: calc(var(--uc-window-control-width,0px) + var(--uc-window-drag-space-post,0px)) var(--uc-window-drag-space-pre,0px) | |
} | |
:root[sizemode="fullscreen"] #TabsToolbar > .titlebar-buttonbox-container:last-child, | |
:root[sizemode="fullscreen"] #window-controls { right: unset } | |
} | |
/* This pref can be used to force window controls on left even if that is not normal behavior on your OS */ | |
@supports -moz-bool-pref("userchrome.force-window-controls-on-left.enabled") { | |
:root[tabsintitlebar="true"] #nav-bar { | |
border-inline-width: calc(var(--uc-window-control-width,0px) + var(--uc-window-drag-space-post,0px)) var(--uc-window-drag-space-pre,0px) | |
} | |
:root[sizemode="fullscreen"] #TabsToolbar > .titlebar-buttonbox-container:last-child, | |
:root[sizemode="fullscreen"] #window-controls { right: unset; } | |
.titlebar-buttonbox-container { | |
order: -1 !important; | |
} | |
.titlebar-buttonbox { | |
flex-direction: row-reverse; | |
} | |
} | |
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/hide_tabs_toolbar.css made available under Mozilla Public License v. 2.0 | |
See the above repository for updates as well as full license text. */ | |
/* Hides tabs toolbar */ | |
/* For OSX use hide_tabs_toolbar_osx.css instead */ | |
/* Note, if you have either native titlebar or menubar enabled, then you don't really need this style. | |
* In those cases you can just use: #TabsToolbar{ visibility: collapse !important } | |
*/ | |
/* IMPORTANT */ | |
/* | |
Get window_control_placeholder_support.css | |
Window controls will be all wrong without it | |
*/ | |
:root[tabsintitlebar] { --uc-toolbar-height: 40px; } | |
:root[tabsintitlebar][uidensity="compact"] { --uc-toolbar-height: 32px } | |
#TabsToolbar{ visibility: collapse !important } | |
:root[sizemode="fullscreen"] #TabsToolbar > :is(#window-controls,.titlebar-buttonbox-container) { | |
visibility: visible !important; | |
z-index: 2; | |
} | |
:root:not([inFullscreen]) #nav-bar { | |
margin-top: calc(0px - var(--uc-toolbar-height,0px)); | |
} | |
:root[tabsintitlebar] #toolbar-menubar[autohide="true"] { | |
min-height: unset !important; | |
height: var(--uc-toolbar-height,0px) !important; | |
position: relative; | |
} | |
#toolbar-menubar[autohide="false"] { | |
margin-bottom: var(--uc-toolbar-height,0px) | |
} | |
:root[tabsintitlebar] #toolbar-menubar[autohide="true"] #main-menubar { | |
flex-grow: 1; | |
align-items: stretch; | |
background-color: var(--toolbar-bgcolor,--toolbar-non-lwt-bgcolor); | |
background-clip: padding-box; | |
border-right: 30px solid transparent; | |
border-image: linear-gradient(to left, transparent, var(--toolbar-bgcolor,--toolbar-non-lwt-bgcolor) 30px) 20 / 30px | |
} | |
#toolbar-menubar:not([inactive]) { z-index: 2 } | |
#toolbar-menubar[autohide="true"][inactive] > #menubar-items { | |
opacity: 0; | |
pointer-events: none; | |
margin-left: var(--uc-window-drag-space-pre,0px) | |
} | |
/** | |
* Decrease size of the sidebar header | |
*/ | |
#sidebar-header { | |
font-size: 1.2em !important; | |
padding: 2px 6px 2px 3px !important; | |
} | |
#sidebar-header #sidebar-close { | |
padding: 3px !important; | |
} | |
#sidebar-header #sidebar-close .toolbarbutton-icon { | |
width: 14px !important; | |
height: 14px !important; | |
opacity: 0.6 !important; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
https://github.com/black7375/Firefox-UI-Fix with some custom CSS rules to be used together with Sidebery
Most of them were taken from Sidebery's wiki, https://github.com/mbnuqw/sidebery/wiki/Firefox-Styles-Snippets-(via-userChrome.css), with some modifications