Bug 1624865 - Scope wizard.css to wizard custom element. r=dao
☠☠ backed out by 29024ee1f5a7 ☠ ☠
authorTim Nguyen <ntim.bugs@gmail.com>
Thu, 26 Mar 2020 13:27:01 +0000
changeset 520563 e14ac21fde645d0ac4b1fa6b8ab22cc435d57bb4
parent 520562 a9b28758785e257fb36018a74b4d1601a94ec8ec
child 520564 87629187715d643d83b7fcbd01bf27ba5a18d99a
push id37253
push usernerli@mozilla.com
push dateThu, 26 Mar 2020 21:36:52 +0000
treeherdermozilla-central@c644dd16e2cc [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersdao
bugs1624865
milestone76.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1624865 - Scope wizard.css to wizard custom element. r=dao Differential Revision: https://phabricator.services.mozilla.com/D68205
toolkit/content/widgets.css
toolkit/content/widgets/wizard.js
toolkit/themes/osx/global/wizard.css
toolkit/themes/windows/global/wizard.css
--- a/toolkit/content/widgets.css
+++ b/toolkit/content/widgets.css
@@ -22,9 +22,8 @@
 @import url("chrome://global/skin/richlistbox.css");
 @import url("chrome://global/skin/scrollbox.css");
 @import url("chrome://global/skin/splitter.css");
 @import url("chrome://global/skin/tabbox.css");
 @import url("chrome://global/skin/textbox.css");
 @import url("chrome://global/skin/toolbar.css");
 @import url("chrome://global/skin/toolbarbutton.css");
 @import url("chrome://global/skin/tree.css");
-@import url("chrome://global/skin/wizard.css");
--- a/toolkit/content/widgets/wizard.js
+++ b/toolkit/content/widgets/wizard.js
@@ -54,24 +54,29 @@
             !event.defaultPrevented
           ) {
             this.cancel();
           }
         },
         { mozSystemGroup: true }
       );
 
+      /*
+        XXX(ntim): We import button.css here for the wizard-buttons children
+        This won't be needed after bug 1624888.
+      */
       this.attachShadow({ mode: "open" }).appendChild(
         MozXULElement.parseXULToFragment(`
-        <html:link rel="stylesheet" href="chrome://global/content/widgets.css" />
+        <html:link rel="stylesheet" href="chrome://global/skin/button.css"/>
+        <html:link rel="stylesheet" href="chrome://global/skin/wizard.css"/>
         <hbox class="wizard-header"></hbox>
         <deck class="wizard-page-box" flex="1">
-          <slot xmlns="http://www.w3.org/1999/xhtml" name="wizardpage"></slot>
+          <html:slot name="wizardpage"/>
         </deck>
-        <slot xmlns="http://www.w3.org/1999/xhtml"></slot>
+        <html:slot/>
         <wizard-buttons class="wizard-buttons"></wizard-buttons>
     `)
       );
       this.initializeAttributeInheritance();
 
       this._deck = this.shadowRoot.querySelector(".wizard-page-box");
       this._wizardButtons = this.shadowRoot.querySelector(".wizard-buttons");
 
--- a/toolkit/themes/osx/global/wizard.css
+++ b/toolkit/themes/osx/global/wizard.css
@@ -1,15 +1,15 @@
 /* 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/. */
 
 @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
 
-wizard {
+:host {
   padding: 14px;
 }
 
 .wizard-header {
   -moz-appearance: dialog;
 }
 
 .wizard-header-box-1 {
@@ -23,23 +23,21 @@ wizard {
 }
 
 .wizard-header-label {
   margin-left: 23px;
   font-weight: bold;
 }
 
 .wizard-header-box-icon {
-  margin-top: 3px;
-  margin-inline-end: 20px;
-  margin-bottom: 0;
-  margin-inline-start: 3px;
+  margin-block: 3px 0;
+  margin-inline: 3px 20px;
 }
 
-wizard[branded="true"] .wizard-header-icon {
+:host([branded="true"]) .wizard-header-icon {
   list-style-image: url("chrome://branding/content/icon48.png");
 }
 
 .wizard-page-box {
   padding: 15px 23px;
   -moz-appearance: dialog;
 }
 
--- a/toolkit/themes/windows/global/wizard.css
+++ b/toolkit/themes/windows/global/wizard.css
@@ -6,49 +6,49 @@
 
 .wizard-header {
   border-bottom: 2px groove ThreeDFace;
   background-color: Window;
   color: WindowText;
 }
 
 .wizard-header-box-1 {
-  padding: 5px 0px 5px 0px;
+  padding: 5px 0;
 }
 
-wizard[description=""] .wizard-header-description {
+:host([description=""]) .wizard-header-description {
   display: none;
 }
 
 .wizard-header-label {
   margin-inline-start: 23px;
   font-weight: bold;
 }
 
 .wizard-header-description {
   margin-inline-start: 44px;
 }
 
-wizard[branded="true"] .wizard-header-icon {
+:host([branded="true"]) .wizard-header-icon {
   list-style-image: url("chrome://branding/content/icon48.png");
   margin-inline-end: 5px;
 }
 
 .wizard-page-box {
   margin: 10px 44px;
 }
 
 .wizard-buttons-separator {
-  margin-bottom: 0px !important;
+  margin-bottom: 0 !important;
 }
 
 .wizard-buttons-box-2 {
   margin: 10px;
 }
 
 .wizard-button[dlgtype="finish"],
 .wizard-button[dlgtype="next"] {
-  margin-inline-start: 0px !important;
+  margin-inline-start: 0 !important;
 }
 
 .wizard-button[dlgtype="back"] {
-  margin-inline-end: 0px !important;
+  margin-inline-end: 0 !important;
 }