fix: update firefox userChrome.css for new version

programs/firefox/chrome/userChrome.css

@@ -1,73 +1,97 @@
 /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/autohide_toolbox.css made available under Mozilla Public License v. 2.0
 See the above repository for updates as well as full license text. */
 
-/* Hide the whole toolbar area unless urlbar is focused or cursor is over the toolbar */
+/* Hide the whole toolbar area unless urlbar is focused or cursor is over the toolbar
-/* Dimensions on non-Win10 OS probably needs to be adjusted */
+ * Dimensions on non-Win10 OS probably needs to be adjusted.
-
+ */
-/* Compatibility options for hide_tabs_toolbar.css and tabs_on_bottom.css at the end of this file */
 
 :root{
-  --uc-autohide-toolbox-delay: 200ms; /* Wait 0.1s before hiding toolbars */
+    --uc-autohide-toolbox-delay: 0ms; /* Wait 0.1s before hiding toolbars */
-  --uc-toolbox-rotation: 82deg;  /* This may need to be lower on mac - like 75 or so */
+    --uc-toolbox-rotation: 107deg;  /* This may need to be lower on mac - like 75 or so */
 }
 
 :root[sizemode="maximized"]{
-  --uc-toolbox-rotation: 88.5deg;
+    --uc-toolbox-rotation: 88.5deg;
 }
 
 @media  (-moz-platform: windows){
-  :root:not([lwtheme]) #navigator-toolbox{ background-color: -moz-dialog !important; }
+    :root:not([lwtheme]) #navigator-toolbox{ background-color: -moz-dialog !important; }
 }
 
 :root[sizemode="fullscreen"],
 :root[sizemode="fullscreen"] #navigator-toolbox{ margin-top: 0 !important; }
 
 #navigator-toolbox{
-  position: fixed !important;
+    --browser-area-z-index-toolbox: 3;
-  display: block;
+    position: fixed !important;
-  background-color: var(--lwt-accent-color,black) !important;
+    background-color: var(--lwt-accent-color,black) !important;
-  transition: transform 82ms linear, opacity 82ms linear !important;
+    transition: transform 0ms linear, opacity 0ms linear !important;
-  transition-delay: var(--uc-autohide-toolbox-delay) !important;
+    transition-delay: var(--uc-autohide-toolbox-delay) !important;
-  transform-origin: top;
+    transform-origin: top;
-  transform: rotateX(var(--uc-toolbox-rotation));
+    transform: rotateX(var(--uc-toolbox-rotation));
-  opacity: 0;
+    opacity: 0;
-  line-height: 0;
+    line-height: 0;
-  z-index: 1;
+    z-index: 1;
-  pointer-events: none;
+    pointer-events: none;
 }
-
+:root[sessionrestored] #urlbar[popover]{
+    pointer-events: none;
+    opacity: 0;
+    transition: transform 0ms linear var(--uc-autohide-toolbox-delay), opacity 0ms calc(var(--uc-autohide-toolbox-delay) + 0ms);
+    transform-origin: 0px calc(0px - var(--tab-min-height) - var(--tab-block-margin) * 2);
+    transform: rotateX(89.9deg);
+}
+#mainPopupSet:has(> [panelopen]:not(#ask-chat-shortcuts)) ~ toolbox #urlbar[popover],
+#navigator-toolbox:is(:hover,:focus-within) #urlbar[popover],
+#urlbar-container > #urlbar[popover]:is([focused],[open]){
+    pointer-events: auto;
+    opacity: 1;
+    transition-delay: 0ms;
+    transform: rotateX(0deg);
+}
+#mainPopupSet:has(> [panelopen]:not(#ask-chat-shortcuts)) ~ toolbox,
+#navigator-toolbox:has(#urlbar:is([open],[focus-within])),
 #navigator-toolbox:hover,
 #navigator-toolbox:focus-within{
-  transition-delay: 33ms !important;
+    transition-delay: 0ms !important;
-  transform: rotateX(0);
+    transform: rotateX(0);
-  opacity: 1;
+    opacity: 1;
 }
-/* This ruleset is separate, because not having :has support breaks other selectors as well */
+/* This makes things like OS menubar/taskbar show the toolbox when hovered in maximized windows.
-#mainPopupSet:has(> #appMenu-popup:hover) ~ toolbox{
+ * Unfortunately it also means that other OS native surfaces (such as context menu on macos)
-  transition-delay: 33ms !important;
+ * and other always-on-top applications will trigger toolbox to show up. */
-  transform: rotateX(0);
+@media (-moz-bool-pref: "userchrome.autohide-toolbox.unhide-by-native-ui.enabled"){
-  opacity: 1;
+    :root[sizemode="maximized"]:not(:hover){
+        #navigator-toolbox:not(:-moz-window-inactive),
+    #urlbar[popover]:not(:-moz-window-inactive){
+        transition-delay: 0ms !important;
+        transform: rotateX(0);
+        opacity: 1;
+    }
+    }
 }
 
 #navigator-toolbox > *{ line-height: normal; pointer-events: auto }
 
 #navigator-toolbox,
 #navigator-toolbox > *{
-  width: 100vw;
+    width: 100vw;
-  -moz-appearance: none !important;
+    -moz-appearance: none !important;
 }
 
 /* These two exist for oneliner compatibility */
 #nav-bar{ width: var(--uc-navigationbar-width,100vw) }
-#TabsToolbar{ width: calc(100vw - var(--uc-navigationbar-width,0px)) }
+#TabsToolbar
-
+{
+    visibility: collapse;
+}
 /* Don't apply transform before window has been fully created */
 :root:not([sessionrestored]) #navigator-toolbox{ transform:none !important }
 
 :root[customizing] #navigator-toolbox{
-  position: relative !important;
+    position: relative !important;
-  transform: none !important;
+    transform: none !important;
-  opacity: 1 !important;
+    opacity: 1 !important;
 }
 
 #navigator-toolbox[inFullscreen] > #PersonalToolbar,
@@ -81,3 +105,98 @@ See the above repository for updates as well as full license text. */
 #navigator-toolbox{ flex-direction: column; display: flex; }
 #titlebar{ order: 2 }
 */
+#sidebar-header {
+    display: none;
+}
+#sidebar-header {
+    /* display: none; */
+    visibility: collapse !important;
+}
+/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/autohide_sidebar.css made available under Mozilla Public License v. 2.0
+See the above repository for updates as well as full license text. */
+
+/* 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;
+    --uc-autohide-sidebar-delay: 0ms; /* Wait 0.6s before hiding sidebar */
+    --uc-autohide-transition-duration: 0ms;
+    --uc-autohide-transition-type: linear;
+    --browser-area-z-index-sidebar: 3;
+    position: relative;
+    min-width: var(--uc-sidebar-width) !important;
+    width: var(--uc-sidebar-width) !important;
+    max-width: var(--uc-sidebar-width) !important;
+    z-index: var(--browser-area-z-index-sidebar,3);
+}
+#sidebar-box[positionend]{ direction: rtl }
+#sidebar-box[positionend] > *{ direction: ltr }
+
+#sidebar-box[positionend]:-moz-locale-dir(rtl){ direction: ltr }
+#sidebar-box[positionend]:-moz-locale-dir(rtl) > *{ direction: rtl }
+
+#main-window[sizemode="fullscreen"] #sidebar-box{ --uc-sidebar-width: 1px; }
+
+#sidebar-splitter{ display: none }
+
+#sidebar-header{
+    overflow: hidden;
+    color: var(--chrome-color, inherit) !important;
+    padding-inline: 0 !important;
+}
+
+#sidebar-header::before,
+#sidebar-header::after{
+    content: "";
+    display: flex;
+    padding-left: 8px;
+}
+
+#sidebar-header,
+#sidebar{
+    transition: min-width var(--uc-autohide-transition-duration) var(--uc-autohide-transition-type) var(--uc-autohide-sidebar-delay) !important;
+    min-width: var(--uc-sidebar-width) !important;
+    will-change: min-width;
+}
+#sidebar-box:hover > #sidebar-header,
+#sidebar-box:hover > #sidebar{
+    min-width: var(--uc-sidebar-hover-width) !important;
+    transition-delay: 0ms !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: inherit !important;
+    border-inline: 1px solid rgb(80,80,80);
+    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-box:not([positionend]):hover ~ #appcontent #statuspanel{
+    inset-inline: auto 0px !important;
+}
+#sidebar-box:not([positionend]):hover ~ #appcontent #statuspanel-label{
+    margin-inline: 0px !important;
+    border-left-style: solid !important;
+}