Bug 1473927 - Load textbox.css and numberbox.css as document stylesheets. r=paolo
☠☠ backed out by 300994021360 ☠ ☠
authorDão Gottwald <dao@mozilla.com>
Mon, 08 Oct 2018 19:47:56 +0200
changeset 495839 82b600b76a387c9740bfc88195c01fa2ec7d0163
parent 495838 ee7654dbc546241723d810176f476d0a74fc5c9b
child 495840 63a27bd95ecf32de88ec20328adf7ee2b8f11cfe
push id9984
push userffxbld-merge
push dateMon, 15 Oct 2018 21:07:35 +0000
treeherdermozilla-beta@183d27ea8570 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewerspaolo
bugs1473927
milestone64.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 1473927 - Load textbox.css and numberbox.css as document stylesheets. r=paolo
editor/reftests/xul/input.css
toolkit/content/jar.mn
toolkit/content/moz.build
toolkit/content/textbox.css
toolkit/content/widgets.css
toolkit/content/widgets/numberbox.xml
toolkit/content/widgets/textbox.xml
toolkit/content/xul.css
toolkit/themes/linux/global/textbox.css
toolkit/themes/osx/global/in-content/common.css
toolkit/themes/osx/global/textbox.css
toolkit/themes/shared/in-content/common.inc.css
toolkit/themes/windows/global/textbox.css
--- a/editor/reftests/xul/input.css
+++ b/editor/reftests/xul/input.css
@@ -3,30 +3,33 @@
 
 :root > html|input,
 :root > html|textarea {
   margin: 2px 4px;
   padding: 2px 2px 3px;
   padding-inline-start: 5px;
 }
 
-#mac html|input, #mac html|textarea {
+#mac > html|input,
+#mac > html|textarea {
   margin: 4px;
   padding: 0 1px;
 }
 
-textbox[multiline="true"], html|textarea {
+textbox[multiline="true"],
+html|textarea {
   border: none !important;
   -moz-appearance: none !important;
   background-color: white !important;
   border-top-right-radius: 0;
   border-bottom-left-radius: 0;
 }
 
-html|input, html|textarea {
+html|input,
+html|textarea {
   font: inherit;
 }
 
 html|input.empty {
   color: graytext;
 }
 
 @media (-moz-windows-default-theme) and (-moz-os-version: windows-win7) {
--- a/toolkit/content/jar.mn
+++ b/toolkit/content/jar.mn
@@ -1,15 +1,14 @@
 toolkit.jar:
 %  content global %content/global/ contentaccessible=yes
 *  content/global/license.html
    content/global/minimal-xul.css
 *  content/global/xul.css
    content/global/components.css
-   content/global/textbox.css
    content/global/autocomplete.css
    content/global/aboutAbout.js
    content/global/aboutAbout.xhtml
 #ifdef MOZILLA_OFFICIAL
    content/global/aboutRights.xhtml
 #else
    content/global/aboutRights.xhtml           (aboutRights-unbranded.xhtml)
 #endif
--- a/toolkit/content/moz.build
+++ b/toolkit/content/moz.build
@@ -262,19 +262,16 @@ with Files('minimal-xul.css'):
     BUG_COMPONENT = ('Toolkit', 'XUL Widgets')
 
 with Files('plugins*'):
     BUG_COMPONENT = ('Toolkit', 'XUL Widgets')
 
 with Files('resetProfile*'):
     BUG_COMPONENT = ('Firefox', 'Migration')
 
-with Files('textbox*'):
-    BUG_COMPONENT = ('Toolkit', 'XUL Widgets')
-
 with Files('timepicker*'):
     BUG_COMPONENT = ('Toolkit', 'XUL Widgets')
 
 with Files('treeUtils.js'):
     BUG_COMPONENT = ('Toolkit', 'General')
 
 with Files('viewZoomOverlay.js'):
     BUG_COMPONENT = ('Toolkit', 'General')
deleted file mode 100644
--- a/toolkit/content/textbox.css
+++ /dev/null
@@ -1,45 +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/. */
-
-@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* set default namespace to XUL */
-@namespace html url("http://www.w3.org/1999/xhtml"); /* namespace for HTML elements */
-
-html|*.textbox-input {
-  -moz-appearance: none;
-  text-align: inherit;
-  text-shadow: inherit;
-  box-sizing: border-box;
-  -moz-box-flex: 1;
-}
-
-html|*.textbox-textarea {
-  -moz-appearance: none !important;
-  text-shadow: inherit;
-  box-sizing: border-box;
-  -moz-box-flex: 1;
-}
-
-
-@supports -moz-bool-pref("layout.css.emulate-moz-box-with-flex") {
-  html|*.textbox-input,
-  html|*.textbox-textarea {
-    /* Be block-level, so that -moz-box-flex can take effect, when we are an item
-       in a -moz-box being emulated by modified modern flex. */
-    display: block;
-  }
-}
-
-/*
-html|*.textbox-input::placeholder,
-html|*.textbox-textarea::placeholder {
-  text-align: left;
-  direction: ltr;
-}
-
-html|*.textbox-input::placeholder:-moz-locale-dir(rtl),
-html|*.textbox-textarea::placeholder:-moz-locale-dir(rtl) {
-  text-align: right;
-  direction: rtl;
-}
-*/
--- a/toolkit/content/widgets.css
+++ b/toolkit/content/widgets.css
@@ -18,12 +18,17 @@
 @import url("chrome://global/skin/notification.css");
 @import url("chrome://global/skin/popup.css");
 @import url("chrome://global/skin/progressmeter.css");
 @import url("chrome://global/skin/radio.css");
 @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");
+
+/* numberbox.css needs to be loaded after textbox.css since it overrides it */
+@import url("chrome://global/skin/textbox.css");
+@import url("chrome://global/skin/numberbox.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/numberbox.xml
+++ b/toolkit/content/widgets/numberbox.xml
@@ -7,21 +7,16 @@
 <bindings id="numberboxBindings"
    xmlns="http://www.mozilla.org/xbl"
    xmlns:html="http://www.w3.org/1999/xhtml"
    xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
    xmlns:xbl="http://www.mozilla.org/xbl">
 
   <binding id="numberbox"
            extends="chrome://global/content/bindings/textbox.xml#textbox">
-
-    <resources>
-      <stylesheet src="chrome://global/skin/numberbox.css"/>
-    </resources>
-
     <content>
       <xul:moz-input-box anonid="moz-input-box" class="numberbox-input-box" flex="1" xbl:inherits="context,disabled,focused">
         <html:input class="numberbox-input textbox-input" type="number" anonid="input"
                     xbl:inherits="value,min,max,maxlength,disabled,size,readonly,placeholder,tabindex,accesskey"/>
       </xul:moz-input-box>
     </content>
 
     <implementation>
--- a/toolkit/content/widgets/textbox.xml
+++ b/toolkit/content/widgets/textbox.xml
@@ -14,21 +14,16 @@
 
 <bindings id="textboxBindings"
    xmlns="http://www.mozilla.org/xbl"
    xmlns:html="http://www.w3.org/1999/xhtml"
    xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
    xmlns:xbl="http://www.mozilla.org/xbl">
 
   <binding id="textbox">
-    <resources>
-      <stylesheet src="chrome://global/content/textbox.css"/>
-      <stylesheet src="chrome://global/skin/textbox.css"/>
-    </resources>
-
     <content>
       <children/>
       <xul:moz-input-box anonid="moz-input-box" flex="1" xbl:inherits="context,spellcheck">
         <html:input class="textbox-input" anonid="input"
                     xbl:inherits="value,type,maxlength,disabled,size,readonly,placeholder,tabindex,accesskey,noinitialfocus,mozactionhint,spellcheck"/>
       </xul:moz-input-box>
     </content>
 
--- a/toolkit/content/xul.css
+++ b/toolkit/content/xul.css
@@ -619,16 +619,25 @@ textbox[resizable="true"] > moz-input-bo
 textbox[type="search"] {
   -moz-binding: url("chrome://global/content/bindings/textbox.xml#search-textbox");
 }
 
 textbox[type="number"] {
   -moz-binding: url("chrome://global/content/bindings/numberbox.xml#numberbox");
 }
 
+@supports -moz-bool-pref("layout.css.emulate-moz-box-with-flex") {
+  html|*.textbox-input,
+  html|*.textbox-textarea {
+    /* Be block-level, so that -moz-box-flex can take effect, when we are an item
+       in a -moz-box being emulated by modified modern flex. */
+    display: block;
+  }
+}
+
 .textbox-contextmenu:-moz-locale-dir(rtl) {
   direction: rtl;
 }
 
 /********** autocomplete textbox **********/
 
 /* SeaMonkey uses its own autocomplete and the toolkit's autocomplete widget */
 %ifndef MOZ_SUITE
--- a/toolkit/themes/linux/global/textbox.css
+++ b/toolkit/themes/linux/global/textbox.css
@@ -16,24 +16,32 @@ textbox {
   cursor: text;
   margin: 2px 4px;
   padding: 2px 2px 3px;
   padding-inline-start: 4px;
   background-color: -moz-Field;
   color: -moz-FieldText;
 }
 
-html|*.textbox-input, 
+html|*.textbox-input,
 html|*.textbox-textarea {
-  margin: 0px !important;
-  border: none !important;
-  padding: 0px 1px !important;
-  background-color: inherit;
+  -moz-appearance: none;
+  margin: 0;
+  border: none;
+  padding: 0 1px;
+  background-color: transparent;
   color: inherit;
   font: inherit;
+  text-shadow: inherit;
+  box-sizing: border-box;
+  -moz-box-flex: 1;
+}
+
+html|*.textbox-input {
+  text-align: inherit;
 }
 
 .textbox-contextmenu {
   cursor: default;
 }
 
 /* ..... readonly state ..... */
 
--- a/toolkit/themes/osx/global/in-content/common.css
+++ b/toolkit/themes/osx/global/in-content/common.css
@@ -84,16 +84,21 @@ xul|radio[focused="true"] > .radio-check
 html|*.numberbox-input::-moz-number-spin-up {
   border-radius: 4px 4px 0 0;
 }
 
 html|*.numberbox-input::-moz-number-spin-down  {
   border-radius: 0 0 4px 4px;
 }
 
+textbox[type="search"] {
+  -moz-appearance: none;
+  padding-inline-start: 10px;
+}
+
 xul|textbox[type="search"]:not([searchbutton]) > moz-input-box > .textbox-search-sign {
   list-style-image: url(chrome://global/skin/icons/search-textbox.svg);
   margin-inline-end: 5px;
 }
 
 html|button {
   /* XUL button min-width */
   min-width: 79px;
--- a/toolkit/themes/osx/global/textbox.css
+++ b/toolkit/themes/osx/global/textbox.css
@@ -9,24 +9,32 @@ textbox {
   -moz-appearance: textfield;
   cursor: text;
   margin: 4px;
   padding: 0px;
   background-color: -moz-Field;
   color: -moz-FieldText;
 }
 
-html|*.textbox-input, 
+html|*.textbox-input,
 html|*.textbox-textarea {
-  margin: 0px !important;
-  border: none !important;
-  padding: 0px 1px !important;
-  background-color: inherit;
+  -moz-appearance: none;
+  margin: 0;
+  border: none;
+  padding: 0 1px;
+  background-color: transparent;
   color: inherit;
   font: inherit;
+  text-shadow: inherit;
+  box-sizing: border-box;
+  -moz-box-flex: 1;
+}
+
+html|*.textbox-input {
+  text-align: inherit;
 }
 
 .textbox-contextmenu {
   cursor: default;
 }
 
 textbox[readonly="true"] {
   background-color: -moz-Dialog;
--- a/toolkit/themes/shared/in-content/common.inc.css
+++ b/toolkit/themes/shared/in-content/common.inc.css
@@ -388,20 +388,22 @@ xul|button[type="menu"] > xul|menupopup 
 /* textboxes */
 
 html|input[type="email"],
 html|input[type="tel"],
 html|input[type="text"],
 html|textarea,
 xul|textbox {
   -moz-appearance: none;
-  color: var(--in-content-text-color);
   border: 1px solid var(--in-content-box-border-color);
   border-radius: 2px;
-  background-color: var(--in-content-box-background);
+  /* !important to override disabled styling from textbox.css. We reduce the
+     opacity instead of changing colors. */
+  color: var(--in-content-text-color) !important;
+  background-color: var(--in-content-box-background) !important;
 }
 
 xul|textbox {
   min-height: 30px;
   padding-right: 10px;
   padding-left: 10px;
 }
 
--- a/toolkit/themes/windows/global/textbox.css
+++ b/toolkit/themes/windows/global/textbox.css
@@ -16,24 +16,32 @@ textbox {
   cursor: text;
   margin: 2px 4px;
   padding: 2px 2px 3px;
   padding-inline-start: 4px;
   background-color: -moz-Field;
   color: -moz-FieldText;
 }
 
-html|*.textbox-input, 
+html|*.textbox-input,
 html|*.textbox-textarea {
-  margin: 0px !important;
-  border: none !important;
-  padding: 0px 1px !important;
-  background-color: inherit;
+  -moz-appearance: none;
+  margin: 0;
+  border: none;
+  padding: 0 1px;
+  background-color: transparent;
   color: inherit;
   font: inherit;
+  text-shadow: inherit;
+  box-sizing: border-box;
+  -moz-box-flex: 1;
+}
+
+html|*.textbox-input {
+  text-align: inherit;
 }
 
 @media (-moz-windows-default-theme) and (-moz-os-version: windows-win7) {
   textbox html|*.textbox-input::placeholder {
     font-style: italic;
   }
 }