1
0

small changes

This commit is contained in:
Tilman Kranz 2025-01-06 03:13:58 +01:00
parent c6e990c2b7
commit 0ded6d4733
2 changed files with 19 additions and 16 deletions

View File

@ -1,4 +1,4 @@
/* some exceptions for the stylelint CSS linter: */ /*** Exceptions for stylelint CSS linter ***/
/* stylelint-disable selector-id-pattern */ /* stylelint-disable selector-id-pattern */
/* stylelint-disable selector-type-no-unknown */ /* stylelint-disable selector-type-no-unknown */
@ -17,27 +17,28 @@ menupopup:not(.in-menulist) > menuitem, menupopup:not(.in-menulist) > menu { pad
:root { --arrowpanel-menuitem-padding: 4px 8px !important; } :root { --arrowpanel-menuitem-padding: 4px 8px !important; }
*/ */
/*** Proton Tabs Tweaks ***/
/* Adjust tab corner shape, optionally remove space below tabs */ /* Adjust tab corner shape, optionally remove space below tabs */
#tabbrowser-tabs { --user-tab-rounding: 5px; }
.tab-background { border-radius: var(--user-tab-rounding) var(--user-tab-rounding) 0 0 !important; /* Connected */ margin-block: 1px 0 !important; /* Connected */ } #tabbrowser-tabs { --user-tab-rounding: .4em; }
.tab-background { border-radius: var(--user-tab-rounding) var(--user-tab-rounding) 0 0 !important; /* Connected */ margin-block: 0 !important; /* Connected */ }
#scrollbutton-up, #scrollbutton-down { border-top-width: 1px !important; border-bottom-width: 0 !important; } #scrollbutton-up, #scrollbutton-down { border-top-width: 1px !important; border-bottom-width: 0 !important; }
/* Change active tab background color, https://stackoverflow.com/a/78252258 */ /* remove toolbar decoration */
.tab-background:is([selected], [multiselected]) { border-left: 1px solid grey; border-right: 1px solid grey; border-top: 1px solid grey; border-bottom: none; background-image: none !important; box-shadow: 9px 0 8px -4px rgb(0 0 0 / 80%); } #nav-bar { border-top: none !important; }
/* OPTIONAL: analogous to the above, change inactive tab to a grey-to-white gradient */ /* change active tab */
.tab-background:is([selected], [multiselected]) { border: 1px solid grey; border-bottom: none !important; background-image: none !important; }
/* /* analogous to the above, change inactive tab to a grey-to-white gradient */
.tab-background:not([selected], [multiselected]) { background-image: linear-gradient( to top, hsl(137.28deg 0% 70% / 0%), hsl(137.28deg 0% 72.72% / 5%), hsl(137.28deg 0% 75.43% / 9.2%), hsl(137.28deg 0% 78.1%) 13.2%, hsl(137.28deg 0% 80.72%) 17%, hsl(137.28deg 0% 83.26%) 20.8%, hsl(137.28deg 0% 85.71%) 24.8%, hsl(137.28deg 0% 88.04%) 29.2%, hsl(137.28deg 0% 90.24%) 34.2%, hsl(137.28deg 0% 92.28%) 39.9%, hsl(137.28deg 0% 94.14%) 46.5%, hsl(137.28deg 0% 95.8%) 54.3%, hsl(137.28deg 0% 97.23%) 63.3%, hsl(137.28deg 0% 98.43%) 73.8%, hsl(137.28deg 0% 99.36%) 86%, hsl(165.09deg 100% 100%) 100%); } .tab-background:not([selected], [multiselected]) { background-color: #eee; }
*/
/* 1/16/2022 Tone down the Fx96 tab border with add-on themes in certain fallback situations */
.tab-background:is([selected], [multiselected]):-moz-lwtheme { --lwt-tabs-border-color: rgb(0 0 0 / 0%) !important; border-bottom-color: transparent !important; }
/* Container color bar visibility */ /* Container color bar visibility */
.tabbrowser-tab[usercontextid] > .tab-stack > .tab-background > .tab-context-line { margin: 0 max(calc(var(--user-tab-rounding) - 3px), 0px) !important; } .tabbrowser-tab[usercontextid] > .tab-stack > .tab-background > .tab-context-line { margin: 0 max(calc(var(--user-tab-rounding) - 3px), 0px) !important; }
/* Override Normal Density height to Compact Density height only for tabs */ /* Override Normal Density height to Compact Density height only for tabs */
#TabsToolbar, #tabbrowser-tabs { --tab-min-height: 29px !important; } #TabsToolbar, #tabbrowser-tabs { --tab-min-height: 29px !important; }
/* [Connected Tabs] Set a max height based on min-height plus margin-block: 1px 0 */ /* [Connected Tabs] Set a max height based on min-height plus margin-block: 1px 0 */
@ -57,18 +58,18 @@ menupopup:not(.in-menulist) > menuitem, menupopup:not(.in-menulist) > menu { pad
.tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]), .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]),
#firefox-view-button[attention], .webextension-browser-action[attention="true"] { background-position-y: bottom 2px !important; } #firefox-view-button[attention], .webextension-browser-action[attention="true"] { background-position-y: bottom 2px !important; }
/* No rounded corners on tabs that are not selected */
.tabbrowser-tab:not([selected="true"], [multiselected="true"]) .tab-background { border-radius: 0 !important; } .tabbrowser-tab:not([selected="true"], [multiselected="true"]) .tab-background { border-radius: 0 !important; }
/* Inactive tabs: Separator line style */ /* Inactive tabs: Separator line style */
.tabbrowser-tab:not([selected="true"], [multiselected="true"], [beforeselected-visible="true"]) .tab-background { border-right: 1px solid var(--lwt-background-tab-separator-color, rgb(0 0 0 / 20%)) !important; } .tabbrowser-tab:not([selected="true"], [multiselected="true"], [beforeselected-visible="true"]) .tab-background { border-right: 1px solid var(--lwt-background-tab-separator-color, rgb(0 0 0 / 20%)) !important; }
/* Adjust colors for dark backgrounds */ [brighttext="true"] .tab-background:is([selected], [multiselected]):-moz-lwtheme { --lwt-tabs-border-color: rgb(255 255 255 / 50%) !important; border-bottom: none !important; }
[brighttext="true"] .tab-background:is([selected], [multiselected]):-moz-lwtheme { --lwt-tabs-border-color: rgb(255 255 255 / 50%) !important; border-bottom-color: transparent !important; }
/* For dark backgrounds */
[brighttext="true"] .tabbrowser-tab:not([selected="true"], [multiselected="true"], [beforeselected-visible="true"]) .tab-background { border-right: 1px solid var(--lwt-background-tab-separator-color, var(--lwt-selected-tab-background-color, rgb(255 255 255 / 20%))) !important; } [brighttext="true"] .tabbrowser-tab:not([selected="true"], [multiselected="true"], [beforeselected-visible="true"]) .tab-background { border-right: 1px solid var(--lwt-background-tab-separator-color, var(--lwt-selected-tab-background-color, rgb(255 255 255 / 20%))) !important; }
/* Remove padding between tabs, override font-size and -weight */ /* Remove padding between tabs, override font-size and -weight */
.tabbrowser-tab { padding-left: 0 !important; padding-right: 0 !important; font-size: 12px !important; font-weight: 400 !important; } .tabbrowser-tab { padding: 0 !important; font-size: 12px !important; font-weight: 400 !important; }
/* Move the mute/unmute button to the right and enlarge it */ /* Move the mute/unmute button to the right and enlarge it */
.tab-icon-overlay:not([pinned], [sharing], [crashed]):is([soundplaying], [muted]) { width: var(--user-mute-button-height) !important; height: var(--user-mute-button-height) !important; margin-left: calc(var(--user-mute-button-height) / 2 + 2px) !important; /* pushes icon to the right */ margin-right: 2px !important; /* closes up some space before the text */ padding: 0 !important; /* allows icon to expand to full size */ } .tab-icon-overlay:not([pinned], [sharing], [crashed]):is([soundplaying], [muted]) { width: var(--user-mute-button-height) !important; height: var(--user-mute-button-height) !important; margin-left: calc(var(--user-mute-button-height) / 2 + 2px) !important; /* pushes icon to the right */ margin-right: 2px !important; /* closes up some space before the text */ padding: 0 !important; /* allows icon to expand to full size */ }
@ -76,6 +77,8 @@ menupopup:not(.in-menulist) > menuitem, menupopup:not(.in-menulist) > menu { pad
/* Move the site icon to the left a bit and adjust position */ /* Move the site icon to the left a bit and adjust position */
.tab-icon-stack:not([pinned], [sharing], [crashed]):is([soundplaying], [muted]) > :not(.tab-icon-overlay) { margin-left: -4px !important; /* pushes icon to the left */ margin-top: calc((var(--user-mute-button-height) - 16px) / 2) !important; /* keep site icon reasonably positioned */ } .tab-icon-stack:not([pinned], [sharing], [crashed]):is([soundplaying], [muted]) > :not(.tab-icon-overlay) { margin-left: -4px !important; /* pushes icon to the left */ margin-top: calc((var(--user-mute-button-height) - 16px) / 2) !important; /* keep site icon reasonably positioned */ }
/* Override the rules for hover/not hover visibility */
/* Color the icon on hover for confirmation or avoidance */ /* Color the icon on hover for confirmation or avoidance */
.tab-icon-overlay:not([pinned], [sharing], [crashed]):is([soundplaying], [muted]):hover { fill: green !important; } .tab-icon-overlay:not([pinned], [sharing], [crashed]):is([soundplaying], [muted]):hover { fill: green !important; }

Binary file not shown.

Before

Width:  |  Height:  |  Size: 64 KiB

After

Width:  |  Height:  |  Size: 36 KiB