Lose the extra horizontal margins on views

Also get rid of some !important declarations since they were
there to deal with a Polymer specificity bug which has since
been fixed.

Change-Id: Ie7bf8682d52ecf05af920c8a7d67701e629f3e59

polygerrit-ui/app/elements/change-list/gr-change-list-view/gr-change-list-view.html

@@ -25,12 +25,10 @@ limitations under the License.
       :host {
         background-color: var(--view-background-color);
         display: block;
-        margin: 0 var(--default-horizontal-margin);
       }
       .loading,
       .error {
-        margin-top: 1em;
-        background-color: #f1f2f3;
+        padding: 1em var(--default-horizontal-margin);
       }
       .loading {
         color: #666;
@@ -39,11 +37,9 @@ limitations under the License.
         color: #D32F2F;
       }
       gr-change-list {
-        margin-top: 1em;
         width: 100%;
       }
       nav {
-        margin-bottom: 1em;
         padding: .5em 0;
         text-align: center;
       }
@@ -54,9 +50,6 @@ limitations under the License.
         margin-right: .5em;
       }
       @media only screen and (max-width: 50em) {
-        :host {
-          margin: 0;
-        }
         .loading,
         .error {
           padding: 0 var(--default-horizontal-margin);

polygerrit-ui/app/elements/change-list/gr-dashboard-view/gr-dashboard-view.html

@@ -23,21 +23,16 @@ limitations under the License.
       :host {
         background-color: var(--view-background-color);
         display: block;
-        margin: 0 var(--default-horizontal-margin);
       }
       .loading {
-        margin-top: 1em;
         color: #666;
-        background-color: #f1f2f3;
+        background-color: var(--secondary-color);
+        padding: 1em var(--default-horizontal-margin);
       }
       gr-change-list {
-        margin-top: 1em;
         width: 100%;
       }
       @media only screen and (max-width: 50em) {
-        :host {
-          margin: 0;
-        }
         .loading {
           padding: 0 var(--default-horizontal-margin);
         }

polygerrit-ui/app/elements/change/gr-change-view/gr-change-view.html

@@ -36,14 +36,12 @@ limitations under the License.
 <dom-module id="gr-change-view">
   <template>
     <style>
-      .container {
-        margin: 1em var(--default-horizontal-margin);
-      }
       .container:not(.loading) {
         background-color: var(--view-background-color);
       }
       .container.loading {
         color: #666;
+        padding: 1em var(--default-horizontal-margin);
       }
       .headerContainer {
         height: 4.1em;
@@ -63,7 +61,7 @@ limitations under the License.
         position: fixed;
         top: 0;
         transition: box-shadow 250ms linear;
-        width: calc(100% - (2 * var(--default-horizontal-margin)));
+        width: 100%;
       }
       .header-title {
         flex: 1;
@@ -145,28 +143,17 @@ limitations under the License.
         padding: 0 var(--default-horizontal-margin);
       }
       @media screen and (max-width: 50em) {
-        .container {
-          margin: .5em 0 !important;
-        }
-        .container.loading {
-          margin: 1em var(--default-horizontal-margin) !important;
-        }
         .headerContainer {
           height: 5.15em;
         }
         .header {
           align-items: flex-start;
           flex-direction: column;
-          padding: .5em var(--default-horizontal-margin) !important;
+          padding: .5em var(--default-horizontal-margin);
         }
         gr-change-star {
           vertical-align: middle;
         }
-        .header-title,
-        .header-actions,
-        .header.pinned {
-          width: 100% !important;
-        }
         .header-title {
           font-size: 1.1em;
         }
@@ -184,15 +171,15 @@ limitations under the License.
           display: none;
         }
         .patchSelectLabel {
-          margin-left: 0 !important;
+          margin-left: 0;
           margin-right: .5em;
         }
         .header select {
-          margin-left: 0 !important;
+          margin-left: 0;
           margin-right: .5em;
         }
         .header .reply {
-          margin-left: 0 !important;
+          margin-left: 0;
           margin-right: .5em;
         }
         .changeInfo-column:not(:last-of-type) {

polygerrit-ui/app/elements/diff/gr-diff-view/gr-diff-view.html

@@ -29,7 +29,6 @@ limitations under the License.
         display: block;
       }
       h3 {
-        margin-top: 1em;
         padding: .75em var(--default-horizontal-margin);
       }
       .reviewed {

polygerrit-ui/app/elements/gr-app.html

@@ -43,10 +43,15 @@ limitations under the License.
       }
       gr-main-header,
       footer {
-        background-color: var(--primary-color);
         color: var(--primary-text-color);
         padding: .5rem var(--default-horizontal-margin);
       }
+      gr-main-header {
+        background-color: var(--header-background-color, #eee);
+      }
+      footer {
+        background-color: var(--footer-background-color, #eee);
+      }
       main {
         flex: 1;
         position: relative;

polygerrit-ui/app/styles/app-theme.html

@@ -15,10 +15,8 @@ limitations under the License.
 -->
 <style is="custom-style">
 :root {
-  --primary-color: #fff;
   --primary-text-color: #000;
   --search-border-color: #ddd;
-  --secondary-color: #f1f2f3;
   --selection-background-color: #ebf5fb;
   --default-text-color: #000;
   --view-background-color: #fff;