Cleanup Tool WebUI: Add logs upload checkbox and minor polishing

chrome/browser/resources/settings/chrome_cleanup_page/chrome_cleanup_page.html

 <link rel="import" href="chrome://resources/html/util.html">
 <link rel="import" href="chrome://resources/html/polymer.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/iron-icon/iron-icon.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-button.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-spinner/paper-spinner.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-styles/color.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="../controls/controlled_button.html">
 <link rel="import" href="../controls/settings_toggle_button.html">
 <link rel="import" href="../settings_shared_css.html">
 <link rel="import" href="chrome_cleanup_proxy.html">
 
 <dom-module id="settings-chrome-cleanup-page">
   <template>
     <style include="settings-shared">
+      #about-link {

[tommycli, 2017/07/06 19:00:13]

I don't see an about-link id element in here.

[proberge, 2017/07/06 21:12:56]

Good catch! Removed it.

+        color: var(--paper-blue-700);
+        text-decoration: none;
+      }
+
       #files-to-remove-list {
         -webkit-user-select: text;
         word-break: break-all;
       }
 
       #show-files-button {
+        --paper-button-ink-color: white;
+        /* Left-align the text of the button with the rest of the card's text */
+        -webkit-margin-start: calc(var(--settings-button-edge-spacing) * -1);
         color: var(--google-blue-700);
-        --paper-button-ink-color: white;
         text-transform: inherit;
       }
 
       #status-icon {
         height: 24px;
         width: 24px;
       }
 
       .status-icon-container {
+        -webkit-padding-end: 12px;
         min-width: 28px;
-        padding-right: 12px;
       }
 
       .status-icon-remove {
         --iron-icon-fill-color: var(--paper-grey-700);
       }
 
       .status-icon-done {
         --iron-icon-fill-color: var(--paper-blue-500);
       }
 
@@ skipping 15 matching lines @@
       <template is="dom-if" if="[[showActionButton_]]">
         <div class="separator"></div>
         <paper-button id="action-button" class="primary-button"
             on-tap="proceed_">
           [[actionButtonLabel_]]
         </paper-button>
       </template>
     </div>
     <div id="details-container"
          class="settings-box two-line" hidden="[[!showDetails_]]">
-      <div>[[detailsDescription]]</div>
+      <div>
+        $i18n{chromeCleanupExplanation}
+        <a href="$i18n{chromeCleanupLearnMoreUrl}" target="_blank">
+          $i18n{learnMore}
+        </a>
+      </div>
     </div>
-    <div class="settings-box continuation" hidden="[[!showDetails_]]">
+    <div class="settings-box continuation" hidden="[[!showLogsPermission_]]">
+      <settings-toggle-button class="start"
+              id="chromeCleanupLogsUploadControl"
+              label="$i18n{chromeCleanupLogsUploadPermission}"
+              pref="[[logsUploadPref_]]"
+              on-settings-boolean-control-change="changeLogsPermission_">
+      </settings-toggle-button>
+    </div>
+    <div class="settings-box" hidden="[[!showDetails_]]">
       <div class="show-files-container start" hidden="[[showFilesToRemove_]]">
         <paper-button id="show-files-button" on-tap="showFiles_">
           $i18n{chromeCleanupLinkShowFiles}
         </paper-button>
       </div>
       <div hidden="[[!showFilesToRemove_]]">
         <ul id="files-to-remove-list" class="secondary">
           <template is="dom-repeat" items="[[filesToRemove_]]" as="fileName">
             <li>[[fileName]]</li>
           </template>
         </ul>
       </div>
     </div>
   </template>
   <script src="chrome_cleanup_page.js"></script>
 </dom-module>