From 3d6ca103eef208d9c9e5181f8e3810ea0815395e Mon Sep 17 00:00:00 2001
From: Tao Zhou <taoalpha@google.com>
Date: Fri, 6 Dec 2019 14:48:48 +0100
Subject: [PATCH] Wrap file names into multiple lines if its too long

Increase the small screen breakpoint to 55em (~768px - 14px font size)

Change-Id: I38d0c10666a2546b8505f9ba1b4f93cdfca25998
---
 .../elements/change/gr-file-list/gr-file-list.html    | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/polygerrit-ui/app/elements/change/gr-file-list/gr-file-list.html b/polygerrit-ui/app/elements/change/gr-file-list/gr-file-list.html
index 318633d58f..0a7f1ce0fa 100644
--- a/polygerrit-ui/app/elements/change/gr-file-list/gr-file-list.html
+++ b/polygerrit-ui/app/elements/change/gr-file-list/gr-file-list.html
@@ -116,6 +116,9 @@ limitations under the License.
         cursor: pointer;
         flex: 1;
         text-decoration: none;
+        /* Wrap it into multiple lines if too long. */
+        white-space: normal;
+        word-break: break-word;
       }
       .path:hover :first-child {
         text-decoration: underline;
@@ -197,10 +200,6 @@ limitations under the License.
       .truncatedFileName {
         display: none;
       }
-      .expanded .fullFileName {
-        white-space: normal;
-        word-wrap: break-word;
-      }
       .mobile {
         display: none;
       }
@@ -247,7 +246,9 @@ limitations under the License.
         margin: -2px 0;
         padding: var(--spacing-s) 0;
       }
-      @media screen and (max-width: 50em) {
+
+      /** small screen breakpoint: 768px */
+      @media screen and (max-width: 55em) {
         .desktop {
           display: none;
         }