From 55aa5a0d1212322cc186c894e5a56ef754add3a1 Mon Sep 17 00:00:00 2001
From: Paulus Schoutsen <balloob@gmail.com>
Date: Tue, 16 Jul 2019 21:39:38 -0700
Subject: [PATCH] Scroll device list when goes out of screen. Fixes #3343

---
 src/dialogs/config-flow/step-flow-create-entry.ts | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/src/dialogs/config-flow/step-flow-create-entry.ts b/src/dialogs/config-flow/step-flow-create-entry.ts
index ac38ba95ed..5ecc457a40 100644
--- a/src/dialogs/config-flow/step-flow-create-entry.ts
+++ b/src/dialogs/config-flow/step-flow-create-entry.ts
@@ -69,9 +69,10 @@ class StepFlowCreateEntry extends LitElement {
                   (device) =>
                     html`
                       <div class="device">
-                        <b>${device.name}</b><br />
-                        ${device.model} (${device.manufacturer})
-
+                        <div>
+                          <b>${device.name}</b><br />
+                          ${device.model} (${device.manufacturer})
+                        </div>
                         <paper-dropdown-menu-light
                           label="Area"
                           .device=${device.id}
@@ -157,6 +158,8 @@ class StepFlowCreateEntry extends LitElement {
           display: flex;
           flex-wrap: wrap;
           margin: -4px;
+          max-height: 600px;
+          overflow-y: auto;
         }
         .device {
           border: 1px solid var(--divider-color);
@@ -178,7 +181,7 @@ class StepFlowCreateEntry extends LitElement {
         }
         @media all and (max-width: 450px), all and (max-height: 500px) {
           .device {
-            width: auto;
+            width: 100%;
           }
         }
       `,