Bug 1154028 - Move reader content styles to scoped style sheet. r=Gijs, a=sledru
authorMargaret Leibovic <margaret.leibovic@gmail.com>
Thu, 23 Apr 2015 10:42:31 -0700
changeset 260400 80a9584ac5e4
parent 260399 e4a70d181871
child 260401 c64ca42b7490
push id771
push userryanvm@gmail.com
push date2015-05-05 02:31 +0000
treeherdermozilla-release@810e81a9bced [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersGijs, sledru
bugs1154028
milestone38.0
Bug 1154028 - Move reader content styles to scoped style sheet. r=Gijs, a=sledru
mobile/android/themes/core/aboutReaderContent.css
mobile/android/themes/core/jar.mn
toolkit/components/reader/content/aboutReader.html
toolkit/themes/osx/global/jar.mn
toolkit/themes/shared/aboutReader.css
toolkit/themes/shared/aboutReaderContent.css
toolkit/themes/windows/global/jar.mn
new file mode 100644
--- /dev/null
+++ b/mobile/android/themes/core/aboutReaderContent.css
@@ -0,0 +1,5 @@
+/* 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/. */
+
+/* TODO: Use shared aboutReaderContent.css from toolkit */
--- a/mobile/android/themes/core/jar.mn
+++ b/mobile/android/themes/core/jar.mn
@@ -17,25 +17,27 @@ chrome.jar:
 * skin/aboutDownloads.css                   (aboutDownloads.css)
   skin/aboutFeedback.css                    (aboutFeedback.css)
 #ifdef MOZ_SERVICES_HEALTHREPORT
   skin/aboutHealthReport.css                (aboutHealthReport.css)
 #endif
   skin/aboutMemory.css                      (aboutMemory.css)
   skin/aboutPrivateBrowsing.css             (aboutPrivateBrowsing.css)
   skin/aboutReader.css                      (aboutReader.css)
+  skin/aboutReaderContent.css               (aboutReaderContent.css)
   skin/aboutSupport.css                     (aboutSupport.css)
   skin/browser.css                          (browser.css)
 * skin/content.css                          (content.css)
   skin/config.css                           (config.css)
   skin/touchcontrols.css                    (touchcontrols.css)
   skin/netError.css                         (netError.css)
 % override chrome://global/skin/about.css chrome://browser/skin/about.css
 % override chrome://global/skin/aboutMemory.css chrome://browser/skin/aboutMemory.css
 % override chrome://global/skin/aboutReader.css chrome://browser/skin/aboutReader.css
+% override chrome://global/skin/aboutReaderContent.css chrome://browser/skin/aboutReaderContent.css
 % override chrome://global/skin/aboutSupport.css chrome://browser/skin/aboutSupport.css
 % override chrome://global/skin/media/videocontrols.css chrome://browser/skin/touchcontrols.css
 % override chrome://global/skin/netError.css chrome://browser/skin/netError.css
 
 #ifdef MOZ_PAY
   skin/payment.css                         (payment.css)
 #endif
 #
--- a/toolkit/components/reader/content/aboutReader.html
+++ b/toolkit/components/reader/content/aboutReader.html
@@ -14,17 +14,21 @@
   <div id="container" class="container">
     <div id="reader-header" class="header">
       <a id="reader-domain" class="domain"></a>
       <div class="domain-border"></div>
       <h1 id="reader-title"></h1>
       <div id="reader-credits" class="credits"></div>
     </div>
 
-    <div id="moz-reader-content" class="content">
+    <div class="content">
+      <style scoped>
+        @import url("chrome://global/skin/aboutReaderContent.css");
+      </style>
+      <div id="moz-reader-content"></div>
     </div>
 
     <div id="reader-message" class="message">
     </div>
 
     <div id="reader-footer" class="footer">
       <button id="remove-button" class="button remove-button"/>
     </div>
--- a/toolkit/themes/osx/global/jar.mn
+++ b/toolkit/themes/osx/global/jar.mn
@@ -6,16 +6,17 @@ toolkit.jar:
 % skin global classic/1.0 %skin/classic/global/
   skin/classic/global/10pct_transparent_grey.png
   skin/classic/global/50pct_transparent_grey.png
   skin/classic/global/about.css                                      (../../shared/about.css)
   skin/classic/global/aboutCache.css                                 (../../shared/aboutCache.css)
   skin/classic/global/aboutCacheEntry.css                            (../../shared/aboutCacheEntry.css)
   skin/classic/global/aboutMemory.css                                (../../shared/aboutMemory.css)
 * skin/classic/global/aboutReader.css                                (../../shared/aboutReader.css)
+  skin/classic/global/aboutReaderContent.css                         (../../shared/aboutReaderContent.css)
   skin/classic/global/aboutSupport.css                               (../../shared/aboutSupport.css)
   skin/classic/global/appPicker.css                                  (../../shared/appPicker.css)
   skin/classic/global/arrow.css
   skin/classic/global/autocomplete.css
   skin/classic/global/button.css
   skin/classic/global/checkbox.css
   skin/classic/global/colorpicker.css
   skin/classic/global/commonDialog.css
--- a/toolkit/themes/shared/aboutReader.css
+++ b/toolkit/themes/shared/aboutReader.css
@@ -28,16 +28,24 @@ body.loaded {
 }
 
 .dark,
 .dark-button {
   color: #eeeeee;
   background-color: #333333;
 }
 
+.dark *::-moz-selection {
+  background-color: #FFFFFF;
+  color: #0095DD;
+}
+.dark a::-moz-selection {
+  color: #DD4800;
+}
+
 .sepia,
 .sepia-button {
   color: #333333;
   background-color: #f0ece7;
 }
 
 .sans-serif,
 .sans-serif-button,
@@ -135,144 +143,16 @@ body.loaded {
 .header > .credits {
   font-size: 0.9em;
   line-height: 1.48em;
   margin: 0 0 30px 0;
   padding: 0;
   font-style: italic;
 }
 
-/* Content */
-
-#moz-reader-content {
-  display: none;
-  font-size: 1em;
-  line-height: 1.6em;
-}
-
-.content h1,
-.content h2,
-.content h3 {
-  font-weight: bold;
-}
-
-#moz-reader-content h1 {
-  font-size: 1.33em;
-  line-height: 1.25em;
-}
-
-#moz-reader-content h2 {
-  font-size: 1.1em;
-  line-height: 1.51em;
-}
-
-#moz-reader-content h3 {
-  font-size: 1em;
-  line-height: 1.66em;
-}
-
-.content a {
-  text-decoration: underline;
-  font-weight: normal;
-}
-
-.content a,
-.content a:visited,
-.content a:hover,
-.content a:active {
-  color: #0095dd;
-}
-
-.content * {
-  max-width: 100%;
-  height: auto;
-}
-
-.content p,
-.content code,
-.content pre,
-.content blockquote,
-.content ul,
-.content ol,
-.content li,
-.content figure,
-.content .wp-caption {
-  margin: 0 0 30px 0;
-}
-
-.content p > img:only-child,
-.content p > a:only-child > img:only-child,
-.content .wp-caption img,
-.content figure img {
-  display: block;
-}
-
-.content img[moz-reader-center] {
-  margin-left: auto;
-  margin-right: auto;
-}
-
-#moz-reader-content .caption,
-#moz-reader-content .wp-caption-text,
-#moz-reader-content figcaption {
-  font-size: 0.9em;
-  line-height: 1.48em;
-  font-style: italic;
-}
-
-.content code,
-.content pre {
-  white-space: pre-wrap;
-}
-
-.content blockquote {
-  padding: 0;
-  -moz-padding-start: 16px;
-}
-
-.light > .container > .content blockquote,
-.sepia > .container > .content blockquote {
-  -moz-border-start: 2px solid #333333;
-}
-
-.dark > .container > .content blockquote {
-  -moz-border-start: 2px solid #eeeeee;
-}
-.dark *::-moz-selection {
-  background-color: #FFFFFF;
-  color: #0095DD;
-}
-.dark a::-moz-selection {
-  color: #DD4800;
-}
-
-.content ul,
-.content ol {
-  padding: 0;
-}
-
-.content ul {
-  -moz-padding-start: 30px;
-  list-style: disc;
-}
-
-.content ol {
-  -moz-padding-start: 30px;
-  list-style: decimal;
-}
-
-/* Hide elements with common "hidden" class names */
-#moz-reader-content .visually-hidden,
-#moz-reader-content .visuallyhidden,
-#moz-reader-content .hidden,
-#moz-reader-content .invisible,
-#moz-reader-content .sr-only {
-  display: none;
-}
-
 /*======= Controls toolbar =======*/
 
 .toolbar {
   font-family: Helvetica, Arial, sans-serif;
   position: fixed;
   height: 100%;
   top: 0;
   left: 0;
new file mode 100644
--- /dev/null
+++ b/toolkit/themes/shared/aboutReaderContent.css
@@ -0,0 +1,122 @@
+/* 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/. */
+
+#moz-reader-content {
+  display: none;
+  font-size: 1em;
+  line-height: 1.6em;
+}
+
+h1,
+h2,
+h3 {
+  font-weight: bold;
+}
+
+h1 {
+  font-size: 1.33em;
+  line-height: 1.25em;
+}
+
+h2 {
+  font-size: 1.1em;
+  line-height: 1.51em;
+}
+
+h3 {
+  font-size: 1em;
+  line-height: 1.66em;
+}
+
+a {
+  text-decoration: underline;
+  font-weight: normal;
+}
+
+a,
+a:visited,
+a:hover,
+a:active {
+  color: #0095dd;
+}
+
+* {
+  max-width: 100%;
+  height: auto;
+}
+
+p,
+code,
+pre,
+blockquote,
+ul,
+ol,
+li,
+figure,
+.wp-caption {
+  margin: 0 0 30px 0;
+}
+
+p > img:only-child,
+p > a:only-child > img:only-child,
+.wp-caption img,
+figure img {
+  display: block;
+}
+
+img[moz-reader-center] {
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.caption,
+.wp-caption-text,
+figcaption {
+  font-size: 0.9em;
+  line-height: 1.48em;
+  font-style: italic;
+}
+
+code,
+pre {
+  white-space: pre-wrap;
+}
+
+blockquote {
+  padding: 0;
+  -moz-padding-start: 16px;
+}
+
+.light blockquote,
+.sepia blockquote {
+  -moz-border-start: 2px solid #333333;
+}
+
+.dark blockquote {
+  -moz-border-start: 2px solid #eeeeee;
+}
+
+ul,
+ol {
+  padding: 0;
+}
+
+ul {
+  -moz-padding-start: 30px;
+  list-style: disc;
+}
+
+ol {
+  -moz-padding-start: 30px;
+  list-style: decimal;
+}
+
+/* Hide elements with common "hidden" class names */
+.visually-hidden,
+.visuallyhidden,
+.hidden,
+.invisible,
+.sr-only {
+  display: none;
+}
--- a/toolkit/themes/windows/global/jar.mn
+++ b/toolkit/themes/windows/global/jar.mn
@@ -7,16 +7,17 @@ toolkit.jar:
 % skin global classic/1.0 %skin/classic/global/ os!=WINNT
 # NOTE: If you add a new file here, you'll need to add it to the aero
 # section at the bottom of this file
         skin/classic/global/about.css                            (../../shared/about.css)
         skin/classic/global/aboutCache.css                       (../../shared/aboutCache.css)
         skin/classic/global/aboutCacheEntry.css                  (../../shared/aboutCacheEntry.css)
         skin/classic/global/aboutMemory.css                      (../../shared/aboutMemory.css)
 *       skin/classic/global/aboutReader.css                      (../../shared/aboutReader.css)
+        skin/classic/global/aboutReaderContent.css               (../../shared/aboutReaderContent.css)
         skin/classic/global/aboutSupport.css                     (../../shared/aboutSupport.css)
         skin/classic/global/appPicker.css                        (../../shared/appPicker.css)
         skin/classic/global/arrow.css
 *       skin/classic/global/autocomplete.css
         skin/classic/global/button.css
         skin/classic/global/checkbox.css
         skin/classic/global/colorpicker.css
         skin/classic/global/commonDialog.css
@@ -213,16 +214,17 @@ toolkit.jar:
 #ifdef XP_WIN
 toolkit.jar:
 % skin global classic/1.0 %skin/classic/aero/global/ os=WINNT osversion>=6
         skin/classic/aero/global/about.css                            (../../shared/about.css)
         skin/classic/aero/global/aboutCache.css                       (../../shared/aboutCache.css)
         skin/classic/aero/global/aboutCacheEntry.css                  (../../shared/aboutCacheEntry.css)
         skin/classic/aero/global/aboutMemory.css                      (../../shared/aboutMemory.css)
 *       skin/classic/aero/global/aboutReader.css                      (../../shared/aboutReader.css)
+        skin/classic/aero/global/aboutReaderContent.css               (../../shared/aboutReaderContent.css)
         skin/classic/aero/global/aboutSupport.css                     (../../shared/aboutSupport.css)
         skin/classic/aero/global/appPicker.css                        (../../shared/appPicker.css)
         skin/classic/aero/global/arrow.css
 *       skin/classic/aero/global/autocomplete.css                        (autocomplete-aero.css)
         skin/classic/aero/global/button.css
         skin/classic/aero/global/checkbox.css
         skin/classic/aero/global/colorpicker.css
         skin/classic/aero/global/commonDialog.css