MD Settings: About page, implementing update status.

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

 <link rel="import" href="chrome://resources/html/polymer.html">
 <link rel="import" href="chrome://md-settings/about_page/about_page_browser_proxy.html">
+<link rel="import" href="chrome://md-settings/i18n_setup.html">
+<link rel="import" href="chrome://md-settings/icons.html">
 <link rel="import" href="chrome://md-settings/settings_page/main_page_behavior.html">
 <link rel="import" href="chrome://md-settings/settings_page/settings_animated_pages.html">
 <link rel="import" href="chrome://md-settings/settings_page/settings_section.html">
 <link rel="import" href="chrome://md-settings/settings_shared_css.html">
+<link rel="import" href="chrome://resources/cr_elements/icons.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="chrome://md-settings/about_page/detailed_build_info.html">
 <link rel="import" href="chrome://md-settings/settings_page/settings_subpage.html">
 </if>
 
 <dom-module id="settings-about-page">
   <link rel="import" type="css" href="chrome://md-settings/settings_page.css">
   <template>
     <style include="settings-shared main-page-styles">
       span {
         font-size: 20px;
         margin-top: auto;
         margin-bottom: auto;
       }
 
       img {
         -webkit-margin-end: 10px;
       }
+
+      iron-icon {
+        -webkit-margin-end: var(--iron-icon-spacing);
+      }
+
+      iron-icon.check-icon {
+        fill: var(--paper-blue-600);
+      }
+
+      iron-icon.error-icon {
+        fill: var(--paper-red-600);
+      }
     </style>
     <settings-section page-title="$i18n{aboutPageTitle}"
         current-route="[[currentRoute]]" section="about">
       <settings-animated-pages id="pages" current-route="{{currentRoute}}"
           section="about">
         <neon-animatable id="main">
           <div class="settings-box">
             <img id="product-logo"
                 srcset="chrome://theme/current-channel-logo@1x 1x,
                         chrome://theme/current-channel-logo@2x 2x" alt="">
             <span>$i18n{aboutProductTitle}</span>
           </div>
           <div class="settings-box two-line">
-            <!-- TODO(dpapad): Implement this. -->
+            <div hidden="[[!shouldShowUpdateStatus_(currentUpdateStatusEvent_)]]">
+              <iron-icon class$="[[getIconCssClass_(currentUpdateStatusEvent_)]]"
+                  icon="[[getIcon_(currentUpdateStatusEvent_)]]"
+                  src="[[getIconSrc_(currentUpdateStatusEvent_)]]">
+              </iron-icon>
+            </div>
             <div class="start">
-              <div>Your device is up to date</div>
-              <div class="secondary">Version Foo.bar.baz</div>
+              <div hidden="[[!shouldShowUpdateStatus_(currentUpdateStatusEvent_)]]">
+                [[getUpdateStatusMessage_(currentUpdateStatusEvent_)]]
+              </div>
+              <div class="secondary">$i18n{aboutBrowserVersion}</div>
             </div>
-            <div class="secondary-action">
-              <paper-button class="secondary-button">Check for update</paper-button>
-            </div>
+<if expr="chromeos">
+            <paper-button class="secondary-action">Check for update</paper-button>
+</if>
           </div>
           <div id="help" class="settings-box two-line" on-tap="onHelpTap_">
             $i18n{aboutGetHelpUsingChrome}
           </div>
 <if expr="_google_chrome">
           <div id="reportIssue" class="settings-box" on-tap="onReportIssueTap_">
             $i18n{aboutReportAnIssue}
           </div>
 </if>
 <if expr="chromeos">
           <div class="settings-box" on-tap="onDetailedBuildInfoTap_">
             <!-- TODO(dpapad): Localize string. -->
             Detailed build info
           </div>
 </if>
         </neon-animatable>
 <if expr="chromeos">
         <template is="dom-if" name="detailed-build-info">
           <settings-subpage page-title="Detailed build information">
             <settings-detailed-build-info></settings-detailed-build-info>
           </settings-subpage>
         </template>
 </if>
       </settings-animated-pages>
     </settings-section>
   </template>
   <script src="about_page.js"></script>
 </dom-module>