add windows 11 style window controls

chrome/global/colors.css

@@ -133,3 +133,12 @@
   --button-primary-active-bgcolor: unset !important;
   --button-primary-color: unset !important;
 }
+
+/* make the titlebar buttons black/white on default themes */
+:root:not(:-moz-lwtheme)[tabsintitlebar] .titlebar-buttonbox {
+  color: #000 !important;
+}
+
+:root[lwt-default-theme-in-dark-mode="true"][tabsintitlebar] .titlebar-buttonbox {
+  color: #fff !important;
+}

chrome/icons/icons.css

@@ -1,5 +1,34 @@
 /* EdgeFr-Fox by bmFtZQ - icons.css */
 
+/* windows 11 style window controls (no known way to detect between windows 10
+and 11 so applied to both) */
+@media (-moz-os-version: windows-win10) {
+  .titlebar-min {
+    list-style-image: url("win11-minimize.svg") !important;
+  }
+
+  .titlebar-max {
+    list-style-image: url("win11-maximize.svg") !important;
+  }
+
+  .titlebar-restore {
+    list-style-image: url("win11-restore.svg") !important;
+  }
+
+  .titlebar-close {
+    list-style-image: url("win11-close.svg") !important;
+  }
+
+  /* darkmode icon that uses thicker strokes and easier to see (only needed at
+  1x scale) */
+  @media (max-resolution: 1dppx) {
+    :root[lwthemetextcolor="bright"] .titlebar-close,
+    .titlebar-close:hover {
+      list-style-image: url("win11-close-dark.svg") !important;
+    }
+  }
+}
+
 #appMenu-multiView .subviewbutton,
 #overflowMenu-customize-button {
   -moz-context-properties: fill, fill-opacity !important;

chrome/icons/win11-close-dark.svg

@@ -0,0 +1,3 @@
+<svg width="12" height="12" xmlns="http://www.w3.org/2000/svg" fill="context-stroke" fill-opacity="context-stroke-opacity">
+  <path d="M1.5.875a.625.625 0 0 0-.441.184.625.625 0 0 0 0 .882l4.059 4.06-4.06 4.058a.625.625 0 0 0 0 .883.625.625 0 0 0 .883 0l4.06-4.059 4.058 4.06a.625.625 0 0 0 .883 0 .625.625 0 0 0 0-.884L6.883 6l4.06-4.059a.625.625 0 0 0 0-.882.625.625 0 0 0-.884 0L6 5.118l-4.059-4.06A.625.625 0 0 0 1.5.876z"/>
+</svg>

chrome/icons/win11-close.svg

@@ -0,0 +1,3 @@
+<svg width="12" height="12" xmlns="http://www.w3.org/2000/svg" fill="context-stroke" fill-opacity="context-stroke-opacity">
+  <path d="M1.5 1a.5.5 0 0 0-.353.146.5.5 0 0 0 0 .708L5.293 6l-4.146 4.145a.5.5 0 0 0 0 .707.5.5 0 0 0 .707 0L6 6.706l4.146 4.146a.5.5 0 0 0 .706 0 .5.5 0 0 0 0-.707L6.708 6l4.146-4.146a.5.5 0 0 0 0-.707.5.5 0 0 0-.707 0L5.998 5.292 1.855 1.146A.5.5 0 0 0 1.5 1z"/>
+</svg>

chrome/icons/win11-maximize.svg

@@ -0,0 +1,3 @@
+<svg width="12" height="12" xmlns="http://www.w3.org/2000/svg" fill="context-stroke" fill-opacity="context-stroke-opacity">
+  <path d="M2.5 1C1.677 1 1 1.677 1 2.5v7c0 .823.677 1.5 1.5 1.5h7c.823 0 1.5-.677 1.5-1.5v-7c0-.823-.677-1.5-1.5-1.5zm0 1h7c.282 0 .5.218.5.5v7c0 .282-.218.5-.5.5h-7a.493.493 0 0 1-.5-.5v-7c0-.282.218-.5.5-.5z"/>
+</svg>

chrome/icons/win11-minimize.svg

@@ -0,0 +1,4 @@
+<svg width="12" height="12" xmlns="http://www.w3.org/2000/svg" fill="context-stroke" fill-opacity="context-stroke-opacity">
+  <style>@media(min-resolution:1.25dppx){path{translate:0 -0.5px;}}</style>
+  <path d="M1.5 6a.5.5 0 0 0-.5.5.5.5 0 0 0 .5.5h9a.5.5 0 0 0 .5-.5.5.5 0 0 0-.5-.5z"/>
+</svg>

chrome/icons/win11-restore.svg

@@ -0,0 +1,3 @@
+<svg width="12" height="12" xmlns="http://www.w3.org/2000/svg" fill="context-stroke" fill-opacity="context-stroke-opacity">
+  <path d="M3.5 2h5A1.5 1.5 45 0 1 10 3.5v5a1 1 135 0 0 1-1v-4A2.5 2.5 45 0 0 8.5 1h-4a1 1 135 0 0-1 1zM1 4.5v5A1.5 1.5 45 0 0 2.5 11h5A1.5 1.5 135 0 0 9 9.5v-5A1.5 1.5 45 0 0 7.5 3h-5A1.5 1.5 135 0 0 1 4.5zM2.5 4h5a.5.5 45 0 1 .5.5v5a.5.5 135 0 1-.5.5h-5a.5.5 45 0 1-.5-.5v-5a.5.5 135 0 1 .5-.5z"/>
+</svg>

chrome/toolbar/tabbar.css

@@ -21,7 +21,7 @@
 #tabbrowser-tabs[movingtab]>#tabbrowser-arrowscrollbox>.tabbrowser-tab[fadein]:not([selected]):not([multiselected]),
 .tabbrowser-tab[tab-grouping],
 .tabbrowser-tab[tabdrop-samewindow] {
-	transition: transform 150ms cubic-bezier(0, .75, .25, 1) !important;
+  transition: transform 150ms cubic-bezier(0, .75, .25, 1) !important;
 }
 
 :root:is([inFullscreen], :not([tabsintitlebar])) #titlebar {
@@ -31,7 +31,7 @@
 /* hide space above tabs when maximised for non-macOS versions of Firefox */
 @supports not -moz-bool-pref("layout.css.osx-font-smoothing.enabled") {
   :root:is([inFullscreen], :not([tabsintitlebar]), [sizemode="maximized"]) #titlebar,
-  #toolbar-menubar:not([inactive]) + #TabsToolbar {
+  #toolbar-menubar:not([inactive])+#TabsToolbar {
     --tab-block-margin: 0px !important;
   }
 }
@@ -240,13 +240,15 @@ toolbarbutton[part="scrollbutton-down"] {
 }
 
 /* mac titlebar buttons */
-@media (-moz-mac-big-sur-theme:0) {
+@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") {
-  .titlebar-buttonbox {
+  @media (-moz-mac-big-sur-theme:0) {
-    margin-inline: 10px !important;
+    .titlebar-buttonbox {
-  }
+      margin-inline: 10px !important;
+    }
 
-  .titlebar-buttonbox-container {
+    .titlebar-buttonbox-container {
-    margin-inline-end: -8px !important;
+      margin-inline-end: -8px !important;
+    }
   }
 }