Show drive banner better with small width

Bug: 801311
Cq-Include-Trybots: master.tryserver.chromium.linux:closure_compilation
Change-Id: Ibf86a107fe86e95f49b15e54668223ecf0b5df10
Reviewed-on: https://chromium-review.googlesource.com/948163
Commit-Queue: Joel Hockey <joelhockey@chromium.org>
Reviewed-by: Tatsuhisa Yamaguchi <yamaguchi@chromium.org>
Cr-Commit-Position: refs/heads/master@{#541193}

ui/file_manager/file_manager/foreground/css/drive_welcome.css

@@ -13,7 +13,7 @@
 
 .drive-welcome-links {
   flex: none;
-  margin-top: 6px;
+  margin: 6px 0;
 }
 
 .drive-welcome .imitate-paper-button {
@@ -28,7 +28,8 @@
 .drive-welcome.header {
   flex: none;
   height: 128px;
-  overflow: hidden;
+  overflow-x: hidden;
+  overflow-y: auto;
   position: relative;
   transition: height 180ms ease, visibility 0ms linear 180ms;
 }
@@ -39,13 +40,12 @@
 }
 
 .drive-welcome.header .drive-welcome-wrapper {
-  align-items: center;
   background-color: rgb(79, 129, 232);
-  bottom: 0;
   color: white;
   display: flex;
   flex-direction: row;
   left: 0;
+  padding-top: 21px;
   position: absolute;
   right: 0;
   top: 0;
@@ -58,15 +58,15 @@
   border-radius: 4px;
   flex: none;
   height: 78px;
-  margin: 25px;
+  /* Icon should be centered within 128px banner with 25px margin. */
+  /* 4px at top adds to 21px padding-top in drive-welcom-header to make 25px. */
+  margin: 4px 25px 0 25px;
   width: 78px;
 }
 
 .drive-welcome.header .drive-welcome-message {
   -webkit-margin-end: 50px;
   -webkit-margin-start: 20px;
-  display: flex;
-  flex-direction: column;
   z-index: 1;
 }
 
@@ -74,16 +74,10 @@
   font-size: 21px;
   font-weight: 500;
   margin-bottom: 4px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
 }
 
 .drive-welcome.header .drive-welcome-text {
   font-size: 16px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
 }
 
 .drive-welcome.header .drive-welcome-dismiss {