Bug 1389559 - Wrap about:addons warnings to maintain narrow layouts r=rhelmer
authorMark Striemer <mstriemer@mozilla.com>
Wed, 30 Aug 2017 16:55:58 -0500
changeset 377990 d2ad47692c8763a1365a9eda357730052df6fc40
parent 377989 e6189da47385a9a7286259d013103634432722ba
child 377991 7802d289518a777d049f3958e9017bf99b05f497
push id50136
push userryanvm@gmail.com
push dateThu, 31 Aug 2017 15:37:21 +0000
treeherderautoland@d2ad47692c87 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersrhelmer
bugs1389559
milestone57.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 1389559 - Wrap about:addons warnings to maintain narrow layouts r=rhelmer MozReview-Commit-ID: 24Z8qEdROmQ
toolkit/mozapps/extensions/content/extensions.xul
toolkit/themes/shared/extensions/extensions.inc.css
--- a/toolkit/mozapps/extensions/content/extensions.xul
+++ b/toolkit/mozapps/extensions/content/extensions.xul
@@ -184,24 +184,24 @@
               <label value="&loading.label;"/>
             </hbox>
             <spacer class="alert-spacer-after"/>
           </vbox>
           <vbox id="discover-error" align="center" pack="stretch" flex="1" class="alert-container">
             <spacer class="alert-spacer-before"/>
             <hbox>
               <spacer class="discover-spacer-before"/>
-              <hbox class="alert" align="center">
+              <vbox class="alert" align="center">
                 <image class="discover-logo"/>
                 <vbox flex="1" align="stretch">
                   <label class="discover-title">&discover.title;</label>
                   <description class="discover-description">&discover.description2;</description>
                   <description class="discover-footer">&discover.footer;</description>
                 </vbox>
-              </hbox>
+              </vbox>
               <spacer class="discover-spacer-after"/>
             </hbox>
             <spacer class="alert-spacer-after"/>
           </vbox>
           <browser id="discover-browser" type="content" flex="1"
                      disablehistory="true" homepage="about:blank"/>
         </deck>
 
@@ -362,35 +362,35 @@
                   &disabledUnsigned.description.start;<label class="text-link plain" id="find-alternative-addons">&disabledUnsigned.description.findAddonsLink;</label>&disabledUnsigned.description.end;
                 </description>
                 <hbox pack="start"><label class="text-link" id="signing-learn-more">&disabledUnsigned.learnMore;</label></hbox>
                 <description id="signing-dev-info">
                   &disabledUnsigned.devInfo.start;<label class="text-link plain" id="signing-dev-manual-link">&disabledUnsigned.devInfo.linkToManual;</label>&disabledUnsigned.devInfo.end;
                 </description>
               </vbox>
               <vbox id="legacy-extensions-notice" class="alert-container" hidden="true">
-                <hbox class="alert">
+                <vbox class="alert">
                   <description>&legacyWarning.description;
                     <label class="text-link plain" id="legacy-extensions-learnmore-link">&legacyWarning.showLegacy;</label>
                   </description>
-                </hbox>
+                </vbox>
               </vbox>
               <vbox id="plugindeprecation-notice" class="alert-container">
-                <hbox class="alert">
+                <vbox class="alert">
                   <description>&pluginDeprecation.description; &#160;
                     <label class="text-link plain" id="plugindeprecation-learnmore-link">&pluginDeprecation.learnMore;</label>
                   </description>
-                </hbox>
+                </vbox>
               </vbox>
               <vbox id="getthemes-container" class="alert-container">
-                <hbox class="alert">
+                <vbox class="alert">
                   <description>&getThemes.description; &#160;
                     <label class="text-link plain" id="getthemes-learnmore-link">&getThemes.learnMore;</label>
                   </description>
-                </hbox>
+                </vbox>
               </vbox>
               <hbox class="view-header global-warning-container">
                 <!-- global warnings -->
                 <hbox class="global-warning" flex="1">
                   <hbox class="global-warning-safemode" flex="1" align="center"
                         tooltiptext="&warning.safemode.label;">
                     <image class="warning-icon"/>
                     <label class="global-warning-text" flex="1" crop="end"
@@ -414,32 +414,35 @@
                   </hbox>
                   <button class="button-link global-warning-updatesecurity"
                           label="&warning.updatesecurity.enable.label;"
                           tooltiptext="&warning.updatesecurity.enable.tooltip;"
                           command="cmd_enableUpdateSecurity"/>
                   <spacer flex="5000"/> <!-- Necessary to allow the message to wrap -->
                 </hbox>
               </hbox>
-              <hbox class="view-header global-info-container experiment-info-container">
-                <hbox class="global-info" flex="1" align="center">
-                  <label value="&experiment.info.label;"/>
-                  <button id="experiments-learn-more"
-                          label="&experiment.info.learnmore;"
-                          tooltiptext="&experiment.info.learnmore;"
-                          accesskey="&experiment.info.learnmore.accesskey;"
-                          command="cmd_experimentsLearnMore"/>
-                  <button id="experiments-change-telemetry"
-                          label="&experiment.info.changetelemetry;"
-                          tooltiptext="&experiment.info.changetelemetry;"
-                          accesskey="&experiment.info.changetelemetry.accesskey;"
-                          command="cmd_experimentsOpenTelemetryPreferences"/>
-                  <spacer flex="5000"/> <!-- Necessary to allow the message to wrap. -->
-                </hbox>
-              </hbox>
+              <vbox class="alert-container experiment-info-container">
+                <vbox class="alert">
+                  <description>
+                    &experiment.info.label;
+                    <hbox>
+                      <button id="experiments-learn-more"
+                              label="&experiment.info.learnmore;"
+                              tooltiptext="&experiment.info.learnmore;"
+                              accesskey="&experiment.info.learnmore.accesskey;"
+                              command="cmd_experimentsLearnMore"/>
+                      <button id="experiments-change-telemetry"
+                              label="&experiment.info.changetelemetry;"
+                              tooltiptext="&experiment.info.changetelemetry;"
+                              accesskey="&experiment.info.changetelemetry.accesskey;"
+                              command="cmd_experimentsOpenTelemetryPreferences"/>
+                    </hbox>
+                  </description>
+                </vbox>
+              </vbox>
               <vbox id="addon-list-empty" class="alert-container"
                     flex="1" hidden="true">
                 <spacer class="alert-spacer-before"/>
                 <vbox class="alert">
                   <label value="&listEmpty.installed.label;"/>
                   <button class="discover-button"
                           id="discover-button-install"
                           label="&listEmpty.button.label;"
--- a/toolkit/themes/shared/extensions/extensions.inc.css
+++ b/toolkit/themes/shared/extensions/extensions.inc.css
@@ -111,28 +111,33 @@
 
 .alert {
   -moz-box-align: center;
   padding: 10px;
   color: var(--in-content-text-color);
   border: 1px solid var(--in-content-box-border-color);
   border-radius: 2px;
   background-color: #ebebeb;
+  text-align: center;
 }
 
 .alert .alert-title {
   font-weight: bold;
   font-size: 200%;
   margin-bottom: 15px;
 }
 
 .alert button {
   margin: 1em 2em;
 }
 
+.experiment-info-container > .alert button {
+  margin: 0 4px;
+}
+
 .loading {
   list-style-image: url("chrome://global/skin/icons/loading.png");
   padding-left: 20px;
   padding-right: 20px;
 }
 
 @media (min-resolution: 1.1dppx) {
   .loading > image {