Bug 1367384 - Make the title bar dark by default on Windows 10 and refactor caption button icons. r=johannh

MozReview-Commit-ID: EvLhDGAA5M2

--HG--
extra : rebase_source : 2c2ba1e1cc41ff8bbd461abe82814621b11f6074

browser/themes/windows/browser-aero.css

@@ -50,8 +50,13 @@
   @media not all and (-moz-os-version: windows-win7) {
     @media not all and (-moz-os-version: windows-win8) {
       @media (-moz-windows-default-theme) {
-        #main-window {
+        :root:not(:-moz-lwtheme) {
+%ifdef MOZ_PHOTON_THEME
+          background-color: hsl(235,33%,19%);
+          --titlebar-text-color: hsl(240,9%,98%);
+%else
           background-color: hsl(0, 0%, 78%);
+%endif
         }
 
         :root[tabsintitlebar] .tab-label:-moz-window-inactive {
@@ -62,7 +67,7 @@
       }
 
       @media (-moz-windows-default-theme: 0) {
-        #main-window {
+        :root {
           background-color: transparent;
         }
       }
@@ -76,9 +81,15 @@
         border: none;
         margin: 0 !important;
         padding: 10px 17px;
+        -moz-context-properties: stroke;
+%ifdef MOZ_PHOTON_THEME
+        stroke: white;
+%else
+        stroke: black;
+%endif
       }
 
-      #main-window[sizemode=maximized] .titlebar-button {
+      :root[sizemode=maximized] .titlebar-button {
         padding-top: 8px;
         padding-bottom: 8px;
       }
@@ -89,38 +100,37 @@
       }
 
       #titlebar-min {
-        list-style-image: url(chrome://browser/skin/caption-buttons.svg#minimize);
+        list-style-image: url(chrome://browser/skin/window-controls/minimize.svg);
       }
 
       #titlebar-max {
-        list-style-image: url(chrome://browser/skin/caption-buttons.svg#maximize);
+        list-style-image: url(chrome://browser/skin/window-controls/maximize.svg);
       }
 
-      #main-window[sizemode="maximized"] #titlebar-max {
-        list-style-image: url(chrome://browser/skin/caption-buttons.svg#restore);
+      :root[sizemode="maximized"] #titlebar-max {
+        list-style-image: url(chrome://browser/skin/window-controls/restore.svg);
       }
 
       #titlebar-close {
-        list-style-image: url(chrome://browser/skin/caption-buttons.svg#close);
-      }
-      #titlebar-close:hover {
-        list-style-image: url(chrome://browser/skin/caption-buttons.svg#close-white);
+        list-style-image: url(chrome://browser/skin/window-controls/close.svg);
       }
 
+      .titlebar-button:-moz-lwtheme {
+        -moz-context-properties: unset;
+      }
       #titlebar-min:-moz-lwtheme {
-        list-style-image: url(chrome://browser/skin/caption-buttons.svg#minimize-themes);
+        list-style-image: url(chrome://browser/skin/window-controls/minimize-themes.svg);
       }
       #titlebar-max:-moz-lwtheme {
-        list-style-image: url(chrome://browser/skin/caption-buttons.svg#maximize-themes);
+        list-style-image: url(chrome://browser/skin/window-controls/maximize-themes.svg);
       }
-      #main-window[sizemode="maximized"] #titlebar-max:-moz-lwtheme {
-        list-style-image: url(chrome://browser/skin/caption-buttons.svg#restore-themes);
+      :root[sizemode="maximized"] #titlebar-max:-moz-lwtheme {
+        list-style-image: url(chrome://browser/skin/window-controls/restore-themes.svg);
       }
       #titlebar-close:-moz-lwtheme {
-        list-style-image: url(chrome://browser/skin/caption-buttons.svg#close-themes);
+        list-style-image: url(chrome://browser/skin/window-controls/close-themes.svg);
       }
 
-
       /* the 12px image renders a 10px icon, and the 10px upscaled gets rounded to 12.5, which
        * rounds up to 13px, which makes the icon one pixel too big on 1.25dppx. Fix: */
       @media (min-resolution: 1.20dppx) and (max-resolution: 1.45dppx) {
@@ -168,60 +178,72 @@
       }
 
       @media (-moz-windows-default-theme) {
+%ifdef MOZ_PHOTON_THEME
         .titlebar-button:hover {
-          background-color: hsla(0, 0%, 0%, .12);
+          background-color: hsla(0,0%,100%,.12);
         }
-
         .titlebar-button:hover:active {
-          background-color: hsla(0, 0%, 0%, .22);
+          background-color: hsla(0,0%,100%,.22);
         }
+        .titlebar-button:-moz-lwtheme-darktext:hover {
+          background-color: hsla(0,0%,0%,.12);
+        }
+        .titlebar-button:-moz-lwtheme-darktext:hover:active {
+          background-color: hsla(0,0%,0%,.22);
+        }
+%else
+        .titlebar-button:hover {
+          background-color: hsla(0,0%,0%,.12);
+        }
+        .titlebar-button:hover:active {
+          background-color: hsla(0,0%,0%,.22);
+        }
+        .titlebar-button:-moz-lwtheme-brighttext:hover {
+          background-color: hsla(0,0%,100%,.12);
+        }
+        .titlebar-button:-moz-lwtheme-brighttext:hover:active {
+          background-color: hsla(0,0%,100%,.22);
+        }
+%endif
 
         .titlebar-button:not(:hover) > .toolbarbutton-icon:-moz-window-inactive {
           opacity: 0.5;
         }
 
         #titlebar-close:hover {
-          background-color: hsl(355, 86%, 49%);
+          stroke: white;
+          background-color: hsl(355,86%,49%);
         }
 
         #titlebar-close:hover:active {
-          background-color: hsl(355, 82%, 69%);
+          background-color: hsl(355,82%,69%);
         }
       }
+
       @media (-moz-windows-default-theme: 0) {
         .titlebar-button {
           background-color: -moz-field;
+          stroke: ButtonText;
         }
         .titlebar-button:hover {
           background-color: Highlight;
+          stroke: HighlightText;
         }
 
         #titlebar-min {
-          list-style-image: url(chrome://browser/skin/caption-buttons.svg#minimize-highcontrast);
-        }
-        #titlebar-min:hover {
-          list-style-image: url(chrome://browser/skin/caption-buttons.svg#minimize-highcontrast-hover);
+          list-style-image: url(chrome://browser/skin/window-controls/minimize-highcontrast.svg);
         }
 
         #titlebar-max {
-          list-style-image: url(chrome://browser/skin/caption-buttons.svg#maximize-highcontrast);
-        }
-        #titlebar-max:hover {
-          list-style-image: url(chrome://browser/skin/caption-buttons.svg#maximize-highcontrast-hover);
+          list-style-image: url(chrome://browser/skin/window-controls/maximize-highcontrast.svg);
         }
 
-        #main-window[sizemode="maximized"] #titlebar-max {
-          list-style-image: url(chrome://browser/skin/caption-buttons.svg#restore-highcontrast);
-        }
-        #main-window[sizemode="maximized"] #titlebar-max:hover {
-          list-style-image: url(chrome://browser/skin/caption-buttons.svg#restore-highcontrast-hover);
+        :root[sizemode="maximized"] #titlebar-max {
+          list-style-image: url(chrome://browser/skin/window-controls/restore-highcontrast.svg);
         }
 
         #titlebar-close {
-          list-style-image: url(chrome://browser/skin/caption-buttons.svg#close-highcontrast);
-        }
-        #titlebar-close:hover {
-          list-style-image: url(chrome://browser/skin/caption-buttons.svg#close-highcontrast-hover);
+          list-style-image: url(chrome://browser/skin/window-controls/close-highcontrast.svg);
         }
       }
     }
@@ -264,11 +286,6 @@
   }
 
   @media (-moz-windows-default-theme) {
-    #toolbar-menubar:not(:-moz-lwtheme),
-    #TabsToolbar:not(:-moz-lwtheme) {
-      color: black;
-    }
-
     #main-menubar > menu:not(:-moz-lwtheme) {
       color: inherit;
     }
@@ -284,9 +301,8 @@
     }
   }
 
-  #main-window[darkwindowframe="true"] #toolbar-menubar:not(:-moz-lwtheme):not(:-moz-window-inactive),
-  #main-window[darkwindowframe="true"] #TabsToolbar:not(:-moz-lwtheme):not(:-moz-window-inactive) {
-    color: white;
+  :root[darkwindowframe="true"]:not(:-moz-lwtheme):not(:-moz-window-inactive) {
+    --titlebar-text-color: white;
   }
 
   /* Show borders on Win 7 & 8, but not on 10 and later: */

browser/themes/windows/browser.css

@@ -15,6 +15,8 @@
 %include ../shared/browser.inc.css
 
 :root {
+  --titlebar-text-color: inherit;
+
   --space-above-tabbar: 15px;
 
   --toolbarbutton-vertical-text-padding: calc(var(--toolbarbutton-inner-padding) - 1px);
@@ -163,19 +165,22 @@ toolbar[brighttext] {
   transition: min-height 170ms ease-out, max-height 170ms ease-out, visibility 170ms linear;
 }
 
+#toolbar-menubar,
+#TabsToolbar {
+  color: var(--titlebar-text-color);
+}
+
 @media (-moz-windows-compositor: 0),
        (-moz-windows-default-theme: 0) {
   /* Please keep the menu text colors in this media block in sync with
    * compacttheme.css, minus the :not(:-moz-lwtheme) condition - see Bug 1165718.
    */
-  #main-window[tabsintitlebar]:not([inFullscreen]) #toolbar-menubar:not(:-moz-lwtheme),
-  #main-window[tabsintitlebar]:not([inFullscreen]) #TabsToolbar:not(:-moz-lwtheme) {
-    color: CaptionText;
+  :root[tabsintitlebar]:not([inFullscreen]):not(:-moz-lwtheme) {
+    --titlebar-text-color: CaptionText;
   }
 
-  #main-window[tabsintitlebar]:not([inFullscreen]) #toolbar-menubar:not(:-moz-lwtheme):-moz-window-inactive,
-  #main-window[tabsintitlebar]:not([inFullscreen]) #TabsToolbar:not(:-moz-lwtheme):-moz-window-inactive {
-    color: InactiveCaptionText;
+  :root[tabsintitlebar]:not([inFullscreen]):not(:-moz-lwtheme):-moz-window-inactive {
+    --titlebar-text-color: InactiveCaptionText;
   }
 }
 
@@ -510,65 +515,71 @@ menuitem.bookmark-item {
   border: none;
   margin: 0 !important;
   padding: 6px 12px;
+  -moz-context-properties: stroke;
+  stroke: currentColor;
+  color: inherit;
 }
 
 #minimize-button {
-  list-style-image: url(chrome://browser/skin/caption-buttons.svg#minimize);
+  list-style-image: url(chrome://browser/skin/window-controls/minimize.svg);
 }
 
 #restore-button {
-  list-style-image: url(chrome://browser/skin/caption-buttons.svg#restore);
+  list-style-image: url(chrome://browser/skin/window-controls/restore.svg);
 }
 
 #minimize-button:hover,
 #restore-button:hover {
-  background-color: hsla(0, 0%, 0%, .12);
+  background-color: hsla(0,0%,0%,.12);
 }
 
 #minimize-button:hover:active,
 #restore-button:hover:active {
-  background-color: hsla(0, 0%, 0%, .22);
+  background-color: hsla(0,0%,0%,.22);
+}
+
+#TabsToolbar[brighttext] > #window-controls > #minimize-button:hover,
+#TabsToolbar[brighttext] > #window-controls > #restore-button:hover {
+  background-color: hsla(0,0%,100%,.12);
+}
+
+#TabsToolbar[brighttext] > #window-controls > #minimize-button:hover:active,
+#TabsToolbar[brighttext] > #window-controls > #restore-button:hover:active {
+  background-color: hsla(0,0%,100%,.22);
 }
 
 #close-button {
-  list-style-image: url(chrome://browser/skin/caption-buttons.svg#close);
+  list-style-image: url(chrome://browser/skin/window-controls/close.svg);
 }
 
 #close-button:hover {
   background-color: hsl(355, 86%, 49%);
-  list-style-image: url(chrome://browser/skin/caption-buttons.svg#close-white);
+  stroke: white;
 }
 
 #close-button:hover:active {
   background-color: hsl(355, 82%, 69%);
 }
 
-toolbar[brighttext] #minimize-button {
-  list-style-image: url(chrome://browser/skin/caption-buttons.svg#minimize-white);
-}
-
-toolbar[brighttext] #restore-button {
-  list-style-image: url(chrome://browser/skin/caption-buttons.svg#restore-white);
-}
-
-toolbar[brighttext] #close-button {
-  list-style-image: url(chrome://browser/skin/caption-buttons.svg#close-white);
-}
-
 @media (-moz-os-version: windows-win7) {
   #window-controls {
+    -moz-box-align: start;
     margin-inline-start: 4px;
   }
 
   #minimize-button,
   #restore-button,
   #close-button {
+    -moz-appearance: none;
+    border-style: none;
+    margin: 0;
     /* Important to ensure this applies even on toolbar[brighttext] */
     list-style-image: url("chrome://global/skin/icons/windowControls.png") !important;
     /* Also override background color to a avoid hover background styling
      * leaking through around the image. */
     background-color: transparent !important;
     padding: 0;
+    -moz-context-properties: unset;
   }
 
   #minimize-button {
@@ -609,20 +620,6 @@ toolbar[brighttext] #close-button {
   #close-button:hover:active {
     -moz-image-region: rect(32px, 48px, 48px, 32px);
   }
-}
-
-@media (-moz-os-version: windows-win7) {
-  #window-controls {
-    -moz-box-align: start;
-  }
-
-  #minimize-button,
-  #restore-button,
-  #close-button {
-    -moz-appearance: none;
-    border-style: none;
-    margin: 0;
-  }
 
   #close-button {
     -moz-image-region: rect(0, 49px, 16px, 32px);

browser/themes/windows/caption-buttons.svg

@@ -1,100 +0,0 @@
-<!-- This Source Code Form is subject to the terms of the Mozilla Public
-   - License, v. 2.0. If a copy of the MPL was not distributed with this
-   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
-<svg width="12" height="12" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-  <style>
-    g:not(:target) {
-      display: none;
-    }
-    use:target > g {
-      display: initial;
-    }
-
-    g {
-      stroke: ButtonText;
-      stroke-width: 0.9px;
-      fill: none;
-    }
-    g:not([id|="close"]) {
-      shape-rendering: crispEdges;
-    }
-
-    .highcontrast {
-      stroke-width: 1.9px;
-    }
-    .highcontrast-hover > g {
-      stroke: HighlightText;
-    }
-    .white > g {
-      stroke: #fff;
-    }
-    .themes {
-      stroke: #fff;
-      stroke-width: 1.9px;
-    }
-
-    .outer-stroke {
-      stroke: #000;
-      stroke-width: 3.6;
-      opacity: .75;
-    }
-    .restore-background-window {
-      stroke-width: .9;
-    }
-  </style>
-  <g id="close">
-    <path d="M1,1 l 10,10 M1,11 l 10,-10"/>
-  </g>
-  <g id="maximize">
-    <rect x="1.5" y="1.5" width="9" height="9"/>
-  </g>
-  <g id="minimize">
-    <line x1="1" y1="5.5" x2="11" y2="5.5"/>
-  </g>
-  <g id="restore">
-    <rect x="1.5" y="3.5" width="7" height="7"/>
-    <polyline points="3.5,3.5 3.5,1.5 10.5,1.5 10.5,8.5 8.5,8.5"/>
-  </g>
-
-  <use id="close-white" class="white" xlink:href="#close"/>
-  <use id="maximize-white" class="white" xlink:href="#maximize"/>
-  <use id="minimize-white" class="white" xlink:href="#minimize"/>
-  <use id="restore-white" class="white" xlink:href="#restore"/>
-
-  <g id="close-highcontrast" class="highcontrast">
-    <path d="M1,1 l 10,10 M1,11 l 10,-10"/>
-  </g>
-  <g id="maximize-highcontrast" class="highcontrast">
-    <rect x="2" y="2" width="8" height="8"/>
-  </g>
-  <g id="minimize-highcontrast" class="highcontrast">
-    <line x1="1" y1="6" x2="11" y2="6"/>
-  </g>
-  <g id="restore-highcontrast" class="highcontrast">
-    <rect x="2" y="4" width="6" height="6"/>
-    <polyline points="3.5,1.5 10.5,1.5 10.5,8.5" class="restore-background-window"/>
-  </g>
-
-  <use id="close-highcontrast-hover" class="highcontrast-hover" xlink:href="#close-highcontrast"/>
-  <use id="maximize-highcontrast-hover" class="highcontrast-hover" xlink:href="#maximize-highcontrast"/>
-  <use id="minimize-highcontrast-hover" class="highcontrast-hover" xlink:href="#minimize-highcontrast"/>
-  <use id="restore-highcontrast-hover" class="highcontrast-hover" xlink:href="#restore-highcontrast"/>
-
-  <g id="close-themes" class="themes">
-    <path d="M1,1 l 10,10 M1,11 l 10,-10" class="outer-stroke" />
-    <path d="M1.75,1.75 l 8.5,8.5 M1.75,10.25 l 8.5,-8.5"/>
-  </g>
-  <g id="maximize-themes" class="themes">
-    <rect x="2" y="2" width="8" height="8" class="outer-stroke"/>
-    <rect x="2" y="2" width="8" height="8"/>
-  </g>
-  <g id="minimize-themes" class="themes">
-    <line x1="0" y1="6" x2="12" y2="6" class="outer-stroke"/>
-    <line x1="1" y1="6" x2="11" y2="6"/>
-  </g>
-  <g id="restore-themes" class="themes">
-    <path d="M2,4 l 6,0 l 0,6 l -6,0z M2.5,1.5 l 8,0 l 0,8" class="outer-stroke"/>
-    <rect x="2" y="4" width="6" height="6"/>
-    <polyline points="3.5,1.5 10.5,1.5 10.5,8.5" class="restore-background-window"/>
-  </g>
-</svg>

browser/themes/windows/compacttheme.css

@@ -145,14 +145,12 @@
   /* Use proper menu text styling in Win7 classic mode (copied from browser.css) */
   @media (-moz-windows-compositor: 0),
          (-moz-windows-default-theme: 0) {
-    #main-window[tabsintitlebar]:not([inFullscreen]) #toolbar-menubar,
-    #main-window[tabsintitlebar]:not([inFullscreen]) #TabsToolbar {
-      color: CaptionText;
+    :root[tabsintitlebar]:not([inFullscreen]) {
+      --titlebar-text-color: CaptionText;
     }
 
-    #main-window[tabsintitlebar]:not([inFullscreen]) #toolbar-menubar:-moz-window-inactive,
-    #main-window[tabsintitlebar]:not([inFullscreen]) #TabsToolbar:-moz-window-inactive {
-      color: InactiveCaptionText;
+    :root[tabsintitlebar]:not([inFullscreen]):-moz-window-inactive {
+      --titlebar-text-color: InactiveCaptionText;
     }
 
     #main-window[tabsintitlebar] #main-menubar > menu {
@@ -224,35 +222,21 @@
     padding-right: 15px;
   }
 
-  /* Force white caption buttons for the dark theme on Windows 10 */
-  #titlebar-min:-moz-lwtheme-brighttext {
-    list-style-image: url(chrome://browser/skin/caption-buttons.svg#minimize-white);
+  .titlebar-button:-moz-lwtheme {
+    -moz-context-properties: stroke;
+    stroke: currentColor;
   }
-  #titlebar-max:-moz-lwtheme-brighttext {
-    list-style-image: url(chrome://browser/skin/caption-buttons.svg#maximize-white);
+  #titlebar-min:-moz-lwtheme {
+    list-style-image: url(chrome://browser/skin/window-controls/minimize.svg);
   }
-  #main-window[sizemode="maximized"] #titlebar-max:-moz-lwtheme-brighttext {
-    list-style-image: url(chrome://browser/skin/caption-buttons.svg#restore-white);
+  #titlebar-max:-moz-lwtheme {
+    list-style-image: url(chrome://browser/skin/window-controls/maximize.svg);
   }
-  #titlebar-close:-moz-lwtheme-brighttext {
-    list-style-image: url(chrome://browser/skin/caption-buttons.svg#close-white);
+  :root[sizemode="maximized"] #titlebar-max:-moz-lwtheme {
+    list-style-image: url(chrome://browser/skin/window-controls/restore.svg);
   }
-
-  /* ... and normal ones for the light theme on Windows 10 */
-  #titlebar-min:-moz-lwtheme-darktext {
-    list-style-image: url(chrome://browser/skin/caption-buttons.svg#minimize);
-  }
-  #titlebar-max:-moz-lwtheme-darktext {
-    list-style-image: url(chrome://browser/skin/caption-buttons.svg#maximize);
-  }
-  #main-window[sizemode="maximized"] #titlebar-max:-moz-lwtheme-darktext {
-    list-style-image: url(chrome://browser/skin/caption-buttons.svg#restore);
-  }
-  #titlebar-close:-moz-lwtheme-darktext {
-    list-style-image: url(chrome://browser/skin/caption-buttons.svg#close);
-  }
-  #titlebar-close:-moz-lwtheme-darktext:hover {
-    list-style-image: url(chrome://browser/skin/caption-buttons.svg#close-white);
+  #titlebar-close:-moz-lwtheme {
+    list-style-image: url(chrome://browser/skin/window-controls/close.svg);
   }
 }
 

browser/themes/windows/jar.mn

@@ -10,7 +10,6 @@ browser.jar:
 * skin/classic/browser/syncedtabs/sidebar.css     (syncedtabs/sidebar.css)
 * skin/classic/browser/browser.css
 * skin/classic/browser/compacttheme.css
-  skin/classic/browser/caption-buttons.svg
   skin/classic/browser/Info.png
   skin/classic/browser/livemark-folder.png
   skin/classic/browser/menu-back.png
@@ -37,6 +36,16 @@ browser.jar:
   skin/classic/browser/searchbar.css
   skin/classic/browser/setDesktopBackground.css
   skin/classic/browser/slowStartup-16.png
+  skin/classic/browser/sync-desktopIcon.svg  (../shared/sync-desktopIcon.svg)
+  skin/classic/browser/sync-horizontalbar.png
+  skin/classic/browser/sync-horizontalbar@2x.png
+  skin/classic/browser/sync-horizontalbar-win7.png
+  skin/classic/browser/sync-horizontalbar-win7@2x.png
+  skin/classic/browser/sync-mobileIcon.svg  (../shared/sync-mobileIcon.svg)
+  skin/classic/browser/syncProgress-horizontalbar.png
+  skin/classic/browser/syncProgress-horizontalbar@2x.png
+  skin/classic/browser/syncProgress-horizontalbar-win7.png
+  skin/classic/browser/syncProgress-horizontalbar-win7@2x.png
   skin/classic/browser/toolbarbutton-dropdown-arrow-win7.png
   skin/classic/browser/urlbar-popup-blocked.png
   skin/classic/browser/urlbar-history-dropmarker.png
@@ -122,16 +131,18 @@ browser.jar:
   skin/classic/browser/tabbrowser/tab-stroke-start.png         (tabbrowser/tab-stroke-start.png)
   skin/classic/browser/tabbrowser/tab-stroke-start@2x.png      (tabbrowser/tab-stroke-start@2x.png)
   skin/classic/browser/tabbrowser/tabDragIndicator.png         (tabbrowser/tabDragIndicator.png)
-  skin/classic/browser/sync-desktopIcon.svg  (../shared/sync-desktopIcon.svg)
-  skin/classic/browser/sync-horizontalbar.png
-  skin/classic/browser/sync-horizontalbar@2x.png
-  skin/classic/browser/sync-horizontalbar-win7.png
-  skin/classic/browser/sync-horizontalbar-win7@2x.png
-  skin/classic/browser/sync-mobileIcon.svg  (../shared/sync-mobileIcon.svg)
-  skin/classic/browser/syncProgress-horizontalbar.png
-  skin/classic/browser/syncProgress-horizontalbar@2x.png
-  skin/classic/browser/syncProgress-horizontalbar-win7.png
-  skin/classic/browser/syncProgress-horizontalbar-win7@2x.png
+  skin/classic/browser/window-controls/close.svg                 (window-controls/close.svg)
+  skin/classic/browser/window-controls/close-highcontrast.svg    (window-controls/close-highcontrast.svg)
+  skin/classic/browser/window-controls/close-themes.svg          (window-controls/close-themes.svg)
+  skin/classic/browser/window-controls/maximize.svg              (window-controls/maximize.svg)
+  skin/classic/browser/window-controls/maximize-highcontrast.svg (window-controls/maximize-highcontrast.svg)
+  skin/classic/browser/window-controls/maximize-themes.svg       (window-controls/maximize-themes.svg)
+  skin/classic/browser/window-controls/minimize.svg              (window-controls/minimize.svg)
+  skin/classic/browser/window-controls/minimize-highcontrast.svg (window-controls/minimize-highcontrast.svg)
+  skin/classic/browser/window-controls/minimize-themes.svg       (window-controls/minimize-themes.svg)
+  skin/classic/browser/window-controls/restore.svg               (window-controls/restore.svg)
+  skin/classic/browser/window-controls/restore-highcontrast.svg  (window-controls/restore-highcontrast.svg)
+  skin/classic/browser/window-controls/restore-themes.svg        (window-controls/restore-themes.svg)
 
 #ifdef E10S_TESTING_ONLY
   skin/classic/browser/e10s-64@2x.png (../shared/e10s-64@2x.png)

browser/themes/windows/window-controls/close-highcontrast.svg

@@ -0,0 +1,6 @@
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+<svg width="12" height="12" xmlns="http://www.w3.org/2000/svg">
+  <path stroke="context-stroke" stroke-width="1.9" fill="none" d="M1,1 l 10,10 M1,11 l 10,-10"/>
+</svg>

browser/themes/windows/window-controls/close-themes.svg

@@ -0,0 +1,7 @@
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+<svg width="12" height="12" xmlns="http://www.w3.org/2000/svg">
+  <path stroke="black" stroke-width="3.6" stroke-opacity=".75" d="M1,1 l 10,10 M1,11 l 10,-10"/>
+  <path stroke="white" stroke-width="1.9" d="M1.75,1.75 l 8.5,8.5 M1.75,10.25 l 8.5,-8.5"/>
+</svg>

browser/themes/windows/window-controls/close.svg

@@ -0,0 +1,6 @@
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+<svg width="12" height="12" xmlns="http://www.w3.org/2000/svg">
+  <path stroke="context-stroke" stroke-width=".9" fill="none" d="M1,1 l 10,10 M1,11 l 10,-10"/>
+</svg>

browser/themes/windows/window-controls/maximize-highcontrast.svg

@@ -0,0 +1,6 @@
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+<svg width="12" height="12" xmlns="http://www.w3.org/2000/svg" shape-rendering="crispEdges">
+  <rect stroke="context-stroke" stroke-width="1.9" fill="none" x="2" y="2" width="8" height="8"/>
+</svg>

browser/themes/windows/window-controls/maximize-themes.svg

@@ -0,0 +1,7 @@
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+<svg width="12" height="12" xmlns="http://www.w3.org/2000/svg" shape-rendering="crispEdges" fill="none">
+  <rect stroke="black" stroke-width="3.6" stroke-opacity=".75" x="2" y="2" width="8" height="8"/>
+  <rect stroke="white" stroke-width="1.9" x="2" y="2" width="8" height="8"/>
+</svg>

browser/themes/windows/window-controls/maximize.svg

@@ -0,0 +1,6 @@
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+<svg width="12" height="12" xmlns="http://www.w3.org/2000/svg" shape-rendering="crispEdges">
+  <rect stroke="context-stroke" stroke-width=".9" fill="none" x="1.5" y="1.5" width="9" height="9"/>
+</svg>

browser/themes/windows/window-controls/minimize-highcontrast.svg

@@ -0,0 +1,6 @@
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+<svg width="12" height="12" xmlns="http://www.w3.org/2000/svg">
+  <line stroke="context-stroke" stroke-width="1.9" fill="none" shape-rendering="crispEdges" x1="1" y1="6" x2="11" y2="6"/>
+</svg>

browser/themes/windows/window-controls/minimize-themes.svg

@@ -0,0 +1,7 @@
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+<svg width="12" height="12" xmlns="http://www.w3.org/2000/svg" shape-rendering="crispEdges">
+  <line stroke="black" stroke-width="3.6" stroke-opacity=".75" x1="0" y1="6" x2="12" y2="6"/>
+  <line stroke="white" stroke-width="1.9" x1="1" y1="6" x2="11" y2="6"/>
+</svg>

browser/themes/windows/window-controls/minimize.svg

@@ -0,0 +1,6 @@
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+<svg width="12" height="12" xmlns="http://www.w3.org/2000/svg">
+  <line stroke="context-stroke" stroke-width=".9" fill="none" shape-rendering="crispEdges" x1="1" y1="5.5" x2="11" y2="5.5"/>
+</svg>

browser/themes/windows/window-controls/restore-highcontrast.svg

@@ -0,0 +1,7 @@
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+<svg width="12" height="12" xmlns="http://www.w3.org/2000/svg" stroke="context-stroke" stroke-width="1.9" fill="none" shape-rendering="crispEdges">
+  <rect x="2" y="4" width="6" height="6"/>
+  <polyline points="3.5,1.5 10.5,1.5 10.5,8.5" stroke-width=".9"/>
+</svg>

browser/themes/windows/window-controls/restore-themes.svg

@@ -0,0 +1,8 @@
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+<svg width="12" height="12" xmlns="http://www.w3.org/2000/svg" shape-rendering="crispEdges" fill="none" stroke="white">
+  <path stroke="black" stroke-width="3.6" stroke-opacity=".75" d="M2,4 l 6,0 l 0,6 l -6,0z M2.5,1.5 l 8,0 l 0,8"/>
+  <rect stroke-width="1.9" x="2" y="4" width="6" height="6"/>
+  <polyline stroke-width=".9" points="3.5,1.5 10.5,1.5 10.5,8.5"/>
+</svg>

browser/themes/windows/window-controls/restore.svg

@@ -0,0 +1,7 @@
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+<svg width="12" height="12" xmlns="http://www.w3.org/2000/svg" stroke="context-stroke" stroke-width=".9" fill="none" shape-rendering="crispEdges">
+  <rect x="1.5" y="3.5" width="7" height="7"/>
+  <polyline points="3.5,3.5 3.5,1.5 10.5,1.5 10.5,8.5 8.5,8.5"/>
+</svg>