From 4baf44ac0a8a2b576366e1c2b7c3feb8c4c5b53a Mon Sep 17 00:00:00 2001
From: Paolo Amadini <paolo.mozmail@amadzone.org>
Date: Mon, 9 Jul 2018 10:09:17 +0100
Subject: [PATCH] Bug 1473910 - Load "tabprompts.css" as a document stylesheet
 in the browser window. r=dao

MozReview-Commit-ID: HEf70HtNiqQ

--HG--
extra : rebase_source : 4dc8ed5df577ada11c8d683726b5c2406905e09b
extra : amend_source : 656638d883630032c24a2eeec595e3aa639a3c87
---
 browser/base/content/browser.xul                 |  6 ++++++
 .../components/prompts/content/tabprompts.css    |  4 ++--
 .../components/prompts/content/tabprompts.xml    | 12 +++---------
 toolkit/themes/osx/global/tabprompts.css         | 16 ++++++++--------
 toolkit/themes/windows/global/tabprompts.css     |  6 +++---
 5 files changed, 22 insertions(+), 22 deletions(-)

diff --git a/browser/base/content/browser.xul b/browser/base/content/browser.xul
index 29f75f015b69..4f8dd6d00e8b 100644
--- a/browser/base/content/browser.xul
+++ b/browser/base/content/browser.xul
@@ -11,6 +11,12 @@
      both "content" and "skin" packages, which bug 1385444 will unify later. -->
 <?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
 
+<!-- While these stylesheets are defined in Toolkit, they are only used in the
+     main browser window, so we can load them here. Bug 1474241 is on file to
+     consider moving these widgets to the "browser" folder. -->
+<?xml-stylesheet href="chrome://global/content/tabprompts.css" type="text/css"?>
+<?xml-stylesheet href="chrome://global/skin/tabprompts.css" type="text/css"?>
+
 <?xml-stylesheet href="chrome://browser/content/browser.css" type="text/css"?>
 <?xml-stylesheet href="chrome://browser/content/tabbrowser.css" type="text/css"?>
 <?xml-stylesheet href="chrome://browser/content/downloads/downloads.css" type="text/css"?>
diff --git a/toolkit/components/prompts/content/tabprompts.css b/toolkit/components/prompts/content/tabprompts.css
index 33dfc163ccad..59f0fee546e7 100644
--- a/toolkit/components/prompts/content/tabprompts.css
+++ b/toolkit/components/prompts/content/tabprompts.css
@@ -10,7 +10,7 @@ tabmodalprompt {
   -moz-box-orient: vertical;
 }
 
-.mainContainer {
+.tabmodalprompt-mainContainer {
   min-width: 20em;
   min-height: 12em;
   -moz-user-focus: normal;
@@ -30,6 +30,6 @@ tabmodalprompt {
   unicode-bidi: plaintext;
 }
 
-label[value=""] {
+tabmodalprompt label[value=""] {
   visibility: collapse;
 }
diff --git a/toolkit/components/prompts/content/tabprompts.xml b/toolkit/components/prompts/content/tabprompts.xml
index 91507589d2d1..09aa8552a323 100644
--- a/toolkit/components/prompts/content/tabprompts.xml
+++ b/toolkit/components/prompts/content/tabprompts.xml
@@ -19,12 +19,6 @@
    xmlns:xbl="http://www.mozilla.org/xbl">
 
   <binding id="tabmodalprompt">
-
-    <resources>
-        <stylesheet src="chrome://global/content/tabprompts.css"/>
-        <stylesheet src="chrome://global/skin/tabprompts.css"/>
-    </resources>
-
     <xbl:content xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
                  role="dialog"
                  aria-describedby="infoBody">
@@ -32,8 +26,8 @@
         <!-- This is based on the guts of commonDialog.xul -->
         <spacer flex="1"/>
         <hbox pack="center">
-            <vbox anonid="mainContainer" class="mainContainer">
-                <grid class="topContainer" flex="1">
+            <vbox anonid="mainContainer" class="tabmodalprompt-mainContainer">
+                <grid class="tabmodalprompt-topContainer" flex="1">
                     <columns>
                         <column/>
                         <column flex="1"/>
@@ -64,7 +58,7 @@
                     </rows>
                 </grid>
                 <xbl:children/>
-                <hbox class="buttonContainer">
+                <hbox class="tabmodalprompt-buttonContainer">
 #ifdef XP_UNIX
                     <button anonid="button3" hidden="true"/>
                     <button anonid="button2" hidden="true"/>
diff --git a/toolkit/themes/osx/global/tabprompts.css b/toolkit/themes/osx/global/tabprompts.css
index 7d1b141a9c90..fcced28e7fa4 100644
--- a/toolkit/themes/osx/global/tabprompts.css
+++ b/toolkit/themes/osx/global/tabprompts.css
@@ -9,7 +9,7 @@ tabmodalprompt {
   font-size: 110%;
 }
 
-.mainContainer {
+.tabmodalprompt-mainContainer {
   color: black;
   background-color: hsla(0,0%,100%,.95);
   background-clip: padding-box;
@@ -17,17 +17,17 @@ tabmodalprompt {
   border: 1px solid hsla(0,0%,0%,.5);
 }
 
-.topContainer {
+.tabmodalprompt-topContainer {
   padding: 20px;
 }
 
-.buttonContainer {
+.tabmodalprompt-buttonContainer {
   padding: 12px 20px 15px;
   background-color: hsla(0,0%,0%,.05);
   border-top: 1px solid hsla(0,0%,0%,.05);
 }
 
-button {
+.tabmodalprompt-buttonContainer > button {
   -moz-appearance: none;
   padding: 2px 0;
   margin: 0;
@@ -43,21 +43,21 @@ button {
               0 1px 2px hsla(0,0%,0%,.1);
 }
 
-button[default=true] {
+.tabmodalprompt-buttonContainer > button[default=true] {
   background-color: hsl(0,0%,79%);
 }
 
-button:hover {
+.tabmodalprompt-buttonContainer > button:hover {
   background-color: hsl(0,0%,96%);
 }
 
-button:hover:active {
+.tabmodalprompt-buttonContainer > button:hover:active {
   background-image: linear-gradient(hsla(0,0%,100%,.2), transparent);
   background-color: hsl(0,0%,70%);
   box-shadow: 0 1px 0 hsla(0,0%,100%,.2) inset,
               0 1px 3px hsla(0,0%,0%,.2);
 }
 
-button:focus {
+.tabmodalprompt-buttonContainer > button:focus {
   box-shadow: var(--focus-ring-box-shadow)
 }
diff --git a/toolkit/themes/windows/global/tabprompts.css b/toolkit/themes/windows/global/tabprompts.css
index 34873ad4c990..b7a395680579 100644
--- a/toolkit/themes/windows/global/tabprompts.css
+++ b/toolkit/themes/windows/global/tabprompts.css
@@ -8,18 +8,18 @@ tabmodalprompt {
   font-family: sans-serif; /* use content font not system UI font */
 }
 
-.mainContainer {
+.tabmodalprompt-mainContainer {
   color: -moz-fieldText;
   background-color: -moz-field;
   border-radius: 2px;
   border: 1px solid threeDDarkShadow;
 }
 
-.topContainer {
+.tabmodalprompt-topContainer {
   padding: 20px;
 }
 
-.buttonContainer {
+.tabmodalprompt-buttonContainer {
   padding: 12px 20px 15px;
   background-color: hsla(0,0%,0%,.05);
   border-top: 1px solid hsla(0,0%,0%,.05);