Bug 1354123 - remove customize mode transition, r=jaws

MozReview-Commit-ID: 7j9HWxci7oB

--HG--
extra : rebase_source : 75cbd832c8e0c8138457c47d1c8fff73c8cb3f56

browser/base/content/browser.css

@@ -18,7 +18,11 @@
   color: var(--lwt-text-color) !important;
 }
 
+%ifndef MOZ_PHOTON_THEME
 :root:-moz-lwtheme:not([customization-lwtheme]) {
+%else
+:root:-moz-lwtheme {
+%endif
   background-color: var(--lwt-accent-color) !important;
   background-image: var(--lwt-header-image), var(--lwt-additional-images) !important;
   background-position: var(--lwt-background-alignment) !important;
@@ -1184,6 +1188,7 @@ toolbarpaletteitem[place="palette"] > #downloads-button[indicator] > #downloads-
 %endif
 
 /* Customize mode */
+%ifndef MOZ_PHOTON_THEME
 #navigator-toolbox,
 #browser-bottombox,
 #content-deck {
@@ -1197,6 +1202,7 @@ toolbarpaletteitem[place="palette"] > #downloads-button[indicator] > #downloads-
   transition-duration: 1ms;
   transition-timing-function: linear;
 }
+%endif
 
 #PanelUI-contents > .panel-customization-placeholder > .panel-customization-placeholder-child {
   list-style-image: none;

browser/base/content/tabbrowser.xml

@@ -6063,11 +6063,11 @@
       </method>
 
       <property name="_isCustomizing" readonly="true">
-        <getter>
+        <getter><![CDATA[
           let root = document.documentElement;
           return root.getAttribute("customizing") == "true" ||
-                 root.getAttribute("customize-exiting") == "true";
+                 (!AppConstants.MOZ_PHOTON_THEME && root.getAttribute("customize-exiting") == "true");
-        </getter>
+        ]]></getter>
       </property>
 
       <method name="_setPositionalAttributes">

browser/components/customizableui/CustomizeMode.jsm

@@ -332,9 +332,11 @@ CustomizeMode.prototype = {
         this.visiblePalette.hidden = true;
         this.visiblePalette.removeAttribute("showing");
 
-        // Disable the button-text fade-out mask
+        if (!AppConstants.MOZ_PHOTON_THEME) {
-        // during the transition for increased perf.
+          // Disable the button-text fade-out mask
-        window.PanelUI.contents.setAttribute("customize-transitioning", "true");
+          // during the transition for increased perf.
+          window.PanelUI.contents.setAttribute("customize-transitioning", "true");
+        }
 
         // Move the mainView in the panel to the holder so that we can see it
         // while customizing.
@@ -636,6 +638,17 @@ CustomizeMode.prototype = {
    * excluding certain styles while in any phase of customize mode.
    */
   _doTransition(aEntering) {
+    if (AppConstants.MOZ_PHOTON_THEME) {
+      let docEl = this.document.documentElement;
+      if (aEntering) {
+        docEl.setAttribute("customizing", true);
+        docEl.setAttribute("customize-entered", true);
+      } else {
+        docEl.removeAttribute("customizing");
+        docEl.removeAttribute("customize-entered");
+      }
+      return Promise.resolve();
+    }
     let deck = this.document.getElementById("content-deck");
     let customizeTransitionEndPromise = new Promise(resolve => {
       let customizeTransitionEnd = (aEvent) => {

browser/themes/linux/browser.css

@@ -1181,6 +1181,7 @@ notification.pluginVulnerable > .notification-inner > .messageCloseButton:not(:h
 
 %include ../shared/customizableui/customizeMode.inc.css
 
+%ifndef MOZ_PHOTON_THEME
 #main-window[customize-entered] > #tab-view-deck {
   background-image: url("chrome://browser/skin/customizableui/customizeMode-gridTexture.png"),
                     linear-gradient(to bottom, #bcbcbc, #b5b5b5);
@@ -1220,6 +1221,7 @@ notification.pluginVulnerable > .notification-inner > .messageCloseButton:not(:h
   border-right: 3px solid transparent;
   border-left: 3px solid transparent;
 }
+%endif
 
 /* The :hover:active style from toolkit doesn't seem to work in this panel so just use :active. */
 .customization-tipPanel-closeBox > .close-icon:active {
@@ -1288,4 +1290,4 @@ notification.pluginVulnerable > .notification-inner > .messageCloseButton:not(:h
 /* Prevent movement in the restore-tabs-button when it's clicked. */
 .restore-tabs-button:hover:active:not([disabled="true"]) {
   padding: 3px;
-}
+}

browser/themes/linux/jar.mn

@@ -32,9 +32,9 @@ browser.jar:
   skin/classic/browser/Toolbar-small.png
   skin/classic/browser/webRTC-indicator.css  (../shared/webRTC-indicator.css)
 * skin/classic/browser/controlcenter/panel.css        (controlcenter/panel.css)
+#ifndef MOZ_PHOTON_THEME
   skin/classic/browser/customizableui/background-noise-toolbar.png  (customizableui/background-noise-toolbar.png)
   skin/classic/browser/customizableui/customizeMode-gridTexture.png  (customizableui/customizeMode-gridTexture.png)
-#ifndef MOZ_PHOTON_THEME
   skin/classic/browser/customizableui/customizeMode-separatorHorizontal.png  (customizableui/customizeMode-separatorHorizontal.png)
   skin/classic/browser/customizableui/customizeMode-separatorVertical.png  (customizableui/customizeMode-separatorVertical.png)
 #endif

browser/themes/osx/browser.css

@@ -2143,6 +2143,7 @@ html|*.addon-webext-perm-list {
 
 %include ../shared/customizableui/customizeMode.inc.css
 
+%ifndef MOZ_PHOTON_THEME
 #main-window[customizing] {
   background-color: rgb(178,178,178);
 }
@@ -2206,6 +2207,7 @@ html|*.addon-webext-perm-list {
   border-right: 3px solid transparent;
   border-left: 3px solid transparent;
 }
+%endif
 
 %ifndef MOZ_PHOTON_THEME
 @media (min-resolution: 2dppx) {

browser/themes/osx/jar.mn

@@ -50,9 +50,9 @@ browser.jar:
   skin/classic/browser/webRTC-sharingScreen-menubar@2x.png
   skin/classic/browser/webRTC-indicator.css
 * skin/classic/browser/controlcenter/panel.css        (controlcenter/panel.css)
+#ifndef MOZ_PHOTON_THEME
   skin/classic/browser/customizableui/background-noise-toolbar.png  (customizableui/background-noise-toolbar.png)
   skin/classic/browser/customizableui/customizeMode-gridTexture.png  (customizableui/customizeMode-gridTexture.png)
-#ifndef MOZ_PHOTON_THEME
   skin/classic/browser/customizableui/customizeMode-separatorHorizontal.png  (customizableui/customizeMode-separatorHorizontal.png)
   skin/classic/browser/customizableui/customizeMode-separatorVertical.png  (customizableui/customizeMode-separatorVertical.png)
 #endif

browser/themes/shared/customizableui/customizeMode.inc.css

@@ -8,6 +8,7 @@
   --drag-drop-transition-duration: .3s;
 }
 
+%ifndef MOZ_PHOTON_THEME
 #main-window[customization-lwtheme] #tab-view-deck:-moz-lwtheme {
   background-repeat: no-repeat;
   background-position: right top;
@@ -39,7 +40,6 @@
   pointer-events: none;
 }
 
-%ifndef MOZ_PHOTON_THEME
 #main-window[customize-entered] .customization-target:not(:-moz-any(#PanelUI-contents, #TabsToolbar, #toolbar-menubar))::before,
 #PanelUI-contents > .panel-customization-placeholder {
   -moz-outline-radius: 2.5px;

browser/themes/windows/browser.css

@@ -1838,6 +1838,7 @@ notification.pluginVulnerable > .notification-inner > .messageCloseButton {
   transform: perspective(0.01px);
 }
 
+%ifndef MOZ_PHOTON_THEME
 #main-window[customize-entered] > #tab-view-deck {
   background-image: url("chrome://browser/skin/customizableui/customizeMode-gridTexture.png");
   background-attachment: fixed;
@@ -1860,6 +1861,7 @@ notification.pluginVulnerable > .notification-inner > .messageCloseButton {
 #main-window[customize-entered] #browser-bottombox {
   border-bottom: 1px solid @toolbarShadowColor@;
 }
+%endif
 
 #customization-tipPanel > .panel-arrowcontainer > .panel-arrowbox > .panel-arrow[side="left"] {
   margin-right: -2px;

browser/themes/windows/jar.mn

@@ -54,8 +54,8 @@ browser.jar:
   skin/classic/browser/urlbar-history-dropmarker-win7@2x.png
   skin/classic/browser/webRTC-indicator.css  (../shared/webRTC-indicator.css)
 * skin/classic/browser/controlcenter/panel.css                 (controlcenter/panel.css)
-  skin/classic/browser/customizableui/customizeMode-gridTexture.png  (customizableui/customizeMode-gridTexture.png)
 #ifndef MOZ_PHOTON_THEME
+  skin/classic/browser/customizableui/customizeMode-gridTexture.png  (customizableui/customizeMode-gridTexture.png)
   skin/classic/browser/customizableui/background-noise-toolbar.png  (customizableui/background-noise-toolbar.png)
   skin/classic/browser/customizableui/customizeMode-separatorHorizontal.png  (customizableui/customizeMode-separatorHorizontal.png)
   skin/classic/browser/customizableui/customizeMode-separatorVertical.png  (customizableui/customizeMode-separatorVertical.png)