Print Preview Refresh: fix destinations icon issue

(1) Fix an issue where icons were shrinking with browser window size
(2) Related: To make the fact that the destination-list-item uses
    display:flex more clear, move all styling for this item into its
    own HTML file, rather than splitting with its parent list.
(3) Remove margin which was not needed since the item uses padding.
(4) Ensure max-height never gets set below min-height, and set a
    min-height for the list container.

Bug: 890700
Change-Id: I4f91e43024faea494dbc5a48f6590ca3b863136e
Reviewed-on: https://chromium-review.googlesource.com/1256004Reviewed-by: Demetrios Papadopoulos <dpapad@chromium.org>
Commit-Queue: Rebekah Potter <rbpotter@chromium.org>
Cr-Commit-Position: refs/heads/master@{#595673}

chrome/browser/resources/print_preview/new/destination_dialog.html

@@ -81,8 +81,6 @@
         padding-bottom: 18px;
       }
 
-      /* Height = 100vh - recent (94px + 1 line + 18px) - padding (68px) - */
-      /* header (82px + 1 line) - button (64px) - 2px spinner - 2px extra */
       #printList {
         flex: 1;
         min-height: calc(94px + 20 / 13 * 1rem);

chrome/browser/resources/print_preview/new/destination_list.html

@@ -26,7 +26,7 @@
 
       #listContainer {
         flex: 1;
-        min-height: 0;
+        min-height: 84px;
       }
 
       .title,
@@ -73,17 +73,6 @@
         padding-top: 8px;
       }
 
-      .list-item {
-        cursor: default;
-        display: flex;
-        font-size: calc(12/13 * 1em);
-        min-height: 28px;
-        padding-bottom: 2px;
-        padding-inline-end: 2px;
-        padding-inline-start: 14px;
-        padding-top: 2px;
-      }
-
       :not(.moving).list-item {
         transition: background-color 150ms;
       }

chrome/browser/resources/print_preview/new/destination_list.js

@@ -64,12 +64,10 @@ Polymer({
         return;
 
       const entry = assert(entries[0]);
-      const fullHeight = entry.contentRect.height;
-      // Setting maxHeight to 0 freezes the UI when re-rendering the dialog.
-      if (fullHeight > 0) {
+      // Don't set maxHeight below the minimum height.
+      const fullHeight = Math.max(entry.contentRect.height, 84);
       this.$.list.style.maxHeight = `${fullHeight}px`;
       this.forceIronResize();
-      }
     });
     this.resizeObserver_.observe(this.$.listContainer);
   },

chrome/browser/resources/print_preview/new/destination_list_item.html

@@ -17,8 +17,15 @@
     <style include="print-preview-shared action-link cr-hidden-style">
       :host {
         align-items: center;
-        margin: 4px 0;
+        cursor: default;
+        display: flex;
+        font-size: calc(12/13 * 1em);
+        min-height: 28px;
         opacity: .87;
+        padding-bottom: 2px;
+        padding-inline-end: 2px;
+        padding-inline-start: 14px;
+        padding-top: 2px;
         vertical-align: middle;
       }
 
@@ -35,10 +42,11 @@
 
       iron-icon {
         fill: var(--google-grey-600);
+        flex: 0;
         height: 20px;
         margin-inline-end: 12px;
+        min-width: 20px;
         transition: opacity 150ms;
-        width: 20px;
       }
 
       .name {