[MD settings] layout of site details permissions

chrome/browser/resources/settings/site_settings/site_details.html

 <link rel="import" href="chrome://resources/html/polymer.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/iron-flex-layout/iron-flex-layout.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-icon-button/paper-icon-button.html">
 <link rel="import" href="/icons.html">
 <link rel="import" href="/settings_shared_css.html">
 <link rel="import" href="/site_settings/constants.html">
 <link rel="import" href="/site_settings/site_details_permission.html">
 <link rel="import" href="/site_settings/site_settings_behavior.html">
 <link rel="import" href="/site_settings/website_usage_private_api.html">
 
 <dom-module id="site-details">
   <template>
     <style include="settings-shared">
-      :host {
-        -webkit-margin-start: 4px;
-        display: block;
-      }
-
-      .origin-box {
-        margin-bottom: 20px;
-      }
-
-      .origin {
-        -webkit-margin-start: 10px;
-        font-weight: 500;
-      }
-
-      .reset-button {
-        -webkit-margin-start: 15px;
-      }
-
       #storage {
         -webkit-padding-end: 0;
       }
-
-      .website-icon {
-        background-repeat: no-repeat;
-        background-size: contain;
-        height: 16px;
-        width: 16px;
-      }
     </style>
-    <div class="settings-box block">
-      <div class="horizontal layout origin-box">
-        <div class="website-icon"
-            style$="[[computeSiteIcon(site.originForDisplay)]]"></div>
-        <div class="origin flex">[[site.originForDisplay]]</div>
+    <!-- TODO(dschuyler): change this to a dom-if. -->

[tommycli, 2016/08/04 01:41:02]

Why not do it now? Or you could just leave it hidden, and that seems OK to me
too.

[dschuyler, 2016/08/04 20:03:52]

Done.

+    <div id="usage" hidden$="[[!storedData_]]">
+      <div class="settings-box first">
+        <h2>$i18n{siteSettingsUsage}</h2>
       </div>
-      <h2 id="usage" hidden$="[[!storedData_]]">$i18n{siteSettingsUsage}</h2>
-      <paper-item id="storage" hidden$="[[!storedData_]]">
-        <div class="flex">[[storedData_]]</div>
-        <paper-icon-button icon="settings:delete"
-            on-tap="onClearStorage_"
-            alt="$i18n{siteSettingsDelete}"></paper-icon-button>
-      </paper-item>
+      <div class="list-frame">
+        <paper-item id="storage" hidden$="[[!storedData_]]">
+          <div class="flex">[[storedData_]]</div>
+          <paper-icon-button icon="settings:delete"
+              on-tap="onClearStorage_"
+              alt="$i18n{siteSettingsDelete}"></paper-icon-button>
+        </paper-item>
+      </div>
+    </div>
+    <div class="settings-box">
       <h2>$i18n{siteSettingsPermissions}</h2>
-
+    </div>
+    <div class="list-frame">
       <site-details-permission site="[[site]]" id="cookies"
           category="{{ContentSettingsTypes.COOKIES}}">
       </site-details-permission>
       <site-details-permission site="[[site]]" id="geolocation"
           category="{{ContentSettingsTypes.GEOLOCATION}}">
       </site-details-permission>
       <site-details-permission site="[[site]]" id="camera"
           category="{{ContentSettingsTypes.CAMERA}}">
       </site-details-permission>
       <site-details-permission site="[[site]]" id="mic"
@@ skipping 20 matching lines @@
       <site-details-permission site="[[site]]" id="automaticDownloads"
           category="{{ContentSettingsTypes.AUTOMATIC_DOWNLOADS}}">
       </site-details-permission>
       <site-details-permission site="[[site]]" id="unsandboxedPlugins"
           category="{{ContentSettingsTypes.UNSANDBOXED_PLUGINS}}">
       </site-details-permission>
       <site-details-permission site="[[site]]" id="fullscreen"
           category="{{ContentSettingsTypes.FULLSCREEN}}">
       </site-details-permission>
 
-      <paper-button on-tap="onClearAndReset_" raised class="reset-button">
+      <div on-tap="onClearAndReset_" raised class="list-item list-button">
         $i18n{siteSettingsClearAndReset}
-      </paper-button>
+      </div>
     </div>
     <website-usage-private-api id="usageApi"
         website-data-usage="{{storedData_}}"
         website-storage-type="{{storageType_}}">
     </website-usage-private-api>
   </template>
   <script src="site_details.js"></script>
 </dom-module>