1 files changed, 36 insertions, 16 deletions

diff --git a/polygerrit-ui/app/elements/change/gr-download-dialog/gr-download-dialog.html b/polygerrit-ui/app/elements/change/gr-download-dialog/gr-download-dialog.html
index fdd9b268bb..28d25d27da 100644
--- a/polygerrit-ui/app/elements/change/gr-download-dialog/gr-download-dialog.html
+++ b/polygerrit-ui/app/elements/change/gr-download-dialog/gr-download-dialog.html
@@ -1,4 +1,5 @@
 <!--
+@license
 Copyright (C) 2016 The Android Open Source Project
 
 Licensed under the Apache License, Version 2.0 (the "License");
@@ -18,29 +19,41 @@ limitations under the License.
 
 <link rel="import" href="../../../behaviors/gr-patch-set-behavior/gr-patch-set-behavior.html">
 <link rel="import" href="../../../behaviors/rest-client-behavior/rest-client-behavior.html">
-<link rel="import" href="../../shared/gr-download-commands/gr-download-commands.html">
 <link rel="import" href="../../../styles/shared-styles.html">
+<link rel="import" href="../../shared/gr-download-commands/gr-download-commands.html">
 
 <dom-module id="gr-download-dialog">
   <template>
     <style include="shared-styles">
       :host {
+        background-color: var(--dialog-background-color);
         display: block;
-        padding: 1em;
       }
-      header {
+      section {
         display: flex;
+        padding: .5em 1.5em;
+      }
+      section:not(:first-of-type) {
+        border-top: 1px solid var(--border-color);
       }
-      footer {
+      .flexContainer {
         display: flex;
         justify-content: space-between;
         padding-top: .75em;
       }
+      .footer {
+        justify-content: flex-end;
+      }
       .closeButtonContainer {
+        align-items: flex-end;
         display: flex;
         flex: 0;
         justify-content: flex-end;
       }
+      .patchFiles,
+      .archivesContainer {
+        padding-bottom: .5em;
+      }
       .patchFiles {
         margin-right: 2em;
       }
@@ -54,27 +67,27 @@ limitations under the License.
         margin-right: 0;
       }
       .title {
-        text-align: center;
         flex: 1;
+        font-weight: var(--font-weight-bold);
+      }
+      .hidden {
+        display: none;
       }
     </style>
-    <header>
+    <section>
       <span class="title">
         Patch set [[patchNum]] of [[_computePatchSetQuantity(change.revisions)]]
       </span>
-      <span class="closeButtonContainer">
-        <gr-button id="closeButton"
-            link
-            on-tap="_handleCloseTap">Close</gr-button>
-      </span>
-    </header>
-     <gr-download-commands
+    </section>
+    <section class$="[[_computeShowDownloadCommands(_schemes)]]">
+      <gr-download-commands
           id="downloadCommands"
           commands="[[_computeDownloadCommands(change, patchNum, _selectedScheme)]]"
           schemes="[[_schemes]]"
           selected-scheme="{{_selectedScheme}}"></gr-download-commands>
-    <footer>
-      <div class="patchFiles">
+    </section>
+    <section class="flexContainer">
+      <div class="patchFiles" hidden="[[_computeHidePatchFile(change, patchNum)]]" hidden>
         <label>Patch file</label>
         <div>
           <a
@@ -102,7 +115,14 @@ limitations under the License.
           </template>
         </div>
       </div>
-    </footer>
+    </section>
+    <section class="footer">
+      <span class="closeButtonContainer">
+        <gr-button id="closeButton"
+            link
+            on-tap="_handleCloseTap">Close</gr-button>
+      </span>
+    </section>
   </template>
   <script src="gr-download-dialog.js"></script>
 </dom-module>