Bug 1154028 - Move reader controls styles to scoped style sheet. r=Gijs, a=sledru
authorMargaret Leibovic <margaret.leibovic@gmail.com>
Thu, 23 Apr 2015 10:59:03 -0700
changeset 260401 c64ca42b7490
parent 260400 80a9584ac5e4
child 260402 3058929d4335
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 controls styles to scoped style sheet. r=Gijs, a=sledru
mobile/android/themes/core/aboutReaderControls.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/shared/aboutReaderControls.css
toolkit/themes/windows/global/jar.mn
new file mode 100644
--- /dev/null
+++ b/mobile/android/themes/core/aboutReaderControls.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: Move reader view controls styles out of aboutReader.css */
--- a/mobile/android/themes/core/jar.mn
+++ b/mobile/android/themes/core/jar.mn
@@ -18,26 +18,28 @@ chrome.jar:
   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/aboutReaderControls.css              (aboutReaderControls.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/aboutReaderControls.css chrome://browser/skin/aboutReaderControls.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
@@ -8,38 +8,51 @@
   <link rel="stylesheet" href="chrome://global/skin/aboutReader.css" type="text/css"/>
 
   <script type="text/javascript;version=1.8" src="chrome://global/content/reader/aboutReader.js"></script>
 </head>
 
 <body>
   <div id="container" class="container">
     <div id="reader-header" class="header">
+      <style scoped>
+        @import url("chrome://global/skin/aboutReaderControls.css");
+      </style>
       <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 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 class="message">
+      <style scoped>
+        @import url("chrome://global/skin/aboutReaderControls.css");
+      </style>
+      <div id="reader-message"></div>
     </div>
 
     <div id="reader-footer" class="footer">
+      <style scoped>
+        @import url("chrome://global/skin/aboutReaderControls.css");
+      </style>
       <button id="remove-button" class="button remove-button"/>
     </div>
   </div>
 
   <ul id="reader-toolbar" class="toolbar">
+    <style scoped>
+      @import url("chrome://global/skin/aboutReaderControls.css");
+    </style>
     <li><button id="close-button" class="button close-button"/></li>
     <li><button id="share-button" class="button share-button"/></li>
     <ul id="style-dropdown" class="dropdown">
       <li><button class="dropdown-toggle button style-button"/></li>
       <li id="reader-popup" class="dropdown-popup">
         <div id="font-type-buttons"></div>
         <hr></hr>
         <div id="font-size-buttons">
--- a/toolkit/themes/osx/global/jar.mn
+++ b/toolkit/themes/osx/global/jar.mn
@@ -5,18 +5,19 @@
 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/aboutReader.css                                (../../shared/aboutReader.css)
   skin/classic/global/aboutReaderContent.css                         (../../shared/aboutReaderContent.css)
+* skin/classic/global/aboutReaderControls.css                        (../../shared/aboutReaderControls.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
@@ -16,457 +16,100 @@ body {
     -moz-padding-start: 51px;
   }
 }
 
 body.loaded {
   transition: color 0.4s, background-color 0.4s;
 }
 
-.light,
-.light-button {
+body.light {
   color: #333333;
   background-color: #ffffff;
 }
 
-.dark,
-.dark-button {
+body.dark {
   color: #eeeeee;
   background-color: #333333;
 }
 
-.dark *::-moz-selection {
+body.dark *::-moz-selection {
   background-color: #FFFFFF;
   color: #0095DD;
 }
-.dark a::-moz-selection {
+body.dark a::-moz-selection {
   color: #DD4800;
 }
 
-.sepia,
-.sepia-button {
+body.sepia {
   color: #333333;
   background-color: #f0ece7;
 }
 
-.sans-serif,
-.sans-serif-button,
-.sans-serif .remove-button {
+body.sans-serif,
+body.sans-serif .remove-button {
   font-family: Helvetica, Arial, sans-serif;
 }
 
-.serif,
-.serif-button,
-.serif .remove-button {
+body.serif,
+body.serif .remove-button  {
   font-family: Georgia, "Times New Roman", serif;
 }
 
-.font-size1 {
+body.font-size1 {
   font-size: 10px;
 }
 
-.font-size2 {
+body.font-size2 {
   font-size: 12px;
 }
 
-.font-size3 {
+body.font-size3 {
   font-size: 14px;
 }
 
-.font-size4  {
+body.font-size4  {
   font-size: 16px;
 }
 
-.font-size5 {
+body.font-size5 {
   font-size: 18px;
 }
 
-.font-size6 {
+body.font-size6 {
   font-size: 20px;
 }
 
-.font-size7 {
+body.font-size7 {
   font-size: 22px;
 }
 
-.font-size8 {
+body.font-size8 {
   font-size: 24px;
 }
 
-.font-size9 {
+body.font-size9 {
   font-size: 26px;
 }
 
-
-/* Loading/error message */
-
-.message {
-  margin-top: 40px;
-  display: none;
-  text-align: center;
-  width: 100%;
-  font-size: 0.9em;
-}
-
-/* Header */
-
-.header {
-  text-align: start;
-  display: none;
-}
-
-.domain {
-  font-size: 0.9em;
-  line-height: 1.48em;
-  padding-bottom: 4px;
-  font-family: Helvetica, Arial, sans-serif;
-  text-decoration: none;
-  border-bottom: 1px solid;
-  color: #0095dd;
-}
-
-.light > .container > .header > .domain,
-.sepia > .container > .header > .domain {
-  border-bottom-color: #333333;
-}
-
-.dark > .container > .header > .domain {
-  border-bottom-color: #eeeeee;
-}
-
-.header > h1 {
-  font-size: 1.33em;
-  line-height: 1.25em;
-  width: 100%;
-  margin: 30px 0;
-  padding: 0;
-}
+/* Override some controls and content styles based on color scheme */
 
-.header > .credits {
-  font-size: 0.9em;
-  line-height: 1.48em;
-  margin: 0 0 30px 0;
-  padding: 0;
-  font-style: italic;
-}
-
-/*======= Controls toolbar =======*/
-
-.toolbar {
-  font-family: Helvetica, Arial, sans-serif;
-  position: fixed;
-  height: 100%;
-  top: 0;
-  left: 0;
-  margin: 0;
-  padding: 0;
-  list-style: none;
-  background-color: #fbfbfb;
-  -moz-user-select: none;
-  border-right: 1px solid #b5b5b5;
-}
-
-.button {
-  display: block;
-  background-size: 24px 24px;
-  background-repeat: no-repeat;
-  color: #333;
-  background-color: #fbfbfb;
-  height: 40px;
-  padding: 0;
-}
-
-.toolbar .button {
-  width: 40px;
-  background-position: center;
-  margin-right: -1px;
-  border-top: 0;
-  border-left: 0;
-  border-right: 1px solid #b5b5b5;
-  border-bottom: 1px solid #c1c1c1;
-}
-
-.button[hidden] {
-  display: none;
+body.light > .container > .header > .domain,
+body.sepia > .container > .header > .domain {
+  border-bottom-color: #333333 !important;
 }
 
-.dropdown {
-  text-align: center;
-  list-style: none;
-  margin: 0;
-  padding: 0;
-}
-
-.dropdown li {
-  margin: 0;
-  padding: 0;
-}
-
-/*======= Font style popup =======*/
-
-.dropdown-popup {
-  min-width: 300px;
-  text-align: start;
-  position: absolute;
-  left: 48px; /* offset to account for toolbar width */
-  z-index: 1000;
-  background-color: #fbfbfb;
-  visibility: hidden;
-  border-radius: 4px;
-  border: 1px 1px 0 1px solid #b5b5b5;
-  box-shadow: 0 1px 12px #666;
-}
-
-.dropdown-popup > hr {
-  display: none;
-}
-
-.open > .dropdown-popup {
-  visibility: visible;
-}
-
-.dropdown-arrow {
-  position: absolute;
-  top: 30px; /* offset arrow from top of popup */
-  left: -16px;
-  width: 24px;
-  height: 24px;
-  background-image: url("chrome://global/skin/reader/RM-Type-Controls-Arrow.svg");
-  display: block;
-}
-
-#font-type-buttons,
-#font-size-buttons,
-#color-scheme-buttons {
-  display: flex;
-  flex-direction: row;
-}
-
-#font-type-buttons > button:first-child {
-  border-top-left-radius: 3px;
-}
-#font-type-buttons > button:last-child {
-  border-top-right-radius: 3px;
-}
-#color-scheme-buttons > button:first-child {
-  border-bottom-left-radius: 3px;
-}
-#color-scheme-buttons > button:last-child {
-  border-bottom-right-radius: 3px;
-}
-
-#font-type-buttons > button,
-#font-size-buttons > button,
-#color-scheme-buttons > button {
-  text-align: center;
-  border: 0;
-}
-
-#font-type-buttons > button,
-#font-size-buttons > button {
-  width: 50%;
-  background-color: transparent;
-  border-left: 1px solid #B5B5B5;
-  border-bottom: 1px solid #B5B5B5;
-}
-
-#color-scheme-buttons > button {
-  width: 33.33%;
-  font-size: 14px;
-}
-
-#color-scheme-buttons > .dark-button {
-  margin-top: -1px;
-  height: 61px;
-}
-
-#font-type-buttons > button:first-child,
-#font-size-buttons > button:first-child {
-  border-left: 0;
+body.dark > .container > .header > .domain {
+  border-bottom-color: #eeeeee !important;
 }
 
-#font-type-buttons > button {
-  display: inline-block;
-  font-size: 62px;
-  height: 100px;
-}
-
-#font-size-buttons > button,
-#color-scheme-buttons > button {
-  height: 60px;
-}
-
-#font-type-buttons > button:active:hover,
-#font-type-buttons > button.selected,
-#color-scheme-buttons > button:active:hover,
-#color-scheme-buttons > button.selected {
-  box-shadow: inset 0 -3px 0 0 #fc6420;
-}
-
-#font-type-buttons > button:active:hover,
-#font-type-buttons > button.selected {
-  border-bottom: 1px solid #FC6420;
-}
-
-/* Make the serif button content the same size as the sans-serif button content. */
-#font-type-buttons > button > .description {
-  color: #666;
-  font-size: 12px;
-  margin-top: -5px;
-}
-
-/* Font sizes are different per-platform, so we need custom CSS to line them up. */
-%ifdef XP_MACOSX
-#font-type-buttons > .sans-serif-button > .name {
-  margin-top: 10px;
-}
-
-#font-type-buttons > .sans-serif-button > .description {
-  margin-top: -4px;
-}
-
-#font-type-buttons > .serif-button > .name {
-  font-size: 63px;
-}
-%elifdef XP_WIN
-#font-type-buttons > .sans-serif-button > .name {
-  margin-top: 2px;
-}
-
-#font-type-buttons > .sans-serif-button > .description {
-  margin-top: -4px;
-}
-
-#font-type-buttons > .serif-button > .name {
-  font-size: 63px;
-}
-%else
-#font-type-buttons > .sans-serif-button > .name {
-  margin-top: 5px;
-}
-
-#font-type-buttons > .sans-serif-button > .description {
-  margin-top: -8px;
-}
-
-#font-type-buttons > .serif-button > .name {
-  font-size: 70px;
-}
-%endif
-
-.button:hover,
-#font-size-buttons > button:hover,
-#font-type-buttons > button:hover {
-  background-color: #ebebeb;
-}
-
-.dropdown.open,
-.button:active,
-#font-size-buttons > button:active,
-#font-size-buttons > button.selected {
-  background-color: #dadada;
-}
-
-/* Only used on Android */
-#font-size-sample {
-  display: none;
+body.sepia > .container > .footer {
+  background-color: #dedad4 !important;
 }
 
-.minus-button,
-.plus-button {
-  background-color: transparent;
-  border: 0;
-  background-size: 18px 18px;
-  background-repeat: no-repeat;
-  background-position: center;
-}
-
-.footer {
-  height: 64px;
-  background-color: #ebebeb;
-  position: absolute;
-  left: 0;
-  width: 100%;
-  text-align: center;
-  padding: 12px 0;
-  box-sizing: border-box;
-  box-shadow: 0 3px 3px -3px rgba(0, 0, 0, 0.35) inset;
-}
-
-.sepia .footer {
-  background-color: #dedad4;
-}
-
-.remove-button {
-  background-image: url("chrome://global/skin/reader/RM-Delete-24x24.svg");
-  margin: 0 auto;
-  border: 1px solid #c1c1c1;
-  background-position: 10px 7px;
-  padding-left: 42px;
-  padding-right: 10px;
-  border-radius: 2px;
-  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
-  font-size: 18px;
-}
-
-
-/*======= Toolbar icons =======*/
-
-/* Android-only controls */
-.share-button {
-  display: none;
+body.light blockquote,
+body.sepia blockquote {
+  -moz-border-start: 2px solid #333333 !important;
 }
 
-.close-button {
-  background-image: url("chrome://global/skin/reader/RM-Close-24x24.svg#close");
-  height: 68px;
-  background-position: center 8px;
-}
-
-.close-button:hover {
-  background-image: url("chrome://global/skin/reader/RM-Close-24x24.svg#close-hover");
-  background-color: #d94141;
-  border-bottom: 1px solid #d94141;
-  border-right: 1px solid #d94141;
-}
-
-.close-button:hover:active {
-  background-image: url("chrome://global/skin/reader/RM-Close-24x24.svg#close-hover");
-  background-color: #AE2325;
-  border-bottom: 1px solid #AE2325;
-  border-right: 1px solid #AE2325;
-}
-
-.style-button {
-  background-image: url("chrome://global/skin/reader/RM-Type-Controls-24x24.svg");
-}
-
-.toggle-button.on {
-  background-image: url("chrome://global/skin/reader/RM-Delete-24x24.svg");
+body.dark blockquote {
+  -moz-border-start: 2px solid #eeeeee !important;
 }
-
-.toggle-button {
-  background-image: url("chrome://global/skin/reader/RM-Add-24x24.svg");
-}
-
-.list-button {
-  background-image: url("chrome://global/skin/reader/RM-Reading-List-24x24.svg");
-}
-.list-button.on {
-  background-color: #d9d9d9;
-}
-
-.minus-button {
-  background-image: url("chrome://global/skin/reader/RM-Minus-24x24.svg");
-}
-
-.plus-button {
-  background-image: url("chrome://global/skin/reader/RM-Plus-24x24.svg");
-}
-
-@media print {
-  .toolbar {
-    display: none;
-  }
-  .footer {
-    display: none;
-  }
-}
--- a/toolkit/themes/shared/aboutReaderContent.css
+++ b/toolkit/themes/shared/aboutReaderContent.css
@@ -83,25 +83,16 @@ 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;
copy from toolkit/themes/shared/aboutReader.css
copy to toolkit/themes/shared/aboutReaderControls.css
--- a/toolkit/themes/shared/aboutReader.css
+++ b/toolkit/themes/shared/aboutReaderControls.css
@@ -1,106 +1,35 @@
 /* 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/. */
 
-body {
-  padding: 64px 0;
-  max-width: 660px;
-  margin: 0 auto;
-}
-
-@media (max-width: 785px) {
-  body {
-    padding-top: 64px;
-    -moz-padding-end: 0;
-    padding-bottom: 64px;
-    -moz-padding-start: 51px;
-  }
-}
-
-body.loaded {
-  transition: color 0.4s, background-color 0.4s;
-}
-
-.light,
 .light-button {
   color: #333333;
   background-color: #ffffff;
 }
 
-.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,
-.sans-serif .remove-button {
+.sans-serif-button {
   font-family: Helvetica, Arial, sans-serif;
 }
 
-.serif,
-.serif-button,
-.serif .remove-button {
+.serif-button {
   font-family: Georgia, "Times New Roman", serif;
 }
 
-.font-size1 {
-  font-size: 10px;
-}
-
-.font-size2 {
-  font-size: 12px;
-}
-
-.font-size3 {
-  font-size: 14px;
-}
-
-.font-size4  {
-  font-size: 16px;
-}
-
-.font-size5 {
-  font-size: 18px;
-}
-
-.font-size6 {
-  font-size: 20px;
-}
-
-.font-size7 {
-  font-size: 22px;
-}
-
-.font-size8 {
-  font-size: 24px;
-}
-
-.font-size9 {
-  font-size: 26px;
-}
-
-
 /* Loading/error message */
 
 .message {
   margin-top: 40px;
   display: none;
   text-align: center;
   width: 100%;
   font-size: 0.9em;
@@ -118,25 +47,16 @@ body.loaded {
   line-height: 1.48em;
   padding-bottom: 4px;
   font-family: Helvetica, Arial, sans-serif;
   text-decoration: none;
   border-bottom: 1px solid;
   color: #0095dd;
 }
 
-.light > .container > .header > .domain,
-.sepia > .container > .header > .domain {
-  border-bottom-color: #333333;
-}
-
-.dark > .container > .header > .domain {
-  border-bottom-color: #eeeeee;
-}
-
 .header > h1 {
   font-size: 1.33em;
   line-height: 1.25em;
   width: 100%;
   margin: 30px 0;
   padding: 0;
 }
 
@@ -386,20 +306,16 @@ body.loaded {
   left: 0;
   width: 100%;
   text-align: center;
   padding: 12px 0;
   box-sizing: border-box;
   box-shadow: 0 3px 3px -3px rgba(0, 0, 0, 0.35) inset;
 }
 
-.sepia .footer {
-  background-color: #dedad4;
-}
-
 .remove-button {
   background-image: url("chrome://global/skin/reader/RM-Delete-24x24.svg");
   margin: 0 auto;
   border: 1px solid #c1c1c1;
   background-position: 10px 7px;
   padding-left: 42px;
   padding-right: 10px;
   border-radius: 2px;
--- a/toolkit/themes/windows/global/jar.mn
+++ b/toolkit/themes/windows/global/jar.mn
@@ -6,18 +6,19 @@ toolkit.jar:
 % skin global classic/1.0 %skin/classic/global/ os=WINNT osversion<6
 % 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/aboutReader.css                      (../../shared/aboutReader.css)
         skin/classic/global/aboutReaderContent.css               (../../shared/aboutReaderContent.css)
+*       skin/classic/global/aboutReaderControls.css              (../../shared/aboutReaderControls.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,18 +214,19 @@ 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/aboutReader.css                      (../../shared/aboutReader.css)
         skin/classic/aero/global/aboutReaderContent.css               (../../shared/aboutReaderContent.css)
+*       skin/classic/aero/global/aboutReaderControls.css              (../../shared/aboutReaderControls.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