MD Settings: implement "RESTART" button for hardware acceleration to take effect

chrome/browser/resources/settings/system_page/system_page.html

 <link rel="import" href="chrome://resources/html/polymer.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-button.html">
 <link rel="import" href="chrome://md-settings/controls/settings_checkbox.html">
+<link rel="import" href="chrome://md-settings/prefs/prefs.html">
 <link rel="import" href="chrome://md-settings/settings_shared_css.html">
+<link rel="import" href="chrome://md-settings/system_page/system_page_browser_proxy.html">
 
 <dom-module id="settings-system-page">
   <template>
-    <style include="settings-shared"></style>
+    <style include="settings-shared">
+      /* TODO(dbeam): is it worth generalizing this style? Does something like
+       * this already exist (buttons after a checkbox in the same row)? */
+      #hardware-acceleration {
+        align-items: center;
+        display: flex;
+      }
+
+      #hardware-acceleration settings-checkbox {
+        flex: 1;
+      }
+    </style>
     <div class="settings-box block first">
 <if expr="not is_macosx">
       <settings-checkbox i18n-values="label:backgroundAppsLabel"
           pref="{{prefs.background_mode.enabled}}">
       </settings-checkbox>
 </if>
-      <settings-checkbox i18n-values="label:hardwareAccelerationLabel"
-          pref="{{prefs.hardware_acceleration_mode.enabled}}">
-        <!-- TODO(dbeam): restart button. -->
-      </settings-checkbox>
+      <div id="hardware-acceleration">
+        <settings-checkbox i18n-values="label:hardwareAccelerationLabel"
+            pref="{{prefs.hardware_acceleration_mode.enabled}}">
+        </settings-checkbox>
+        <template is="dom-if" if="[[shouldShowRestart_(prefs.hardware_acceleration_mode.enabled.value)]]">
+          <paper-button on-tap="onRestartTap_">$i18n{restart}</paper-button>
+        </template>
+      </div>
     </div>
     <div class="settings-box">
       <div class="button-strip">
-        <paper-button i18n-content="changeProxySettings" class="primary-button"
-            on-tap="onChangeProxySettingsTap_"></paper-button>
+        <paper-button class="primary-button" on-tap="onChangeProxySettingsTap_">
+          $i18n{changeProxySettings}
+        </paper-button>
       </div>
     </div>
   </template>
   <script src="chrome://md-settings/system_page/system_page.js"></script>
 </dom-module>