Fixed #1088

src/other/firefox/Monterey/colors/dark.css

@@ -80,6 +80,7 @@
 	--gnome-button-destructive-action-active-border-color: #851015;
 	--gnome-button-destructive-action-active-box-shadow: inset 0 1px rgba(255, 255, 255, 0);
 
+	--gnome-headerbar-button-combined-background: rgba(255, 255, 255, 0.05);
 	--gnome-headerbar-button-hover-background: rgba(255, 255, 255, 0.1);
 	--gnome-headerbar-button-active-background: rgba(255, 255, 255, 0.15);
 

src/other/firefox/Monterey/colors/light.css

@@ -79,6 +79,7 @@
 	--gnome-button-destructive-action-active-border-color: #b2161d;
 	--gnome-button-destructive-action-active-box-shadow: inset 0 1px rgba(255, 255, 255, 0);
 
+	--gnome-headerbar-button-combined-background: rgba(0, 0, 0, 0.05);
 	--gnome-headerbar-button-hover-background: rgba(0, 0, 0, 0.1);
 	--gnome-headerbar-button-active-background: rgba(0, 0, 0, 0.15);
 

src/other/firefox/Monterey/parts/headerbar-urlbar.css

@@ -2,20 +2,19 @@
 
 @namespace xul "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";
 
-#urlbar {
-	--urlbar-height: 32px !important;
-	--urlbar-container-height: 32px !important;
-	--urlbar-toolbar-height: 32px !important;
-	--urlbar-inner-padding: 0 !important;
-}
-
 toolbarspring {
 	display: none !important;
 }
 
 /* URL bar */
 #urlbar {
+	--urlbar-height: 32px !important;
+	--urlbar-container-height: 32px !important;
+	--urlbar-toolbar-height: 32px !important;
+	--urlbar-inner-padding: 0 !important;
 	box-shadow: none !important;
+	width: 360px !important;
+	min-width: 360px !important;
 }
 
 #urlbar-background {
@@ -153,6 +152,13 @@ toolbarspring {
 }
 
 /* URL bar and Search bar */
+#urlbar[focused],
+#searchbar:focus-within {
+	outline: none !important;
+	border: none !important;
+	box-shadow: none !important;
+}
+
 #urlbar[focused] .urlbar-textbox-container {
 	margin: -1px !important;
 }
@@ -194,6 +200,10 @@ toolbarspring {
 	border-radius: 5px !important;
 }
 
+#identity-box[pageproxystate="valid"].chromeUI {
+	margin-left: 0 !important;
+}
+
 #identity-box:hover {
 	background: var(--gnome-headerbar-button-hover-background) !important;
 }

src/other/firefox/Monterey/parts/tabsbar.css

@@ -2,6 +2,10 @@
 
 @namespace xul "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";
 
+:root[tabsintitlebar] #nav-bar * {
+	-moz-window-dragging: drag;
+}
+
 tab > stack {
 	margin: 0 3px !important;
 }

src/other/firefox/WhiteSur/colors/dark.css

@@ -80,6 +80,7 @@
 	--gnome-button-destructive-action-active-border-color: #851015;
 	--gnome-button-destructive-action-active-box-shadow: inset 0 1px rgba(255, 255, 255, 0);
 
+	--gnome-headerbar-button-combined-background: rgba(255, 255, 255, 0.05);
 	--gnome-headerbar-button-hover-background: rgba(255, 255, 255, 0.1);
 	--gnome-headerbar-button-active-background: rgba(255, 255, 255, 0.15);
 

src/other/firefox/WhiteSur/colors/light.css

@@ -78,6 +78,7 @@
 	--gnome-button-destructive-action-active-border-color: #b2161d;
 	--gnome-button-destructive-action-active-box-shadow: inset 0 1px rgba(255, 255, 255, 0);
 
+	--gnome-headerbar-button-combined-background: rgba(0, 0, 0, 0.05);
 	--gnome-headerbar-button-hover-background: rgba(0, 0, 0, 0.1);
 	--gnome-headerbar-button-active-background: rgba(0, 0, 0, 0.15);
 

src/other/firefox/WhiteSur/parts/headerbar-urlbar.css

@@ -212,6 +212,10 @@ toolbarspring {
 	border-radius: 5px !important;
 }
 
+#identity-box[pageproxystate="valid"].chromeUI {
+	margin-left: 0 !important;
+}
+
 #identity-box:hover {
 	background: var(--gnome-headerbar-button-hover-background) !important;
 }

src/other/firefox/common/icons/tool-profiler.svg

@@ -0,0 +1,5 @@
+<svg width="16" height="16" version="1.1" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+ <path d="m8 0a8 8 0 0 0-8 8 8 8 0 0 0 1.7656 4.9883l0.78125-0.62695a7 7 0 0 1-1.5469-4.3613 7 7 0 0 1 7-7 7 7 0 0 1 7 7 7 7 0 0 1-1.5469 4.3613l0.78125 0.62695a8 8 0 0 0 1.7656-4.9883 8 8 0 0 0-8-8z" fill="#363636" stroke-linecap="round" stroke-linejoin="round" stroke-width="54" style="paint-order:stroke fill markers"/>
+ <path d="m8 10a2 2 0 0 0-2 2 2 2 0 0 0 2 2 2 2 0 0 0 2-2 2 2 0 0 0-2-2zm0 1a1 1 0 0 1 1 1 1 1 0 0 1-1 1 1 1 0 0 1-1-1 1 1 0 0 1 1-1z" fill="#363636" stroke-linecap="round" stroke-linejoin="round" stroke-width="54" style="paint-order:stroke fill markers"/>
+ <rect transform="rotate(30)" x="12.428" y="-.6077" width="1" height="6" rx=".5" ry=".5" fill="#363636" stroke-linecap="round" stroke-linejoin="round" stroke-width="54" style="paint-order:stroke fill markers"/>
+</svg>

src/other/firefox/common/parts/headerbar.css

@@ -34,6 +34,13 @@ toolbar .toolbaritem-combined-buttons > .toolbarbutton-1 {
 }
 
 #nav-bar .toolbaritem-combined-buttons {
+	padding: 0 !important;
+	margin: 0 !important;
+	border-radius: 8px !important;
+	background: var(--gnome-headerbar-button-combined-background) !important;
+}
+
+#nav-bar .toolbaritem-combined-buttons toolbarbutton:not(#urlbar-zoom-button) {
 	margin: 0 !important;
 }
 

src/other/firefox/common/parts/icons.css

@@ -609,6 +609,11 @@ toolbar:not([brighttext]) .webextension-browser-action:-moz-lwtheme {
 	fill: currentColor;
 }
 
+/* profiler */
+#profiler-button-button > .toolbarbutton-icon {
+	list-style-image: url("../icons/tool-profiler.svg") !important;
+}
+
 /* Fix flat buttons icons aproach */
 button.close::before {
 	content: "";
@@ -772,7 +777,8 @@ treechildren::-moz-tree-image {
 	.menu-iconic.bookmark-item[container] .menu-iconic-icon,
 	.panel-info-button > image,
 	#password-notification-icon,
-	#firefox-view-button .toolbarbutton-icon {
+	#firefox-view-button .toolbarbutton-icon,
+	#profiler-button-button > .toolbarbutton-icon {
 		filter: invert(60%) brightness(150%);
 	}