[MD settings] tweaks to what is shown in about page; and css cleanup

chrome/browser/resources/settings/about_page/about_page.html

 <link rel="import" href="chrome://resources/html/polymer.html">
 <link rel="import" href="/about_page/about_page_browser_proxy.html">
 <link rel="import" href="/i18n_setup.html">
 <link rel="import" href="/icons.html">
 <link rel="import" href="/lifetime_browser_proxy.html">
 <link rel="import" href="/route.html">
 <link rel="import" href="/settings_page/main_page_behavior.html">
 <link rel="import" href="/settings_page/settings_animated_pages.html">
 <link rel="import" href="/settings_page/settings_section.html">
 <link rel="import" href="/settings_page_css.html">
 <link rel="import" href="/settings_shared_css.html">
 <link rel="import" href="chrome://resources/cr_elements/icons.html">
 <link rel="import" href="chrome://resources/html/assert.html">
 <link rel="import" href="chrome://resources/html/i18n_behavior.html">
 <link rel="import" href="chrome://resources/html/web_ui_listener_behavior.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/iron-icon/iron-icon.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/neon-animation/neon-animatable.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-button.html">
 
 <if expr="chromeos">
 <link rel="import" href="/about_page/detailed_build_info.html">
 <link rel="import" href="/settings_page/settings_subpage.html">
 </if>
 
 <dom-module id="settings-about-page">
   <template>
     <style include="settings-shared settings-page-styles">
+      :host {
+        --about-page-image-space: 10px;
+      }
+
       .copyable {
         -webkit-user-select: text;
       }
 
       .product-title {
         font-size: 20px;
         margin-bottom: auto;
         margin-top: auto;
       }
 
       img {
-        -webkit-margin-end: 10px;
+        -webkit-margin-end: var(--about-page-image-space);
       }
 
       iron-icon {
-        -webkit-margin-end: var(--iron-icon-spacing);
+        -webkit-margin-end: var(--about-page-image-space);
+        width: 32px;  /* The width of the product-logo img. */
       }
 
       iron-icon[icon='settings:check-circle'] {
         fill: var(--paper-blue-600);
       }
 
       iron-icon[icon='settings:error'] {
         fill: var(--paper-red-600);
       }
 
       .product-info {
         display: block;
         padding-bottom: 10px;
         padding-top: 10px;
       }
 
       .info-section {
         margin-bottom: 12px;
       }
 
       #regulatoryInfo img {
         width: 330px;
       }
     </style>
     <div>
       <settings-section page-title="$i18n{aboutPageTitle}" section="about">
         <settings-animated-pages id="pages" section="about">
           <neon-animatable route-path="default">
-            <div class="settings-box">
+            <div class="settings-box two-line">
               <img id="product-logo" on-tap="onProductLogoTap_"
                   srcset="chrome://theme/current-channel-logo@1x 1x,
                           chrome://theme/current-channel-logo@2x 2x" alt="">
               <span class="product-title">$i18n{aboutProductTitle}</span>
             </div>
             <div class="settings-box two-line">
               <iron-icon
                   hidden="[[!shouldShowUpdateStatusIcon_(
                       currentUpdateStatusEvent_)]]"
                   icon$="[[getIcon_(currentUpdateStatusEvent_)]]"
@@ skipping 14 matching lines @@
                 </div>
                 <span id="deprecationWarning"
                     hidden="[[!obsoleteSystemInfo_.obsolete]]">
                   $i18n{aboutObsoleteSystem}
                   <a href="$i18n{aboutObsoleteSystemURL}" target="_blank">
                     $i18n{learnMore}
                   </a>
                 </span>
                 <div class="secondary copyable">$i18n{aboutBrowserVersion}</div>
               </div>
-              <span class="secondary-action">
-                <paper-button id="relaunch" class="secondary-button"
+              <span id="relaunchContainer"
 <if expr="not chromeos">
-                    hidden="[[!shouldShowRelaunch_(currentUpdateStatusEvent_)]]"
+                  hidden="[[!shouldShowRelaunch_(currentUpdateStatusEvent_)]]"
 </if>
 <if expr="chromeos">
-                    hidden="[[!shouldShowRelaunch_(
-                        currentUpdateStatusEvent_, targetChannel_)]]"
+                  hidden="[[!shouldShowRelaunch_(
+                      currentUpdateStatusEvent_, targetChannel_)]]"
 </if>
+                  class="secondary-action">
+                <paper-button id="relaunch" class="secondary-button"
                     on-tap="onRelaunchTap_">
                   $i18n{aboutRelaunch}
                 </paper-button>
 <if expr="chromeos">
                 <paper-button id="relaunchAndPowerwash" class="secondary-button"
                     hidden="[[!shouldShowRelaunchAndPowerwash_(
                         currentUpdateStatusEvent_, targetChannel_)]]"
                     on-tap="onRelaunchAndPowerwashTap_">
                   $i18n{aboutRelaunchAndPowerwash}
                 </paper-button>
@@ skipping 49 matching lines @@
               <settings-detailed-build-info></settings-detailed-build-info>
             </settings-subpage>
           </template>
 </if>
         </settings-animated-pages>
       </settings-section>
     </div>
   </template>
   <script src="about_page.js"></script>
 </dom-module>