Allow diff file picker to not text transform gr-button text

Also fixes flex alignment

Change-Id: Ied7c3905e4d00c17c1627cdc5979549e00ade3b6
diff --git a/polygerrit-ui/app/elements/diff/gr-diff-view/gr-diff-view.html b/polygerrit-ui/app/elements/diff/gr-diff-view/gr-diff-view.html
index 203d34f..8ae5617 100644
--- a/polygerrit-ui/app/elements/diff/gr-diff-view/gr-diff-view.html
+++ b/polygerrit-ui/app/elements/diff/gr-diff-view/gr-diff-view.html
@@ -59,6 +59,7 @@
         padding: .75em var(--default-horizontal-margin);
       }
       .patchRangeLeft {
+        align-items: center;
         display: flex;
       }
       .navLink:not([href]),
@@ -79,12 +80,6 @@
       .mobile {
         display: none;
       }
-      .downArrow {
-        display: inline-block;
-        font-size: .6em;
-        user-select: none;
-        vertical-align: middle;
-      }
       .dropdown-trigger {
         cursor: pointer;
         padding: 0;
@@ -227,9 +222,14 @@
               on-change="_handleReviewedChange"
               hidden$="[[!_loggedIn]]" hidden>
           <div class="jumpToFileContainer desktop">
-            <gr-button link class="dropdown-trigger" id="trigger" on-tap="_showDropdownTapHandler">
+            <gr-button
+                down-arrow
+                no-uppercase
+                link
+                class="dropdown-trigger"
+                id="trigger"
+                on-tap="_showDropdownTapHandler">
               <span>[[computeDisplayPath(_path)]]</span>
-              <span class="downArrow">&#9660;</span>
             </gr-button>
             <!-- *-align="" to disable iron-dropdown's element positioning. -->
             <iron-dropdown id="dropdown"
diff --git a/polygerrit-ui/app/elements/shared/gr-button/gr-button.html b/polygerrit-ui/app/elements/shared/gr-button/gr-button.html
index f63d7923..6f37981 100644
--- a/polygerrit-ui/app/elements/shared/gr-button/gr-button.html
+++ b/polygerrit-ui/app/elements/shared/gr-button/gr-button.html
@@ -50,6 +50,9 @@
         background-color: var(--gr-button-background, #fff);
         color: var(--gr-button-color, --color-link);
       }
+      :host([no-uppercase]) paper-button {
+        text-transform: none;
+      }
       /* todo (beckysiegel) switch all secondary to primary as there is no color
         distinction anymore. */
       :host([primary]) paper-button[raised],
diff --git a/polygerrit-ui/app/elements/shared/gr-button/gr-button.js b/polygerrit-ui/app/elements/shared/gr-button/gr-button.js
index 80c0a9b..551fd7f 100644
--- a/polygerrit-ui/app/elements/shared/gr-button/gr-button.js
+++ b/polygerrit-ui/app/elements/shared/gr-button/gr-button.js
@@ -32,6 +32,10 @@
         observer: '_disabledChanged',
         reflectToAttribute: true,
       },
+      noUppercase: {
+        type: Boolean,
+        value: false,
+      },
       _enabledTabindex: {
         type: String,
         value: '0',