Use the same font everywhere in gr-diff

Pulls the monospace font rule in gr-diff into :host. The monospace font
should apply to everywhere by default, e.g. also to the context control
rows.

Before https://i.imgur.com/oMSfhC5.png
After: https://i.imgur.com/2PqhxKf.png

Also fix the black color of the hyphens in the context control rows.

Change-Id: I8ee16b46da6dd0454d0b8991cc0836d7a4550f8d

polygerrit-ui/app/elements/diff/gr-diff/gr-diff.html

@@ -42,6 +42,11 @@ limitations under the License.
         max-width: var(--content-width, 80ch);
         white-space: normal;
       }
+      :host {
+        font-family: var(--monospace-font-family, ''), 'Roboto Mono';
+        font-size: var(--font-size, 12px);
+        line-height: var(--line-height-mono, 16px);
+      }
 
       .thread-group {
         display: block;
@@ -106,8 +111,6 @@ limitations under the License.
       }
       .lineNum,
       .content {
-        /* Set font size based the user's diff preference. */
-        font-size: var(--font-size, var(--font-size-normal));
         vertical-align: top;
         white-space: pre;
       }
@@ -184,6 +187,7 @@ limitations under the License.
       .contextControl {
         background-color: var(--diff-context-control-background-color);
         border: 1px solid var(--diff-context-control-border-color);
+        color: var(--diff-context-control-color);
       }
       .contextControl gr-button {
         display: inline-block;
@@ -225,8 +229,6 @@ limitations under the License.
         background-color: var(--table-header-background-color);
         border-bottom: 1px solid var(--border-color);
         color: var(--link-color);
-        font-family: var(--monospace-font-family);
-        font-size: var(--font-size, var(--font-size-normal));
         padding: var(--spacing-m) 0 var(--spacing-m) 48px;
       }
       #loadingError,
@@ -254,8 +256,6 @@ limitations under the License.
       }
       td.blame {
         display: none;
-        font-family: var(--font-family);
-        font-size: var(--font-size, var(--font-size-normal));
         padding: 0 var(--spacing-m);
         white-space: pre;
       }
@@ -278,11 +278,6 @@ limitations under the License.
         overflow: hidden;
         width: 200px;
       }
-      /** Since the line limit position is determined by charachter size, blank
-       lines also need to have the same font size as everything else */
-      .full-width .blank {
-        font-size: var(--font-size, var(--font-size-normal));
-      }
       /** Support the line length indicator **/
       .full-width td.content,
       .full-width td.blank {

polygerrit-ui/app/styles/themes/app-theme.html

@@ -80,6 +80,7 @@ html {
   --font-size-h3: 1.154rem;  /* 15px */
   --font-size-h2: 1.5rem;    /* 19.5px */
   --font-size-h1: 2rem;      /* 26px */
+  --line-height-mono: 16px;
   --line-height-small: 1.4;  /* 16.8px */
   --line-height-normal: 1.4; /* 18.2px */
   --line-height-h3: 1.4;     /* 21.0px */