Bug 1324170 - Change "Learn More" links to always align after text in about:preferences r=jaws draft
authorbeachjar <beachjar@msu.edu>
Mon, 09 Jan 2017 19:12:37 -0500
changeset 457809 0dba67d0c4572453a39d83d229cdf843dcc71ce2
parent 457771 f9891f44847239bdccb7a20c468c321a5d357313
child 541600 1b1d9cef50100d116ccf5c6356c76db7dd62ddce
push id40904
push userbmo:beachjar@msu.edu
push dateTue, 10 Jan 2017 00:13:49 +0000
reviewersjaws
bugs1324170
milestone53.0a1
Bug 1324170 - Change "Learn More" links to always align after text in about:preferences r=jaws "Learn More" links should always appear after the text instead of aligned in their own column like the "Learn More" in the "privacy" section of about:preferences. MozReview-Commit-ID: 3yBjCzAyaSz
browser/components/preferences/in-content/advanced.xul
browser/components/preferences/in-content/content.xul
browser/components/preferences/in-content/privacy.xul
browser/themes/shared/incontentprefs/preferences.inc.css
toolkit/themes/shared/in-content/common.inc.css
--- a/browser/components/preferences/in-content/advanced.xul
+++ b/browser/components/preferences/in-content/advanced.xul
@@ -205,52 +205,49 @@
 #ifdef MOZ_TELEMETRY_REPORTING
       <groupbox>
         <caption>
           <checkbox id="submitHealthReportBox" label="&enableHealthReport.label;"
                     accesskey="&enableHealthReport.accesskey;"/>
         </caption>
         <vbox>
           <hbox class="indent">
-            <label flex="1">&healthReportDesc.label;</label>
-            <spacer flex="10"/>
+            <label>&healthReportDesc.label;</label>
             <label id="FHRLearnMore"
-                   class="text-link">&healthReportLearnMore.label;</label>
+                   class="learnMore text-link">&healthReportLearnMore.label;</label>
           </hbox>
           <hbox class="indent">
             <groupbox flex="1">
               <caption>
                 <checkbox id="submitTelemetryBox" preference="toolkit.telemetry.enabled"
                           label="&enableTelemetryData.label;"
                           accesskey="&enableTelemetryData.accesskey;"/>
               </caption>
               <hbox class="indent">
-                <label id="telemetryDataDesc" flex="1">&telemetryDesc.label;</label>
-                <spacer flex="10"/>
+                <label id="telemetryDataDesc">&telemetryDesc.label;</label>
                 <label id="telemetryLearnMore"
-                       class="text-link">&telemetryLearnMore.label;</label>
+                       class="learnMore text-link">&telemetryLearnMore.label;</label>
               </hbox>
             </groupbox>
           </hbox>
         </vbox>
       </groupbox>
 #endif
 #ifdef MOZ_CRASHREPORTER
       <groupbox>
         <caption>
           <checkbox id="automaticallySubmitCrashesBox"
                     preference="browser.crashReports.unsubmittedCheck.autoSubmit"
                     label="&alwaysSubmitCrashReports.label;"
                     accesskey="&alwaysSubmitCrashReports.accesskey;"/>
         </caption>
         <hbox class="indent">
-          <label flex="1">&crashReporterDesc2.label;</label>
-          <spacer flex="10"/>
+          <label>&crashReporterDesc2.label;</label>
           <label id="crashReporterLearnMore"
-                 class="text-link">&crashReporterLearnMore.label;</label>
+                 class="learnMore text-link">&crashReporterLearnMore.label;</label>
         </hbox>
       </groupbox>
 #endif
     </tabpanel>
 #endif
 
     <!-- Network -->
     <tabpanel id="networkPanel" orient="vertical">
--- a/browser/components/preferences/in-content/content.xul
+++ b/browser/components/preferences/in-content/content.xul
@@ -44,22 +44,20 @@
   <caption><label>&drmContent.label;</label></caption>
   <grid id="contentGrid2">
     <columns>
       <column flex="1"/>
       <column/>
     </columns>
     <rows id="contentRows-2">
       <row id="playDRMContentRow">
-        <vbox align="start">
+        <hbox align="center">
           <checkbox id="playDRMContent" preference="media.eme.enabled"
                     label="&playDRMContent.label;" accesskey="&playDRMContent.accesskey;"/>
-        </vbox>
-        <hbox pack="end" align="center">
-          <label id="playDRMContentLink" class="text-link" value="&playDRMContent.learnMore.label;"/>
+          <label id="playDRMContentLink" class="learnMore text-link" value="&playDRMContent.learnMore.label;"/>
         </hbox>
       </row>
     </rows>
   </grid>
 </groupbox>
 
 <groupbox id="notificationsGroup" data-category="paneContent" hidden="true">
   <caption><label>&notificationsPolicy.label;</label></caption>
@@ -68,17 +66,17 @@
       <column flex="1"/>
       <column/>
     </columns>
     <rows>
       <row id="notificationsPolicyRow" align="center">
         <hbox align="start">
           <label id="notificationsPolicy">&notificationsPolicyDesc3.label;</label>
           <label id="notificationsPolicyLearnMore"
-                 class="text-link"
+                 class="learnMore text-link"
                  value="&notificationsPolicyLearnMore.label;"/>
         </hbox>
         <hbox pack="end">
           <button id="notificationsPolicyButton" label="&notificationsPolicyButton.label;"
                   accesskey="&notificationsPolicyButton.accesskey;"/>
         </hbox>
       </row>
       <row id="notificationsDoNotDisturbRow" hidden="true">
--- a/browser/components/preferences/in-content/privacy.xul
+++ b/browser/components/preferences/in-content/privacy.xul
@@ -87,17 +87,17 @@
 </hbox>
 
 <!-- Tracking -->
 <groupbox id="trackingGroup" data-category="panePrivacy" hidden="true">
   <vbox id="trackingprotectionbox" hidden="true">
     <hbox align="start">
       <vbox>
         <caption><label>&trackingProtectionHeader.label;
-          <label id="trackingProtectionLearnMore" class="text-link"
+          <label id="trackingProtectionLearnMore" class="learnMore text-link"
                  value="&trackingProtectionLearnMore.label;"/>
         </label></caption>
         <radiogroup id="trackingProtectionRadioGroup">
           <radio value="always"
                  label="&trackingProtectionAlways.label;"
                  accesskey="&trackingProtectionAlways.accesskey;"/>
           <radio value="private"
                  label="&trackingProtectionPrivate.label;"
@@ -123,17 +123,17 @@
   <vbox id="trackingprotectionpbmbox">
     <caption><label>&tracking.label;</label></caption>
     <hbox align="center">
       <checkbox id="trackingProtectionPBM"
                 preference="privacy.trackingprotection.pbmode.enabled"
                 accesskey="&trackingProtectionPBM5.accesskey;"
                 label="&trackingProtectionPBM5.label;" />
       <label id="trackingProtectionPBMLearnMore"
-             class="text-link"
+             class="learnMore text-link"
              value="&trackingProtectionPBMLearnMore.label;"/>
       <spacer flex="1" />
       <button id="changeBlockListPBM"
               label="&changeBlockList.label;" accesskey="&changeBlockList.accesskey;"
               preference="pref.privacy.disable_button.change_blocklist"/>
     </hbox>
   </vbox>
   <vbox>
@@ -284,17 +284,17 @@
     &suggestionSettings.label;
   </label>
 </groupbox>
 
 <!-- Containers -->
 <groupbox id="browserContainersGroup" data-category="panePrivacy" hidden="true">
   <vbox id="browserContainersbox" hidden="true">
     <caption><label>&browserContainersHeader.label;
-      <label id="browserContainersLearnMore" class="text-link"
+      <label id="browserContainersLearnMore" class="learnMore text-link"
              value="&browserContainersLearnMore.label;"/>
     </label></caption>
     <hbox align="start">
       <vbox>
         <checkbox id="browserContainersCheckbox"
                   label="&browserContainersEnabled.label;"
                   accesskey="&browserContainersEnabled.accesskey;"
                   preference="privacy.userContext.enabled"
--- a/browser/themes/shared/incontentprefs/preferences.inc.css
+++ b/browser/themes/shared/incontentprefs/preferences.inc.css
@@ -38,16 +38,22 @@ treecol {
 #blocklistsTree treechildren::-moz-tree-row {
   min-height: 36px;
 }
 
 #selectionCol {
   min-width: 26px;
 }
 
+/* For the "learn more" links, line up after text */
+.learnMore {
+  margin-inline-start: 1.5em;
+  font-weight: normal;
+}
+
 /* Category List */
 
 #categories {
   max-height: 100vh;
 }
 
 #categories > scrollbox {
   overflow-x: hidden !important;
@@ -169,25 +175,16 @@ treecol {
   font-weight: bold;
 }
 
 #downloadFolder {
   margin-inline-start: 0;
 }
 
 /* Content pane */
-#playDRMContentLink {
-  /* Line up with the buttons in the other grid bits: */
-  margin-left: 4px !important;
-  margin-right: 4px !important;
-}
-
-#notificationsPolicyLearnMore {
-  margin-inline-start: 1.5em !important;
-}
 
 #defaultFontSizeLabel {
   /* !important needed to override common !important rule */
   margin-inline-start: 4px !important;
 }
 
 /* Applications Pane Styles */
 
@@ -226,24 +223,16 @@ treecol {
 }
 
 .actionsMenu > menupopup > menuitem > .menu-iconic-left {
   margin-inline-end: 8px !important;
 }
 
 /* Privacy pane */
 
-#trackingProtectionPBMLearnMore,
-#trackingProtectionLearnMore,
-#browserContainersLearnMore {
-  margin-inline-start: 1.5em !important;
-  margin-top: 0;
-  font-weight: normal;
-}
-
 .doNotTrackLearnMore {
   margin-inline-start: calc(1em + 30px);
   margin-bottom: 1em;
   font-weight: normal;
 }
 
 .doNotTrackLearnMore > label {
   font-size: 1em !important;
@@ -279,27 +268,16 @@ description > html|a {
   /* no margin-inline-start for elements at the beginning of a line */
   margin-inline-start: 0;
 }
 
 #tabsElement {
   margin-inline-end: 4px; /* add the 4px end-margin of other elements */
 }
 
-#telemetryLearnMore,
-#FHRLearnMore,
-#crashReporterLearnMore {
-  /* provide some margin between the links and the label text */
-  /* !important is needed to override the rules defined in common.css */
-  margin-inline-start: 20px !important;
-  /* center the links */
-  margin-top: 8px;
-  margin-bottom: 8px;
-}
-
 .indent {
   /* !important needed to override margin-inline-start:0 !important; rule
      define in common.css for labels */
   margin-inline-start: 33px !important;
 }
 
 .text-link {
   margin-bottom: 0;
--- a/toolkit/themes/shared/in-content/common.inc.css
+++ b/toolkit/themes/shared/in-content/common.inc.css
@@ -105,17 +105,17 @@ xul|groupbox {
   -moz-appearance: none;
   border: none;
   margin: 15px 0 0;
   padding-inline-start: 0;
   padding-inline-end: 0;
   font-size: 1.25rem;
 }
 
-xul|groupbox xul|label:not(.menu-accel):not(.menu-text):not(.indent),
+xul|groupbox xul|label:not(.menu-accel):not(.menu-text):not(.indent):not(.learnMore),
 xul|groupbox xul|description {
   /* !important needed to override toolkit !important rule */
   margin-inline-start: 0 !important;
   margin-inline-end: 0 !important;
 }
 
 /* tabpanels and tabs */