PDF Viewer Update: Align thumbnails for sidenav icons

If the sidenav icons are shown, add some padding to the right of the
thumbnails.

Before and after photos: https://imgur.com/a/a6T0DD2

Bug: 652400
Change-Id: I15039ab0b672a3e6fac370f10278c1a45f890553
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2434094
Commit-Queue: Daniel Hosseinian <dhoss@chromium.org>
Reviewed-by: John Lee <johntlee@chromium.org>
Cr-Commit-Position: refs/heads/master@{#812231}

chrome/browser/resources/pdf/elements/viewer-pdf-sidenav.html

@@ -22,6 +22,10 @@
     overflow-x: hidden;
   }
 
+  #icons:not([hidden]) + #content {
+    --viewer-thumbnail-bar-padding-inline-end: 28px;
+  }
+
   .selected cr-icon-button {
     --cr-icon-button-fill-color: var(--sidenav-selected-tab-color);
   }

chrome/browser/resources/pdf/elements/viewer-thumbnail-bar.html

 <style>
+  :host(:focus) {
+    outline: none;
+  }
+
   #thumbnails {
     box-sizing: border-box;
     height: 100%;
     overflow: auto;
     padding: 24px 0;
+    padding-inline-end: var(--viewer-thumbnail-bar-padding-inline-end);
     text-align: center;
   }