Fix reply dialog overlay on Android

Previously, on Android devices, when the gr-reply-dialog overlay is
opene, important contents could get cut off, including the submit and
cancel buttons. This change makes the reply dialog scrollable and full
width on small screens.  The max-height is also 100% so if scrolling is
required, the overlay will appear full screen.

Bug: Issue 4944
Change-Id: Ibf265a3039129363e479cbb3c29cb887aa23d889

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

@@ -177,7 +177,7 @@ limitations under the License.
         }
         gr-reply-dialog {
           min-width: initial;
-          width: 90vw;
+          width: 100vw;
         }
         .downloadContainer {
           display: none;
@@ -213,6 +213,9 @@ limitations under the License.
           flex: initial;
           margin-right: 0;
         }
+        .scrollable {
+          @apply(--layout-scroll);
+        }
       }
     </style>
     <div class="container loading" hidden$="[[!_loading]]">Loading...</div>
@@ -348,6 +351,7 @@ limitations under the License.
           on-close="_handleDownloadDialogClose"></gr-download-dialog>
     </gr-overlay>
     <gr-overlay id="replyOverlay"
+        class="scrollable"
         no-cancel-on-outside-click
         on-iron-overlay-opened="_handleReplyOverlayOpen"
         with-backdrop>

polygerrit-ui/app/elements/change/gr-reply-dialog/gr-reply-dialog.html

@@ -138,6 +138,14 @@ limitations under the License.
       .action:visited {
         color: #00e;
       }
+      @media screen and (max-width: 50em) {
+        :host {
+          max-height: none;
+        }
+        .container {
+          max-height: none;
+        }
+      }
     </style>
     <div class="container">
       <section class="peopleContainer">