Compare commits

...

18 Commits

Author SHA1 Message Date
tm24fan8 3f1c422ec7 New sidebery data export 2026-05-12 01:08:56 -04:00
tm24fan8 5d791f9f80 Add standalone image page mods 2026-05-12 01:08:56 -04:00
tm24fan8 17865f6183 Add existing modifications 2026-05-12 01:08:55 -04:00
MrOtherGuy 494efca729 tab separator lines: hide separator on first tab when no pinned tabs exist
And also don't hide separator for the following tab when the preceding
split-view has its first tab multiselected.
2026-05-11 21:23:06 +03:00
MrOtherGuy 7927b20670 tab separator lines: don't hide separator on first non-pinned tabs with horizontal tabs 2026-05-11 16:00:16 +03:00
MrOtherGuy 790352d340 tab separator lines: Rewrite using inheritance for background-size
This fixes a few remaining issues and adds support for vertical tabs
2026-05-09 20:51:12 +03:00
MrOtherGuy 11eae3c086 autohide bookmarks toolbar: couple more fixes for deriving background correctly 2026-05-09 15:32:25 +03:00
MrOtherGuy db792dbdf5 tab separator lines: add more cases when to hide separator 2026-05-09 12:23:04 +03:00
MrOtherGuy bd749d93d8 navbar below content: update toolbar-bgcolor to toolbar-background-color 2026-05-09 11:47:22 +03:00
MrOtherGuy 792d032667 Change uses of --toolbarbutton-{inner,outer}-padding to ...-padding-{inner,outer}
This should preserve the old name as fallback until ESR-next is released
2026-05-09 11:33:58 +03:00
MrOtherGuy 4e10815e7d autohide bookmarks toolbar: Fix missing bookmarks toolbar background 2026-05-09 11:29:12 +03:00
MrOtherGuy a060daf108 tab separator lines: Add more cases where tab border shouldn't be shown 2026-04-24 05:20:10 +03:00
MrOtherGuy afdc0ebb41 Add background-color for autohide-like toolbars
Firefox 150 moved toolbox background into the body element so
We can't inherit individual toolbar background from toolbox anymore.
2026-04-23 17:30:49 +03:00
MrOtherGuy 50f0427d10 iconized menus: hide .menu-icon when menupopup needs gutter 2026-04-23 16:13:54 +03:00
MrOtherGuy 8f9f2cbee5 tab separator lines: hide sep from split-tab that follows hovered or selected tab 2026-04-22 18:53:18 +03:00
MrOtherGuy cc4087ec47 tab separator lines: hide tab separators on various split-tab and tab group modes 2026-04-22 17:00:09 +03:00
Ɀeus 55cdb2938d Align numbers with keyboard controls (#618)
Don't reset numbers after pinned tabs, skip increment for folded tab groups
2026-04-16 05:41:36 +03:00
MrOtherGuy d02c1a92fa iconized menubar items: add !important tag to fill color
fx149 specifies fill property and we need to override that
2026-03-30 20:43:05 +03:00
31 changed files with 282 additions and 60 deletions
+1 -2
View File
@@ -1,2 +1 @@
userChrome.css *.code-workspace
userContent.css
+31 -11
View File
@@ -1,14 +1,22 @@
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/autohide_bookmarks_toolbar.css made available under Mozilla Public License v. 2.0 /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/autohide_bookmarks_toolbar.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */ See the above repository for updates as well as full license text. */
:root{
--uc-toolbox-background-image: var(--toolbox-background-image,var(--toolbar-bgimage));
--uc-toolbox-background-color: var(--toolbox-background-color,var(--toolbox-bgcolor));
--uc-toolbar-background-color: var(--toolbar-background-color,var(--toolbar-bgcolor));
}
#PersonalToolbar{ #PersonalToolbar{
--uc-bm-height: 20px; /* Might need to adjust if the toolbar has other buttons */ --uc-bm-height: 20px; /* Might need to adjust if the toolbar has other buttons */
--uc-bm-padding: 4px; /* Vertical padding to be applied to bookmarks */ --uc-bm-padding: 4px; /* Vertical padding to be applied to bookmarks */
--uc-autohide-toolbar-delay: 600ms; /* The toolbar is hidden after 0.6s */ --uc-autohide-toolbar-delay: 600ms; /* The toolbar is hidden after 0.6s */
/* 0deg = "show" ; 90deg = "hide" ; Set the following to control when bookmarks are shown */ /* 0deg = "show" ; 90deg = "hide" ; Set the following to control when bookmarks are shown */
--uc-autohide-toolbar-focus-rotation: 0deg; /* urlbar is focused */ --uc-autohide-toolbar-focus-rotation: 0deg; /* urlbar is focused */
--uc-autohide-toolbar-hover-rotation: 0deg; /* cursor is over the toolbar area */ --uc-autohide-toolbar-hover-rotation: 0deg; /* cursor is over the toolbar area */
--uc-toolbarbutton-inner-padding: var(--toolbarbutton-padding-inner,var(--toolbarbutton-inner-padding));
--uc-toolbarbutton-outer-padding: var(--toolbarbutton-padding-outer,var(--toolbarbutton-outer-padding));
} }
:root[uidensity="touch"] #PersonalToolbar{ --uc-bm-padding: 7px } :root[uidensity="touch"] #PersonalToolbar{ --uc-bm-padding: 7px }
@@ -22,25 +30,34 @@ See the above repository for updates as well as full license text. */
z-index: 1; z-index: 1;
/* The following properties should allow the themes with trasparent toolbars to work */ /* The following properties should allow the themes with trasparent toolbars to work */
background-color: transparent !important; background-color: transparent !important;
background-repeat: no-repeat,no-repeat,var(--lwt-background-tiling); background-repeat: no-repeat,var(--lwt-background-tiling);
/* y position will be wrong if menubar is enabled... */ /* y position will be wrong if menubar is enabled... */
--uc-bg-y: calc(-2 * (var(--tab-block-margin) + var(--toolbarbutton-inner-padding) + var(--toolbarbutton-outer-padding)) - var(--tab-min-height) - 24px - var(--bookmark-block-padding)); --uc-bg-y: calc(-2 * (var(--tab-block-margin) + var(--uc-toolbarbutton-inner-padding) + var(--uc-toolbarbutton-outer-padding)) - var(--tab-min-height) - 24px - var(--bookmark-block-padding));
background-position: top left,var(--lwt-background-alignment,top left);
background-position-y:0,var(--uc-bg-y),var(--uc-bg-y),var(--uc-bg-y);
background-size: cover, auto, auto, auto,auto,auto;
background-image: linear-gradient(var(--uc-toolbar-background-color)),
var(--uc-toolbox-background-image,var(--uc-toolbar-background-image,linear-gradient(transparent))),
var(--lwt-header-image,var(--lwt-additional-images)),
linear-gradient(var(--uc-toolbox-background-color)) !important;
}
/* This is simply for Firefox < 150 */
.browser-toolbox-background > #PersonalToolbar:not([customizing]){
background-repeat: no-repeat,no-repeat,var(--lwt-background-tiling);
background-position: top left,top left,var(--lwt-background-alignment,top left); background-position: top left,top left,var(--lwt-background-alignment,top left);
background-position-y:top,top,var(--uc-bg-y),var(--uc-bg-y),var(--uc-bg-y); background-position-y:0,var(--uc-bg-y),var(--uc-bg-y),var(--uc-bg-y);
background-image: var(--toolbar-bgimage,linear-gradient(transparent,transparent)), linear-gradient(var(--toolbar-bgcolor),var(--toolbar-bgcolor)),var(--lwt-header-image,var(--lwt-additional-images)) !important;
} }
@media -moz-pref("sidebar.verticalTabs"){ @media -moz-pref("sidebar.verticalTabs"){
#PersonalToolbar{ #PersonalToolbar{
--toolbar-bgcolor: transparent; --uc-toolbar-background-color: transparent;
} }
#PersonalToolbar:not([customizing]){ #PersonalToolbar:not([customizing]){
background-color: inherit !important;
margin-bottom: calc(0px - var(--uc-bm-height) - 2 * var(--uc-bm-padding)); margin-bottom: calc(0px - var(--uc-bm-height) - 2 * var(--uc-bm-padding));
--uc-bg-y: calc(0px - (2 * var(--toolbarbutton-inner-padding) + var(--toolbarbutton-outer-padding)) - 27px - var(--bookmark-block-padding)); --uc-bg-y: calc(0px - (2 * var(--uc-toolbarbutton-inner-padding) + var(--uc-toolbarbutton-outer-padding)) - 27px - var(--bookmark-block-padding));
} }
} }
:root[uidensity="compact"] #PersonalToolbar{ :root[uidensity="compact"] #PersonalToolbar{
--toolbarbutton-outer-padding: 1px !important; --uc-toolbarbutton-outer-padding: 1px !important;
} }
#PlacesToolbarItems > .bookmark-item, #PlacesToolbarItems > .bookmark-item,
#OtherBookmarks, #OtherBookmarks,
@@ -59,8 +76,11 @@ See the above repository for updates as well as full license text. */
transition-delay: 100ms !important; transition-delay: 100ms !important;
transform: rotateX(var(--uc-autohide-toolbar-hover-rotation,0)); transform: rotateX(var(--uc-autohide-toolbar-hover-rotation,0));
} }
:root:not([lwtheme]) #PersonalToolbar,
#navigator-toolbox:hover > #nav-bar:focus-within + #PersonalToolbar { #nav-bar.browser-titlebar + #PersonalToolbar{
background-color: var(--uc-toolbox-background-color) !important;
}
#navigator-toolbox:hover > #nav-bar:focus-within + #PersonalToolbar {
transform: rotateX(0); transform: rotateX(0);
} }
#navigator-toolbox{ #navigator-toolbox{
+12
View File
@@ -83,12 +83,24 @@ See the above repository for updates as well as full license text. */
opacity: 1; opacity: 1;
} }
/* If tabs are in sidebar then nav-bar doesn't normally have its own background - so we nee to add it back */ /* If tabs are in sidebar then nav-bar doesn't normally have its own background - so we nee to add it back */
#nav-bar.browser-titlebar + #PersonalToolbar,
#nav-bar.browser-titlebar{ #nav-bar.browser-titlebar{
background: inherit; background: inherit;
background-color: var(--toolbox-bgcolor) !important;
background-image: var(--lwt-additional-images);
background-repeat: var(--lwt-background-tiling);
background-position: var(--lwt-background-alignment);
}
#navigator-toolbox:hover > #nav-bar.browser-titlebar + #PersonalToolbar{
background-position-y: -40px;
transition: background-position-y
} }
#toolbar-menubar:not([autohide="true"],[autohide=""]) ~ #nav-bar.browser-titlebar{ #toolbar-menubar:not([autohide="true"],[autohide=""]) ~ #nav-bar.browser-titlebar{
background-position-y: -28px; /* best guess, could vary */ background-position-y: -28px; /* best guess, could vary */
border-top: none !important; border-top: none !important;
+ #PersonalToolbar{
background-position-y: -28px;
}
} }
/* Bookmarks toolbar needs so extra rules */ /* Bookmarks toolbar needs so extra rules */
+1
View File
@@ -24,6 +24,7 @@ See the above repository for updates as well as full license text. */
#navigator-toolbox{ #navigator-toolbox{
--browser-area-z-index-toolbox: 3; --browser-area-z-index-toolbox: 3;
position: fixed !important; position: fixed !important;
background: inherit;
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 82ms linear, opacity 82ms linear !important;
transition-delay: var(--uc-autohide-toolbox-delay) !important; transition-delay: var(--uc-autohide-toolbox-delay) !important;
+1 -1
View File
@@ -32,5 +32,5 @@ toolbar .toolbarbutton-1:not([disabled]):active > .toolbarbutton-badge-stack > .
toolbarbutton#scrollbutton-down:active > .toolbarbutton-icon{ transform: scale(-0.6) !important; } toolbarbutton#scrollbutton-down:active > .toolbarbutton-icon{ transform: scale(-0.6) !important; }
toolbar .toolbarbutton-1:not([disabled]):active > .toolbarbutton-icon{ toolbar .toolbarbutton-1:not([disabled]):active > .toolbarbutton-icon{
padding: calc(var(--toolbarbutton-inner-padding) + 3px) !important; padding: calc(var(--toolbarbutton-padding-inner,var(--toolbarbutton-inner-padding)) + 3px) !important;
} }
+2 -2
View File
@@ -30,7 +30,7 @@ toolbar .toolbarbutton-1 > .toolbarbutton-badge-stack > .toolbarbutton-icon,
toolbarbutton#scrollbutton-down > .toolbarbutton-icon{ transform: scale(-0.8) !important; } toolbarbutton#scrollbutton-down > .toolbarbutton-icon{ transform: scale(-0.8) !important; }
toolbar .toolbarbutton-1 > .toolbarbutton-icon{ toolbar .toolbarbutton-1 > .toolbarbutton-icon{
padding: calc(var(--toolbarbutton-inner-padding) + 2px) !important; padding: calc(var(--toolbarbutton-padding-inner,var(--toolbarbutton-inner-padding)) + 2px) !important;
} }
.urlbar-input-container [role="button"]:not([disabled]):hover image, .urlbar-input-container [role="button"]:not([disabled]):hover image,
.tab-close-button:hover, .tab-close-button:hover,
@@ -46,5 +46,5 @@ toolbar .toolbarbutton-1:not([disabled]):hover > .toolbarbutton-badge-stack > .t
toolbarbutton#scrollbutton-down:not([disabled]):hover > .toolbarbutton-icon{transform: scale(-1) !important;} toolbarbutton#scrollbutton-down:not([disabled]):hover > .toolbarbutton-icon{transform: scale(-1) !important;}
toolbar .toolbarbutton-1:not([disabled]):hover > .toolbarbutton-icon{ toolbar .toolbarbutton-1:not([disabled]):hover > .toolbarbutton-icon{
padding: var(--toolbarbutton-inner-padding) !important; padding: var(--toolbarbutton-padding-inner,var(--toolbarbutton-inner-padding)) !important;
} }
+6 -5
View File
@@ -4,13 +4,14 @@ See the above repository for updates as well as full license text. */
/* This style makes buttons look like real buttons with border and background. Color of border and background use the same colors as unselected urlbar to make them fit together. */ /* This style makes buttons look like real buttons with border and background. Color of border and background use the same colors as unselected urlbar to make them fit together. */
:root{ :root{
--uc-toolbarbutton-vertical-padding: var(--toolbarbutton-inner-padding); --uc--toolbarbutton-inner-padding: var(--toolbarbutton-padding-inner,var(--toolbarbutton-inner-padding));
--uc-toolbarbutton-horizontal-padding: calc(var(--toolbarbutton-inner-padding) + 10px); --uc-toolbarbutton-vertical-padding: var(--uc-toolbarbutton-inner-padding);
--uc-toolbarbutton-horizontal-padding: calc(var(--uc-toolbarbutton-inner-padding) + 10px);
--toolbarbutton-border-radius: 3px !important; --toolbarbutton-border-radius: 3px !important;
} }
:root[uidensity="compact"]{ :root[uidensity="compact"]{
--uc-toolbarbutton-vertical-padding: calc(var(--toolbarbutton-inner-padding) - 1px); --uc-toolbarbutton-vertical-padding: calc(var(--uc-toolbarbutton-inner-padding) - 1px);
--uc-toolbarbutton-horizontal-padding: calc(var(--toolbarbutton-inner-padding) + 6px); --uc-toolbarbutton-horizontal-padding: calc(var(--uc-toolbarbutton-inner-padding) + 6px);
} }
.browser-toolbar{ .browser-toolbar{
@@ -106,7 +107,7 @@ findbar toolbarbutton{
width: revert !important; width: revert !important;
height: revert !important; height: revert !important;
border: revert !important; border: revert !important;
padding: var(--toolbarbutton-inner-padding) !important; padding: var(--uc-toolbarbutton-inner-padding) !important;
} }
findbar toolbarbutton{ findbar toolbarbutton{
padding-inline: var(--uc-toolbarbutton-horizontal-padding) !important; padding-inline: var(--uc-toolbarbutton-horizontal-padding) !important;
+1
View File
@@ -5,6 +5,7 @@ See the above repository for updates as well as full license text. */
:root{ :root{
--toolbarbutton-inner-padding: 6px !important; --toolbarbutton-inner-padding: 6px !important;
--toolbarbutton-padding-inner: 6px !important;
--tab-block-margin: 2px !important; --tab-block-margin: 2px !important;
--tabs-shadow-size: 0px !important; --tabs-shadow-size: 0px !important;
--arrowpanel-menuitem-padding-block: 5px !important; --arrowpanel-menuitem-padding-block: 5px !important;
+4 -1
View File
@@ -30,7 +30,10 @@ See the above repository for updates as well as full license text. */
.tab-context-line{ .tab-context-line{
order: 1; order: 1;
} }
#TabsToolbar{ --toolbarbutton-inner-padding: 6px !important; } #TabsToolbar{
--toolbarbutton-inner-padding: 6px !important;
--toolbarbutton-padding-inner: 6px !important;
}
.titlebar-spacer[type="pre-tabs"], .titlebar-spacer[type="pre-tabs"],
.tabbrowser-tab::after{ border: none !important; } .tabbrowser-tab::after{ border: none !important; }
+1
View File
@@ -18,6 +18,7 @@ See the above repository for updates as well as full license text. */
#PersonalToolbar .toolbarbutton-1{ #PersonalToolbar .toolbarbutton-1{
--toolbarbutton-inner-padding: var(--uc-statusbar-button-padding) !important; --toolbarbutton-inner-padding: var(--uc-statusbar-button-padding) !important;
--toolbarbutton-padding-inner: var(--uc-statusbar-button-padding) !important;
} }
:root[uidensity="compact"]:not([inFullscreen]) > body{ :root[uidensity="compact"]:not([inFullscreen]) > body{
+1 -1
View File
@@ -22,7 +22,7 @@ findbar{
} }
.findbar-container > .findbar-find-fast{ .findbar-container > .findbar-find-fast{
padding: var(--toolbarbutton-inner-padding) 1px; padding: var(--toolbarbutton-padding-inner,var(--toolbarbutton-inner-padding)) 1px;
margin: 0 !important; margin: 0 !important;
} }
+4
View File
@@ -22,6 +22,10 @@ See the above repository for updates as well as full license text. */
:where(#contentAreaContextMenu > menuitem){ :where(#contentAreaContextMenu > menuitem){
padding-inline-start: 1em !important; padding-inline-start: 1em !important;
} }
:where(#contentAreaContextMenu) > menu:not(.menu-iconic) > .menu-icon,
:where(#contentAreaContextMenu) > menuitem:not(.menuitem-iconic) > .menu-icon{
display: none;
}
#contentAreaContextMenu > menuitem[type="checkbox"]::before{ #contentAreaContextMenu > menuitem[type="checkbox"]::before{
content: url("chrome://devtools/skin/images/checkbox.svg"); content: url("chrome://devtools/skin/images/checkbox.svg");
} }
+1 -1
View File
@@ -4,7 +4,7 @@ See the above repository for updates as well as full license text. */
/* Replaces menubar items text ("File Edit etc.") with icons */ /* Replaces menubar items text ("File Edit etc.") with icons */
#main-menubar > menu{ #main-menubar > menu{
fill: currentColor; fill: currentColor !important;
height: var(--uc-menubaritem-height,28px); height: var(--uc-menubaritem-height,28px);
width: var(--uc-menubaritem-width,30px); width: var(--uc-menubaritem-width,30px);
-moz-context-properties: fill; -moz-context-properties: fill;
+4
View File
@@ -23,6 +23,10 @@ See the above repository for updates as well as full license text. */
:where(#placesContext > menuitem){ :where(#placesContext > menuitem){
padding-inline-start: 1em !important; padding-inline-start: 1em !important;
} }
:where(#placesContext) > menu:not(.menu-iconic) > .menu-icon,
:where(#placesContext > menuitem:not(.menuitem-iconic) > .menu-icon{
display: none;
}
#placesContext > menuitem[type="checkbox"]::before{ #placesContext > menuitem[type="checkbox"]::before{
content: url("chrome://devtools/skin/images/checkbox.svg"); content: url("chrome://devtools/skin/images/checkbox.svg");
} }
+4
View File
@@ -22,6 +22,10 @@ See the above repository for updates as well as full license text. */
:where(#tabContextMenu > menuitem){ :where(#tabContextMenu > menuitem){
padding-inline-start: 1em !important; padding-inline-start: 1em !important;
} }
:where(#tabContextMenu) > menu:not(.menu-iconic) > .menu-icon,
:where(#tabContextMenu) > menuitem:not(.menuitem-iconic) > .menu-icon{
display: none;
}
#tabContextMenu > menuitem[type="checkbox"]::before{ #tabContextMenu > menuitem[type="checkbox"]::before{
content: url("chrome://devtools/skin/images/checkbox.svg"); content: url("chrome://devtools/skin/images/checkbox.svg");
} }
+8 -6
View File
@@ -6,11 +6,11 @@ See the above repository for updates as well as full license text. */
@-moz-document url(chrome://browser/content/browser.xhtml){ @-moz-document url(chrome://browser/content/browser.xhtml){
:root:not([inFullscreen]){ :root:not([inFullscreen]){
--uc-bottom-toolbar-height: calc(39px + var(--toolbarbutton-outer-padding) ) --uc-bottom-toolbar-height: calc(39px + var(--toolbarbutton-padding-outer,var(--toolbarbutton-outer-padding)) )
} }
:root[uidensity="compact"]:not([inFullscreen]){ :root[uidensity="compact"]:not([inFullscreen]){
--uc-bottom-toolbar-height: calc(32px + var(--toolbarbutton-outer-padding) ) --uc-bottom-toolbar-height: calc(32px + var(--toolbarbutton-padding-outer,var(--toolbarbutton-outer-padding)) )
} }
#browser, #browser,
@@ -25,14 +25,16 @@ See the above repository for updates as well as full license text. */
z-index: 1; z-index: 1;
} }
#nav-bar-customization-target{ -webkit-box-flex: 1; } #nav-bar-customization-target{ -webkit-box-flex: 1; }
#nav-bar{
--uc-toolbar-background-color: var(--toolbar-background-color,var(--toolbar-bgcolor));
}
:root[lwtheme] #nav-bar{ :root[lwtheme] #nav-bar{
background-image: linear-gradient(var(--toolbar-bgcolor),var(--toolbar-bgcolor)), var(--lwt-additional-images,var(--toolbar-bgimage)) !important; background-image: linear-gradient(var(--uc-toolbar-background-color:)), var(--lwt-additional-images,var(--uc-toolbox-background-image)) !important;
background-position: top,var(--lwt-background-alignment); background-position: top,var(--lwt-background-alignment);
background-repeat: repeat,var(--lwt-background-tiling); background-repeat: repeat,var(--lwt-background-tiling);
} }
:root[lwtheme-image] #nav-bar{ :root[lwtheme-image] #nav-bar{
background-image: linear-gradient(var(--toolbar-bgcolor),var(--toolbar-bgcolor)),var(--lwt-header-image), var(--lwt-additional-images,var(--toolbar-bgimage)) !important; background-image: linear-gradient(var(--uc-toolbar-background-color)),var(--lwt-header-image), var(--lwt-additional-images,var(--toolbar-bgimage)) !important;
} }
/* Fix panels sizing */ /* Fix panels sizing */
@@ -46,7 +48,7 @@ See the above repository for updates as well as full license text. */
} }
.urlbarView-body-inner{ border-top-style: none !important; } .urlbarView-body-inner{ border-top-style: none !important; }
@media (-moz-platform: linux){ @media (-moz-platform: linux){
#notification-popup[side="top"]{ #notification-popup[side="top"]{
margin-top: calc(-2 * var(--panel-padding-block) - 40px - 32px - 8.5em) !important; margin-top: calc(-2 * var(--panel-padding-block) - 40px - 32px - 8.5em) !important;
+3 -3
View File
@@ -31,13 +31,13 @@ See the above repository for updates as well as full license text. */
border-radius: 0 !important; border-radius: 0 !important;
margin: -3px 0 !important; margin: -3px 0 !important;
background-color:transparent; background-color:transparent;
width: calc(2 * var(--toolbarbutton-inner-padding) + 16px) !important; width: calc(2 * var(--toolbarbutton-padding-inner,var(--toolbarbutton-inner-padding)) + 16px) !important;
height: calc(2 * var(--toolbarbutton-inner-padding) + 16px) !important; height: calc(2 * var(--toolbarbutton-padding-inner,var(--toolbarbutton-inner-padding)) + 16px) !important;
} }
#back-button{ --backbutton-background: transparent; --uc-back-extra-padding: 0px !important } #back-button{ --backbutton-background: transparent; --uc-back-extra-padding: 0px !important }
#back-button > .toolbarbutton-icon{ padding: var(--toolbarbutton-inner-padding) } #back-button > .toolbarbutton-icon{ padding: var(--toolbarbutton-padding-inner,var(--toolbarbutton-inner-padding)) }
#nav-bar-customization-target > .chromeclass-toolbar-additional[overflows="false"]:not(#downloads-button):hover .toolbarbutton-icon{ #nav-bar-customization-target > .chromeclass-toolbar-additional[overflows="false"]:not(#downloads-button):hover .toolbarbutton-icon{
background-color: transparent !important; background-color: transparent !important;
+1
View File
@@ -28,6 +28,7 @@ See the above repository for updates as well as full license text. */
#TabsToolbar{ #TabsToolbar{
--toolbarbutton-inner-padding: 7px !important; --toolbarbutton-inner-padding: 7px !important;
--toolbarbutton-padding-inner: 7px !important;
} }
/* Few exceptions for default light theme */ /* Few exceptions for default light theme */
:root[lwtheme] #navigator-toolbox:not([movingtab]) > #TabsToolbar{ :root[lwtheme] #navigator-toolbox:not([movingtab]) > #TabsToolbar{
+3 -2
View File
@@ -3,5 +3,6 @@ See the above repository for updates as well as full license text. */
/* Show a number before tab text*/ /* Show a number before tab text*/
.tabbrowser-tab:first-child{ counter-reset: nth-tab 0 } /* Change to -1 for 0-indexing */ #tabbrowser-tabs{ counter-reset: nth-tab 0 } /* Change to -1 for 0-indexing */
.tab-text::before{ content: counter(nth-tab) " "; counter-increment: nth-tab } :not(tab-group[collapsed])>.tabbrowser-tab{ counter-increment: nth-tab }
.tab-text::before{ content: counter(nth-tab) " " }
+5 -2
View File
@@ -10,6 +10,7 @@ See the above repository for updates as well as full license text. */
} }
:root[sizemode="fullscreen"]{ :root[sizemode="fullscreen"]{
&[sessionrestored]{ &[sessionrestored]{
#searchbar-new,
#urlbar[popover]{ #urlbar[popover]{
pointer-events: none; pointer-events: none;
opacity: 0; opacity: 0;
@@ -24,14 +25,16 @@ See the above repository for updates as well as full license text. */
transition: transform var(--uc-fullscreen-overlay-duration) ease-in-out var(--uc-fullscreen-overlay-delay) !important; transition: transform var(--uc-fullscreen-overlay-duration) ease-in-out var(--uc-fullscreen-overlay-delay) !important;
margin-top: 0 !important; margin-top: 0 !important;
transform: translateY(-100%); transform: translateY(-100%);
background: inherit;
} }
#navigator-toolbox:is(:hover,:focus-within,[style=""]), #navigator-toolbox:is(:hover,:focus-within,[style=""]),
#mainPopupSet:has(> [panelopen]:not(#ask-chat-shortcuts,#selection-shortcut-action-panel,#chat-shortcuts-options-panel,#tab-preview-panel)) ~ #navigator-toolbox{ #mainPopupSet:has(> [panelopen]:not(#ask-chat-shortcuts,#selection-shortcut-action-panel,#chat-shortcuts-options-panel,#tab-preview-panel)) ~ #navigator-toolbox{
transition-delay: 0ms !important; transition-delay: 0ms !important;
transform: translateY(0); transform: translateY(0);
} }
#mainPopupSet:has(> [panelopen]:not(#ask-chat-shortcuts,#selection-shortcut-action-panel,#chat-shortcuts-options-panel,#tab-preview-panel)) ~ toolbox #urlbar[popover], #mainPopupSet:has(> [panelopen]:not(#ask-chat-shortcuts,#selection-shortcut-action-panel,#chat-shortcuts-options-panel,#tab-preview-panel)) ~ toolbox :is(#searchbar-new,#urlbar[popover]),
#navigator-toolbox:is(:hover,:focus-within,[style=""]) #urlbar[popover], #navigator-toolbox:is(:hover,:focus-within,[style=""]) :is(#searchbar-new,#urlbar[popover]),
#search-container > #searchbar-new:is([focused],[open]),
#urlbar-container > #urlbar[popover]:is([focused],[open]){ #urlbar-container > #urlbar[popover]:is([focused],[open]){
pointer-events: auto; pointer-events: auto;
opacity: 1; opacity: 1;
+6 -3
View File
@@ -7,9 +7,12 @@ See the above repository for updates as well as full license text. */
* If your theme has opaque background for urlbar then that will cover the reload button. * If your theme has opaque background for urlbar then that will cover the reload button.
* Switch to another theme such of one of the built-in dark/light/auto theme. * Switch to another theme such of one of the built-in dark/light/auto theme.
*/ */
#nav-bar-customization-target{
--uc-toolbarbutton-inner-padding: var(--toolbarbutton-padding-inner,var(--toolbarbutton-inner-padding));
--uc-toolbarbutton-outer-padding: var(--toolbarbutton-padding-outer,var(--toolbarbutton-outer-padding));
}
#urlbar-container + #stop-reload-button{ #urlbar-container + #stop-reload-button{
margin-left: calc( 1px - var(--urlbar-margin-inline) - 2 * (var(--toolbarbutton-outer-padding) + var(--toolbarbutton-inner-padding)) - 16px ); margin-left: calc( 1px - var(--urlbar-margin-inline) - 2 * (var(--uc-toolbarbutton-outer-padding) + var(--uc-toolbarbutton-inner-padding)) - 16px );
position: relative; position: relative;
z-index: 3; z-index: 3;
color: var(--urlbar-box-hover-text-color) !important; color: var(--urlbar-box-hover-text-color) !important;
@@ -22,7 +25,7 @@ See the above repository for updates as well as full license text. */
} }
#urlbar{ #urlbar{
padding-right: calc(2 * (var(--toolbarbutton-outer-padding) + var(--toolbarbutton-inner-padding)) + 12px) !important; padding-right: calc(2 * (var(--uc-toolbarbutton-outer-padding) + var(--uc-toolbarbutton-inner-padding)) + 12px) !important;
pointer-events: none; pointer-events: none;
} }
.urlbar-input-container, .urlbar-input-container,
+1 -1
View File
@@ -26,4 +26,4 @@ See the above repository for updates as well as full license text. */
} }
/* OPTIONAL - move caption buttons in tabs toolbar a bit upwards */ /* OPTIONAL - move caption buttons in tabs toolbar a bit upwards */
/* #TabsToolbar > .titlebar-buttonbox-container{ margin-bottom: var(--toolbarbutton-inner-padding) !important; } */ /* #TabsToolbar > .titlebar-buttonbox-container{ margin-bottom: var(--toolbarbutton-padding-inner,var(--toolbarbutton-inner-padding)) !important; } */
+54 -17
View File
@@ -1,27 +1,64 @@
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tab_separator_lines.css made available under Mozilla Public License v. 2.0 :where(.tabbrowser-tab){
See the above repository for updates as well as full license text. */
/* Bring back tab separator lines that were removed in Proton */
.tabbrowser-tab{
background-image: linear-gradient( background-image: linear-gradient(
transparent 20%, transparent 20%,
color-mix(in srgb, currentColor 20%, transparent) 20%, color-mix(in srgb, currentColor 20%, transparent) 20%,
color-mix(in srgb, currentColor 20%, transparent) 80%, color-mix(in srgb, currentColor 20%, transparent) 80%,
transparent 80% transparent 80%
); );
background-size: 1px 100%;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 1px 100%;
} }
.tab-group-label-container{ tab-split-view-wrapper{
padding-inline-start: 2px; background-size: 1px 100%;
} }
@media -moz-pref("sidebar.verticalTabs"){
#tabbrowser-tabs:not([movingtab]) .tabbrowser-tab:hover + .tabbrowser-tab:not([first-visible-unpinned-tab]), #tabbrowser-tabs{
.tabbrowser-tab:is(:hover,:first-child,[selected],[multiselected]), --uc-vertical-tabs-expanded-separator: linear-gradient(to right,
.tabbrowser-tab:is([selected],[multiselected]) + .tabbrowser-tab[hidden] + .tabbrowser-tab, transparent 10cqw,
#tabbrowser-tabs:not([movingtab]) .tabbrowser-tab:is([multiselected],[selected]) + .tabbrowser-tab, color-mix(in srgb, currentColor 20%, transparent) 10cqw,
tab-group[collapsed] + .tabbrowser-tab, color-mix(in srgb, currentColor 20%, transparent) 90cqw,
tab-group > .tabbrowser-tab:first-of-type, transparent 90cqw
tab-group:has(> .tabbrowser-tab:last-child:is(:hover,[selected],[multiselected])) + .tabbrowser-tab{ );
}
:where(.tabbrowser-tab){
background-image: linear-gradient(color-mix(in srgb, currentColor 20%, transparent));
background-size: 60% 1px;
background-position-x: center;
}
:where(#tabbrowser-tabs[expanded] .tabbrowser-tab){
background-image: var(--uc-vertical-tabs-expanded-separator);
background-size: 90cqw 1px;
}
#tabbrowser-tabs[expanded] > #pinned-tabs-container > .tabbrowser-tab{
background-image: none;
}
tab-split-view-wrapper{
background-size: 90cqw 1px;
}
#tabbrowser-tabs[expanded] tab-split-view-wrapper >.tabbrowser-tab:last-child{
background-size: 90cqw 1px;
background-image: var(--uc-vertical-tabs-expanded-separator);
@container vertical-tabs-container (min-width: 210px){
background-size: inherit;
}
}
}
tab-split-view-wrapper > .tabbrowser-tab{
background-size: inherit;
}
tab-split-view-wrapper > .tabbrowser-tab:last-child{
background-image: none; background-image: none;
} }
tab-group > slot + :is(tab-split-view-wrapper,.tabbrowser-tab),
tab-group[collapsed] + :is(tab-split-view-wrapper,.tabbrowser-tab),
:is(tab-split-view-wrapper,.tabbrowser-tab):is([selected],[multiselected],[hasactivetab],:hover),
:is(tab-split-view-wrapper,.tabbrowser-tab):is([selected],tab[multiselected],[hasactivetab],:hover) + :is(tab-split-view-wrapper,.tabbrowser-tab),
tab-split-view-wrapper:has( > [multiselected]:last-child) + :is(tab-split-view-wrapper,.tabbrowser-tab),
tab-group:has(> :last-of-type:is(:hover,[selected],[multiselected],[hasactivetab]) + vbox) + :is(tab-split-view-wrapper,.tabbrowser-tab),
#pinned-tabs-container > :first-child,
#pinned-tabs-container:empty ~ arrowscrollbox > :first-child,
#tabbrowser-arrowscrollbox[overflowing] > :first-child,
#pinned-tabs-container:has( > :last-child:is(:hover,[selected],[multiselected])) ~ arrowscrollbox > :first-child,
#vertical-pinned-tabs-splitter:not([hidden]) ~ arrowscrollbox[orient="vertical"] > :first-child{
background-size: 0 0;
}
+2 -2
View File
@@ -12,9 +12,9 @@ toolbar .toolbarbutton-1[label]:not([disabled]):hover{ background-color: var(--t
toolbar .toolbarbutton-1[label] > .toolbarbutton-icon, toolbar .toolbarbutton-1[label] > .toolbarbutton-icon,
toolbar .toolbarbutton-1[label] > .toolbarbutton-badge-stack{ toolbar .toolbarbutton-1[label] > .toolbarbutton-badge-stack{
padding: var(--toolbarbutton-inner-padding) !important; padding: var(--toolbarbutton-padding-inner,var(--toolbarbutton-inner-padding)) !important;
padding-bottom: 0px !important; padding-bottom: 0px !important;
height: calc(var(--toolbarbutton-inner-padding) + 16px) !important; height: calc(var(--toolbarbutton-padding-inner,var(--toolbarbutton-inner-padding)) + 16px) !important;
border: none !important; border: none !important;
background-color: transparent !important; background-color: transparent !important;
box-shadow: none !important; box-shadow: none !important;
+1
View File
@@ -26,6 +26,7 @@ See the above repository for updates as well as full license text. */
} }
#PersonalToolbar .toolbarbutton-1{ #PersonalToolbar .toolbarbutton-1{
--toolbarbutton-inner-padding: 10px !important; --toolbarbutton-inner-padding: 10px !important;
--toolbarbutton-padding-inner: 10px !important;
} }
#PersonalToolbar #PlacesChevron{ #PersonalToolbar #PlacesChevron{
display: none; display: none;
File diff suppressed because one or more lines are too long
+76
View File
@@ -0,0 +1,76 @@
{
"cssVars": {
"bg": "#242631ff",
"title_fg": null,
"sub_title_fg": null,
"label_fg": null,
"label_fg_hover": null,
"label_fg_active": null,
"info_fg": null,
"true_fg": null,
"false_fg": null,
"active_fg": null,
"inactive_fg": null,
"favicons_placeholder_bg": "#c8c8cbff",
"btn_bg": null,
"btn_bg_hover": null,
"btn_bg_active": null,
"btn_fg": null,
"btn_fg_hover": null,
"btn_fg_active": null,
"scroll_progress_h": null,
"scroll_progress_bg": null,
"ctx_menu_font": null,
"ctx_menu_bg": null,
"ctx_menu_bg_hover": null,
"ctx_menu_fg": null,
"nav_btn_fg": null,
"nav_btn_width": "48px",
"nav_btn_height": "48px",
"pinned_dock_overlay_bg": null,
"pinned_dock_overlay_shadow": null,
"tabs_height": "32px",
"tabs_pinned_height": null,
"tabs_pinned_width": null,
"tabs_indent": "16px",
"tabs_font": "inherit",
"tabs_count_font": null,
"tabs_fg": "#6272a4",
"tabs_fg_hover": "#f8f8f2",
"tabs_fg_active": null,
"tabs_bg_hover": "#373a49",
"tabs_bg_active": null,
"tabs_activated_bg": "#373a49",
"tabs_activated_fg": "#f8f8f2",
"tabs_selected_bg": "#373a49",
"tabs_selected_fg": "#f8f8f2",
"tabs_border": null,
"tabs_activated_border": null,
"tabs_selected_border": null,
"tabs_shadow": null,
"tabs_activated_shadow": null,
"tabs_selected_shadow": null,
"tabs_lvl_indicator_bg": null,
"bookmarks_bookmark_height": "32px",
"bookmarks_folder_height": "32px",
"bookmarks_separator_height": null,
"bookmarks_bookmark_font": "inherit",
"bookmarks_folder_font": "inherit",
"bookmarks_node_title_fg": "#f8f8f2",
"bookmarks_node_title_fg_hover": "#f8f8f2",
"bookmarks_node_title_fg_active": "#f8f8f2",
"bookmarks_node_bg_hover": "#373a49",
"bookmarks_node_bg_active": "#373a49",
"bookmarks_folder_closed_fg": "#f8f8f2",
"bookmarks_folder_closed_fg_hover": "#f8f8f2",
"bookmarks_folder_closed_fg_active": "#f8f8f2",
"bookmarks_folder_open_fg": "#f8f8f2",
"bookmarks_folder_open_fg_hover": "#f8f8f2",
"bookmarks_folder_open_fg_active": "#f8f8f2",
"bookmarks_folder_empty_fg": "#6272a4",
"bookmarks_open_bookmark_fg": "#f8f8f2"
},
"sidebarCSS": "\n.TabsPanel.panel,\n.Bookmarks.panel {\n padding-top: 35px;\n}\n\n.TabsPanel.panel::before,\n.Bookmarks.panel::before {\n content: 'Explorer';\n display: block;\n height: 35px;\n line-height: 35px;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n text-transform: uppercase;\n color: var(--tabs-activated-fg);\n padding: 0 20px;\n font-size: 11px;\n font-weight: 500;\n}\n\n.Bookmarks.panel::before {\n content: 'Bookmarks';\n}\n\n.Bookmarks {\n font-weight: 500;\n}\n\n/*\n.Tab {\n border-right: 2px solid transparent;\n}\n.Tab[data-active=\"true\"] {\n border-right: 2px solid #a86595;\n}\n*/\n\n.Tab .ctx {\n display: none;\n}\n\n.Tab .title {\n font-size: 13px;\n font-weight: 500 !important;\n}\n\n.Tab .close > svg {\n fill: var(--tabs-activated-fg);\n}\n\n.Tab .close:hover > svg {\n fill: var(--tabs-activated-fg);\n background-color: rgba(255,255,255,0.1);\n border-radius: 2px;\n}\n\n.Tab[data-discarded=\"true\"] {\n color: var(--tabs-fg) !important;\n font-style: italic;\n}\n\n.Tab[data-discarded=\"true\"] .t-box {\n opacity: 1 !important;\n}\n\n.panel-btn {\n border-left: 0 solid transparent;\n border-width: 0 2px;\n}\n\n.panel-btn > svg {\n --container-fg: #6272a4;\n --nav-btn-fg: #6272a4;\n width: 24px !important;\n height: 24px !important;\n}\n\n/*\n.panel-btn:hover {\n background-color: var(--tabs-bg-hover) !important;\n}\n*/\n\n.panel-btn:hover > svg {\n --container-fg: var(--tabs-fg-hover);\n --nav-btn-fg: var(--tabs-fg-hover);\n}\n\n.panel-btn[data-active=\"true\"] {\n background-color: #43465a !important;\n border-left-color: #a86595;\n}\n\n.panel-btn[data-active=\"true\"] > svg {\n --container-fg: var(--tabs-activated-fg);\n --nav-btn-fg: var(--tabs-activated-fg);\n}\n\n.NavigationBar {\n background-color: #3a3f4e;\n box-shadow: none !important;\n}\n\n.TabsPanel .container, .PinnedDock {\n box-shadow: none !important;\n}\n",
"groupCSS": "",
"ver": "4.10.2"
}
+30
View File
@@ -0,0 +1,30 @@
/* Transição suave para o TabsToolbar */
#main-window #TabsToolbar {
overflow: hidden;
max-height: 3em; /* Estado expandido */
transition: max-height 0.3s ease-in-out !important;
}
/* Toolbar items */
#main-window #TabsToolbar .toolbar-items {
overflow: hidden;
max-height: 40px; /* Estado expandido */
transition: max-height 0.3s ease-in-out !important;
}
/* Estado oculto: TabsToolbar colapsado */
#main-window[titlepreface*=""] #TabsToolbar {
max-height: 0; /* Estado colapsado */
visibility: hidden; /* Evita conteúdo interativo enquanto colapsado */
transition: max-height 0.3s ease-in-out, visibility 0s 0.3s !important; /* atraso para ocultar */
}
/* Estado oculto para os itens da toolbar */
#main-window[titlepreface*=""] #TabsToolbar .toolbar-items {
max-height: 0;
}
/* Corrige o z-index de abas fixadas */
#main-window[titlepreface*=""] #tabbrowser-tabs {
z-index: 0 !important;
}
+14
View File
@@ -0,0 +1,14 @@
#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;
}
+2
View File
@@ -0,0 +1,2 @@
@import url(tony/smaller_sidebar_header.css);
@import url(tony/dynamic_native_tabs.css);
+1
View File
@@ -0,0 +1 @@
@import url(content/standalone_image_page_mods.css);