Firefox userChrome Update

If anyone is using the style from my Firefox post a couple of years ago, you may have noted that the userChrome styling broke in Firefox 132; here's the correct new style for the same visual effect:

/* hide the native tabs */
#TabsToolbar .toolbar-items {
	visibility: collapse;
}

/* fix the titlebar color and padding */
.browser-titlebar {
	background-color: var(--toolbar-bgcolor) !important;
	justify-content: space-between !important;
	padding: 8px 0 !important;
	--inactive-titlebar-opacity: 1.0;
}

/* hide the sidebar header so Tree-Style Tabs looks native */
#sidebar-header {
	visibility: collapse;
}

/* Hide the border under where native tabs would be, to get the "unified toolbar" appearance of modern macOS */
#navigator-toolbox {
	--tabs-border-color: transparent !important;
}

/* the coloration of the titlebar to look like a toolbar */
#titlebar {
	background: var(--toolbar-bgcolor);
}

/* hide a single stray vertical line that creeps in if you have tabs hidden */
#titlebar .titlebar-spacer[type="pre-tabs"] {
	border-inline-end: 0 !important;
}

Cheers!


Want to comment on this? How about we talk on Mastodon instead? mastodon logo Share on Mastodon