1 /* Firefox Compact Mode
3 * Copyright (c) 2021 Danny Colin
5 * This Source Code Form is subject to the terms of the Mozilla Public
6 * License, v. 2.0. If a copy of the MPL was not distributed with this
7 * file, You can obtain one at https://mozilla.org/MPL/2.0/.
11 /* Tabbar: reduce tab margin */
12 --tab-block-margin: 0 !important
;
15 /* Reduce minimum window width for Fx74 */
16 :root:not
([chromehidden
~="toolbar"]){
17 /* Fx74 default is 450px on Windows */
18 min-width: 250px !important
;
24 --user-tab-rounding: 0px;
28 border-radius: var
(--user-tab-rounding
) var
(--user-tab-rounding
) 0px 0px !important
; /* Connected */
29 margin-block: 1px 0 !important
; /* Connected */
31 #scrollbutton-up, #scrollbutton-down
{ /* 6/10/2021 */
32 border-top-width: 1px !important
;
33 border-bottom-width: 0 !important
;
36 /* 1/16/2022 Tone down the Fx96 tab border with add-on themes in certain fallback situations */
37 .tab-background:is([selected], [multiselected]):-moz-lwtheme {
38 --lwt-tabs-border-color: rgba
(0, 0, 0, 0.5) !important
;
39 border-bottom-color: transparent
!important
;
41 [brighttext
="true"] .tab-background:is
([selected
], [multiselected
]):-moz-lwtheme
{
42 --lwt-tabs-border-color: rgba
(255, 255, 255, 0.5) !important
;
43 border-bottom-color: transparent
!important
;
46 /* Container color bar visibility */
47 .tabbrowser-tab[usercontextid] > .tab-stack > .tab-background > .tab-context-line {
48 margin: 0px max
(calc
(var
(--user-tab-rounding
) - 3px), 0px) !important
;
51 #TabsToolbar, #TabsToolbar
> hbox
, #TabsToolbar-customization-target
, #tabbrowser-arrowscrollbox
{
52 max-height: calc
(var
(--tab-min-height
) + 1px) !important
;
57 /* Inactive tabs: Separator line style */
59 .tabbrowser-tab:not([selected=true]):not([multiselected=true]):not([beforeselected-visible="true"]) .tab-background {
60 border-right: 1px solid var
(--lwt-background-tab-separator-color
, rgba
(0, 0, 0, .20)) !important
;
62 /* For dark backgrounds */
63 [brighttext
="true"] .tabbrowser-tab:not
([selected
=true
]):not
([multiselected
=true
]):not
([beforeselected-visible
="true"]) .tab-background
{
64 border-right: 1px solid var
(--lwt-background-tab-separator-color
, var
(--lwt-selected-tab-background-color
, rgba
(255, 255, 255, .20))) !important
;
66 .tabbrowser-tab:not([selected=true]):not([multiselected=true]) .tab-background {
67 border-radius: 0 !important
;
69 /* Remove padding between tabs */
71 padding-left: 0 !important
;
72 padding-right: 0 !important
;
77 /* Tab: Reduce height */
79 min-height: 16px !important
;
83 #TabsToolbar, #tabbrowser-tabs
{
84 --tab-min-height: 18px !important
;
89 border-top-width: 0 !important
;
90 border-bottom-width: 0 !important
;
93 /* Tab: Ensure tab height doesn't augment when arrowscrollbox is visible */
94 #tabbrowser-arrowscrollbox {
95 --tab-min-height: 18px !important
;
96 max-height: var
(--tab-min-height
);
99 /* Tab: Attention icon */
100 .tabbrowser-tab:is([image], [pinned]) > .tab-stack > .tab-content[attention]:not([selected="true"]), .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) {
101 background-position-x: left
2px !important
;
102 background-position-y: bottom
12.5px !important
;
105 /* URLBar: Fix vertical alignment */
106 #urlbar[breakout
=true
]:not
([open
="true"]) {
107 --urlbar-height: 16px !important
;
108 --urlbar-toolbar-height: 18px !important
;
111 /* URLBar: Fix URL address vertical aligment when megabar is open */
112 #urlbar[breakout
=true
][open
="true"] {
113 --urlbar-toolbar-height: 16px !important
;
116 /* URLBar: Reduce row items padding */
117 .urlbarView-row-inner {
118 padding-inline: var
(--urlbarView-item-inline-padding
);
119 padding-block: 1px !important
;
122 /* URLBar: Reduce and realign row bookmark icons */
123 .urlbarView-type-icon {
124 width: 10px !important
;
125 height: 10px !important
;
126 margin-bottom: 0 !important
;
127 margin-inline-start: 10px !important
;
130 /* URLBar: Reduce "This time, serach with" padding */
131 #urlbar .search-one-offs:not
([hidden
]) {
132 padding-block: 4px !important
;
135 /* Searchbar: Ensure toolbar height doesn't augment when searchbar is visible */
138 padding-block: 0 !important
;
141 /* Searchbar: Make sure the min-height of the input is the same as the popup */
143 min-width: 192px !important
;
146 /* Toolbar: Reduce spacing */
148 --urlbar-container-height: 18px !important
;
149 margin-top: 0 !important
;
153 max-height: 16px !important
;
157 * Make the toolbar extra-compact (similar to v56 with CTR)
159 * Applies to Compact density
161 * Contributor(s): Alex Vallat
164 :root
[uidensity
=compact
] #urlbar
,
165 :root
[uidensity
=compact
] .searchbar-textbox
{
166 min-height: 18px !important
;
169 :root
[uidensity
=compact
] #identity-box
{
173 :root
[uidensity
=compact
] #nav-bar
.toolbarbutton-1
{
174 padding: 0px !important
;
177 #nav-bar toolbarbutton
> .toolbarbutton-icon
{
178 height:14px!important
;
179 width:14px!important
;
180 padding: 0 !important
;
181 margin: 0 2px !important
;
183 #personal-bookmarks .bookmark-item
> .toolbarbutton-icon
{ height:16px!important
; width:16px!important
; }
187 /* Compatibility with auto-hide.css */
188 :root
[uidensity
=compact
] #navigator-toolbox
{
189 --nav-bar-height: 18px !important
;
197 /* Reload Button: Fix vertical alignment */
199 margin-block-start: -2px !important
;
202 /* AppMenu: Header */
204 padding: 4px 0 0 4px !important
;
207 /* AppMenu: Header button */
208 .panel-header > .subviewbutton-back {
209 padding: 4px !important
;
212 /* Windows 10 context menu */
213 @media (-moz-os-version: windows-win10
) {
214 /* Context Menu: Reduce vertical space */
215 menupopup
> menuitem
,
217 padding-block: 2px !important
;