Lillian-Violet/NixOS-Config
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

Fix sidebar in firefox

Browse source
This commit is contained in:
Lillian Violet 2024-08-29 11:46:26 +02:00
parent 8d291e2488
commit d1fc8d1b86
1 changed files with 199 additions and 199 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

398
home-manager/desktop/package-configs/firefox.nix
View file

@ -29,342 +29,342 @@
"browser.newtabpage.activity-stream.improvesearch.topSiteSearchShortcuts.searchEngines" = "DuckDuckGo"; "browser.newtabpage.activity-stream.improvesearch.topSiteSearchShortcuts.searchEngines" = "DuckDuckGo";
}; };
userChrome = '' userChrome = ''
/*
Title: Drannex42's FirefoxSidebar / Vertical Tabs
Description: Vertical tab design for Firefox with dynamic indentation::
Sideberry and TreeStyleTabs (Legacy) themes available!
Repository URL: https://github.com/drannex42/FirefoxSidebar
Version: 12022.04.17
*/
/* /*
Preferences / Settings :: Title: Drannex42's FirefoxSidebar / Vertical Tabs
Use this file to set your preferences this will save them in one place for easier future updating Description: Vertical tab design for Firefox with dynamic indentation::
========================================================================= Sideberry and TreeStyleTabs (Legacy) themes available!
*/ Repository URL: https://github.com/drannex42/FirefoxSidebar
Version: 12022.04.17
/*
Preferences / Settings
Use this file to set your preferences this will save them in one place for easier future updating
=========================================================================
*/ */
:root { :root {
--sidebar-width: 50px; --sidebar-width: 50px;
--toolbar-height: -12px; --toolbar-height: 10px;
--menubar-height: -42px; --menubar-height: 100px;
--sidebar-padding: calc(var(--sidebar-width) + 5px); --sidebar-padding: calc(var(--sidebar-width) + 5px);
--toolbar-start-end-padding: 5px !important; --toolbar-start-end-padding: 5px !important;
/* Custom Sidebar/Header Backround :: /* Custom Sidebar/Header Backround ::
This sets the background for the other sidebar options (bookmarks, history, in case it is transparent from a theme that is not set up properly This sets the background for the other sidebar options (bookmarks, history, in case it is transparent from a theme that is not set up properly
*/ */
/* --custom-sidebar-bg: Field; /* Default: Field (Disabled) */ /* --custom-sidebar-bg: Field; /* Default: Field (Disabled) */
--custom-sidebar-header-bg: #000; /* Default: Field (Disabled) */ /* --custom-sidebar-header-bg: #000; */
/* ====== Extension Settings ====== */ /* ====== Extension Settings ====== */
/* Window Control / Client Side Display Settings === /* Window Control / Client Side Display Settings ===
If you are putting this on the left or right side uncomment the side If you are putting this on the left or right side uncomment the side
preferences below and comment the other preferences below and comment the other
========================================================================= =========================================================================
*/ */
--csd-width: 100px; --csd-width: 100px;
--csd-top: 8px; --csd-top: 8px;
/* /*
CSD - Left Side === CSD - Left Side ===
Default: --csd-left: 50px; --csd-margin-left: 92px; Default: --csd-left: 50px; --csd-margin-left: 92px;
*/ */
/*
--csd-left: 50px;
--csd-margin-left: 92px;
*/
/* /*
CSD - Right Side === --csd-left: 50px;
Defaults: --csd-right: 0px; --csd-margin-right: 95px; --csd-margin-left: 92px;
*/ */
--csd-right: 36px; /*
--csd-margin-right: 130px; CSD - Right Side ===
Defaults: --csd-right: 0px; --csd-margin-right: 95px;
*/
/* === END: Window Control / Client Side Display Settings === */ --csd-right: 36px;
--csd-margin-right: 130px;
/* === END: Extension Settings === */ /* === END: Window Control / Client Side Display Settings === */
/* === END: Extension Settings === */
} }
/* ========================================================================= */ /* ========================================================================= */
/* Sidebar (Core) :: This file is for the sidebar implementation */
/* /*
Extension (Core): Sidebar Extension (Core): Sidebar
Description: This is the core implementation of the sidebar used in drannex42's FirefoxSidebar. Description: This is the core implementation of the sidebar used in drannex42's FirefoxSidebar.
Repository URL: https://github.com/drannex42/FirefoxSidebar Repository URL: https://github.com/drannex42/FirefoxSidebar
Version: v12022.11.22 (YYYYY.MM.DD) Version: v12024.05.15 (YYYYY.MM.DD)
*/ */
#main-window #TabsToolbar { #main-window #TabsToolbar {
visibility: collapse; visibility: collapse;
} }
/* As of v12024.05.15 we updated to using this one by MrOtherGuy, with modifications */
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/autohide_sidebar.css made available under Mozilla Public License v. 2.0 */
/* 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 > #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 { #sidebar-box {
/*! overflow: visible !important; */ --uc-sidebar-width: 50px;
border-right: none !important; /* border-right: 1px solid var(--sidebar-border-color) !important; */ --uc-sidebar-hover-width: 260px;
z-index: 2; --uc-autohide-sidebar-delay: 10ms;
border-right: none !important; /* Wait 0.6s before hiding sidebar */
width: 100% !important; --uc-autohide-transition-duration: 115ms;
background: var(--custom-sidebar-bg, --sidebar-background); --uc-autohide-transition-type: linear;
position: relative;
/* lock sidebar to height by doing the inverse margin of the toolbar element */ min-width: var(--uc-sidebar-width) !important;
z-index: 1000 !important; width: var(--uc-sidebar-width) !important;
position: relative !important; max-width: var(--uc-sidebar-width) !important;
margin-top: var(--menubar-height) !important; z-index: 1;
border-right: none; margin-top: -40px;
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; #sidebar-box[positionend] {
margin-left: 207px; direction: rtl
z-index: 9999999;
position: absolute;
content: " ";
width: 1px;
height: 100%;
top: 0;
right: 0px;
} }
#sidebar-box:hover:after { #sidebar-box[positionend]>* {
top: 42px; direction: ltr
} }
/*All other sidebar-boxes should be larger on hover*/ #sidebar-box[positionend]:-moz-locale-dir(rtl) {
#sidebar-box:hover, #sidebar-box #sidebar:hover { direction: ltr
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[positionend]:-moz-locale-dir(rtl)>* {
direction: rtl
}
#sidebar-box[sidebarcommand="treestyletab_piro_sakura_ne_jp-sidebar-action"]:hover, #main-window[sizemode="fullscreen"] #sidebar-box {
#sidebar-box[sidebarcommand="_3c078156-979c-498b-8990-85f7987dd929_-sidebar-action"]:hover, --uc-sidebar-width: 1px;
#sidebar-box[sidebarcommand="_3c078156-979c-498b-8990-85f7987dd929_-sidebar-action"] #sidebar:hover { }
min-width: 260px !important;
max-width: 260px !important; #sidebar-splitter {
margin-right: -210px !important; display: none
} }
#sidebar-header { #sidebar-header {
border: none !important; overflow: hidden;
border-right: 1px solid var(--sidebar-border-color); color: var(--chrome-color, inherit) !important;
background: var(--custom-sidebar-header-bg, transparent) !important; padding-inline: 0 !important;
background: var(--custom-sidebar-header-bg, inherit) !important;
padding: 8px 12px !important;
padding-top: 9px !important;
border-bottom: none !Important;
} }
#sidebar-close, #sidebar-header::before,
#sidebar-title, #sidebar-header::after {
#sidebar-switcher-arrow { content: "";
display: none; display: flex;
border: none; padding-left: 0px;
} }
#sidebar-switcher-target { #sidebar-header,
border: none !important; #sidebar {
margin-left: 4.5px !important; transition: min-width var(--uc-autohide-transition-duration) var(--uc-autohide-transition-type) var(--uc-autohide-sidebar-delay) !important;
padding-top: 4px !important; min-width: var(--uc-sidebar-width) !important;
padding-bottom: 6px !important; will-change: min-width;
} }
#sidebar-switcher-target:focus-visible:not(:hover, [open]), #sidebar-box:hover>#sidebar-header,
#sidebar-close:focus-visible:not(:hover, [open]) { #sidebar-box:hover>#sidebar {
outline: none !important; min-width: var(--uc-sidebar-hover-width) !important;
width: var(--uc-sidebar-hover-width) !important;
transition-delay: 0ms !important;
}
#sidebar-box>#sidebar-header #sidebar-title {
opacity: 0;
}
#sidebar-box:hover>#sidebar-header #sidebar-title {
opacity: 1;
}
.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: inherit !important;
border-right: 1px solid var(--sidebar-border-color);
border-inline-width: 0px 1px;
}
#sidebar-box:not([positionend])> :-moz-locale-dir(rtl),
#sidebar-box[positionend]>* {
border-inline-width: 1px 0px;
} }
/* Move statuspanel to the other side when sidebar is hovered so it doesn't get covered by sidebar */
.sidebar-splitter { #sidebar-box:not([positionend]):hover~#appcontent #statuspanel {
opacity: 0 !important; inset-inline: auto 0px !important;
width: 0px !important;
border: none !important;
--avatar-image-url: none !important;
} }
#sidebarMenu-popup .subviewbutton { #sidebar-box:not([positionend]):hover~#appcontent #statuspanel-label {
min-width: 0px; margin-inline: 0px !important;
padding: 0; border-left-style: solid !important;
margin: 0 !important;
} }
toolbarseparator {
display: none;
}
#nav-bar-customization-target {
z-index: 99999;
position: relative;
}
.browser-toolbar { .browser-toolbar {
padding-left: var(--sidebar-width) !important; padding-left: var(--sidebar-width) !important;
position: relative !important; position: relative !important;
} }
#PersonalToolbar { #PersonalToolbar {
padding: 2px 5px !important; padding: 2px 5px !important;
padding-top: 0px !important; padding-top: 0px !important;
margin-top: 0px !important; margin-top: 0px !important;
padding-left: calc(var(--sidebar-width) + 6px) !important; padding-left: calc(var(--sidebar-width) + 6px) !important;
} }
/* /*
Extensions :: Extensions ::
To enable/disable specific extensions just comment/uncomment the line below. To enable/disable specific extensions just comment/uncomment the line below.
========================================================================= =========================================================================
*/ */
/* CSD / Window Controls */
/* /*
Extension: Window Controls / Client Side Decorations (CSD) Extension: Window Controls / Client Side Decorations (CSD)
Description: This brings the window controls into the main bar (where the address bar exists). Please see the prefs.css folder for switching the sides from left to right. Description: This brings the window controls into the main bar (where the address bar exists). Please see the prefs.css folder for switching the sides from left to right.
Repository URL: https://github.com/drannex42/FirefoxSidebar Repository URL: https://github.com/drannex42/FirefoxSidebar
Contributors: Mr-nUUb, Xanaxus, Drannex42 Contributors: Mr-nUUb, Xanaxus, Drannex42
Issue URL: https://github.com/drannex42/FirefoxSidebar/issues/14 Issue URL: https://github.com/drannex42/FirefoxSidebar/issues/14
*/ */
/* allow the buttons to appear */ /* allow the buttons to appear */
.browser-toolbar { .browser-toolbar {
position: unset !important; position: unset !important;
} }
/* reserve space for buttons */ /* reserve space for buttons */
#nav-bar { #nav-bar {
padding-right: var(--csd-margin-right) !important; padding-right: var(--csd-margin-right) !important;
margin-left: var(--csd-margin-left) !important; margin-left: var(--csd-margin-left) !important;
} }
/* move buttons next to menu button */ /* move buttons next to menu button */
.titlebar-buttonbox-container { .titlebar-buttonbox-container {
visibility: visible !important; visibility: visible !important;
position: fixed !important; position: fixed !important;
display: block; display: block;
z-index: 999999999; z-index: 999999999;
top: var(--csd-top, inherit); top: var(--csd-top, inherit);
right: var(--csd-right, inherit); right: var(--csd-right, inherit);
left: var(--csd-left, inherit); left: var(--csd-left, inherit);
max-width: var(--csd-width); max-width: var(--csd-width);
} }
/* hide buttons in fullscreen mode (video player and F11) */ /* hide buttons in fullscreen mode (video player and F11) */
#main-window[inFullscreen="true"] .titlebar-buttonbox-container, #main-window[inFullscreen="true"] .titlebar-buttonbox-container,
#main-window[inDOMFullscreen="true"] .titlebar-buttonbox-container { #main-window[inDOMFullscreen="true"] .titlebar-buttonbox-container {
visibility: hidden !important; visibility: hidden !important;
} }
/* remove empty space when in fullscreen mode (F11) */ /* remove empty space when in fullscreen mode (F11) */
#main-window[inFullscreen="true"] #nav-bar { #main-window[inFullscreen="true"] #nav-bar {
padding-right: 0px !important; padding-right: 0px !important;
margin-left: 0px !important; margin-left: 0px !important;
} }
/* END Client Side Decorations / Window Controls */ /* END Client Side Decorations / Window Controls */
/*
Extension: Superbox Removal (and compaction)
Description: This removes the superbox and fixes some padding around the urlbar.
Repository URL: https://github.com/drannex42/FirefoxSidebar
*/
/* --- Prevent enlargement */ /* --- Prevent enlargement */
#urlbar[breakout-extend] { #urlbar[breakout-extend] {
top: calc( /* top: calc( */
(var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2 /* (var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2 */
) !important; /* ) !important; */
left: 0 !important; /* Fix due to deprecation https://www.reddit.com/r/firefox/comments/1cs3g49/address_bar_suggestions_going_up_instead_of_down/ */
width: 100% !important; top: calc((var(--urlbar-container-height, --urlbar-toolbar-height) - var(--urlbar-height)) / 2) !important;
left: 0 !important;
width: 100% !important;
} }
#urlbar[breakout-extend] #urlbar-input-container { #urlbar[breakout-extend] #urlbar-input-container {
height: var(--urlbar-height) !important; height: var(--urlbar-height) !important;
/* padding: 0px !important; */ /* padding: 0px !important; */
padding-block: 0px !important; padding-block: 0px !important;
padding-inline: 0px !important; padding-inline: 0px !important;
} }
.urlbarView-row { .urlbarView-row {
padding: 0px 2px 0px 2px; padding: 0px 2px 0px 2px;
} }
/* END Prevent enlargement --- */ /* END Prevent enlargement --- */
/*/* --- Reduce row paddings to make them more compact */ /*/* --- Reduce row paddings to make them more compact */
.urlbarView-row { .urlbarView-row {
padding: 2px 0px !important; padding: 2px 0px !important;
line-height: 1.2em !important; line-height: 1.2em !important;
margin: -1px; margin: -1px;
margin-bottom: 0px; margin-bottom: 0px;
} }
.urlbarView-row-inner { .urlbarView-row-inner {
padding-bottom: 6px !important; padding-bottom: 6px !important;
} }
.urlbarView { .urlbarView {
margin: 0px !important; margin: 0px !important;
width: 100% !important; width: 100% !important;
} }
/* END Reduce row paddings to make them more compact --- */ /* END Reduce row paddings to make them more compact --- */
/* Disable Urlbar Animation */ /* Disable Urlbar Animation */
#urlbar[breakout][breakout-extend][breakout-extend-animate] #urlbar[breakout][breakout-extend][breakout-extend-animate]>#urlbar-background {
> #urlbar-background { animation-name: none !important;
animation-name: none !important; animation: none !important;
animation: none !important;
} }
/* END Disable Urlbar Animation */ /* END Disable Urlbar Animation */
/* --- More compact "Search with Google" rows */ /* --- More compact "Search with Google" rows */
.urlbarView-row[dynamicType="onboardTabToSearch"] > .urlbarView-row-inner { .urlbarView-row[dynamicType="onboardTabToSearch"]>.urlbarView-row-inner {
min-height: auto !important; min-height: auto !important;
width: auto !important; width: auto !important;
} }
.urlbarView-row[dynamicType="onboardTabToSearch"]
> .urlbarView-row-inner .urlbarView-row[dynamicType="onboardTabToSearch"]>.urlbarView-row-inner>.urlbarView-no-wrap>.urlbarView-favicon {
> .urlbarView-no-wrap margin-bottom: -1px;
> .urlbarView-favicon {
margin-bottom: -1px;
} }
/* END More compact "Search with Google" rows --- */ /* END More compact "Search with Google" rows --- */
/* Remove active border on the addressbar when in focus */ /* Remove active border on the addressbar when in focus */
#nav-bar { #nav-bar {
--toolbar-field-focus-border-color: #ccc; --toolbar-field-focus-border-color: #ccc;
} }
/* Remove box shadow on address bar */ /* Remove box shadow on address bar */
#urlbar-background, #urlbar-background,
#searchbar { #searchbar {
box-shadow: none !important; box-shadow: none !important;
} }
''; '';
bookmarks = [ bookmarks = [