1 files changed, 57 insertions, 15 deletions

diff --git a/polygerrit-ui/app/styles/gr-table-styles.html b/polygerrit-ui/app/styles/gr-table-styles.html
index 6b8c88d0d7..13089526c3 100644
--- a/polygerrit-ui/app/styles/gr-table-styles.html
+++ b/polygerrit-ui/app/styles/gr-table-styles.html
@@ -1,4 +1,5 @@
 <!--
+@license
 Copyright (C) 2017 The Android Open Source Project
 
 Licensed under the Apache License, Version 2.0 (the "License");
@@ -17,41 +18,82 @@ limitations under the License.
 <dom-module id="gr-table-styles">
   <template>
     <style>
-      .genericList .loading {
-        display: none;
-      }
       .genericList {
         border-collapse: collapse;
         width: 100%;
       }
-      .genericList tr.table {
-        border-bottom: 1px solid #eee;
+      .genericList td {
+        height: 2.25rem;
+        padding: .3rem 0;
+        vertical-align: middle;
+      }
+      .genericList tr {
+        border-bottom: 1px solid var(--border-color);
+      }
+      .genericList tr:hover {
+        background-color: var(--hover-background-color);
+      }
+      .genericList th {
+        white-space: nowrap;
+      }
+      .genericList th,
+      .genericList td {
+        padding-right: 1rem;
+      }
+      .genericList tr th:first-of-type,
+      .genericList tr td:first-of-type {
+        padding-left: 1rem;
+      }
+      .genericList tr:first-of-type {
+        border-top: 1px solid var(--border-color);
+      }
+      .genericList tr th:last-of-type,
+      .genericList tr td:last-of-type {
+        border-left: 1px solid var(--border-color);
+        text-align: center;
+        padding: 0 1em;
+      }
+      .genericList tr th.delete,
+      .genericList tr td.delete,
+      .genericList tr.loadingMsg td {
+        border-left: none;
+      }
+      .genericList .loading {
+        border: none;
+        display: none;
       }
       .genericList td {
         flex-shrink: 0;
-        padding: .3em .5em;
       }
-      .genericList th {
-        background-color: #ddd;
-        border-bottom: 1px solid #eee;
-        font-family: var(--font-family-bold);
-        padding: .3em .5em;
+      .genericList .topHeader,
+      .genericList .groupHeader {
+        color: var(--primary-text-color);
+        font-weight: var(--font-weight-bold);
         text-align: left;
+        vertical-align: middle
+      }
+      .genericList .topHeader {
+        background-color: var(--table-header-background-color);
+        height: 3rem;
+      }
+      .genericList .groupHeader {
+        background-color: var(--table-subheader-background-color);
+        font-size: var(--font-size-large);
       }
       .genericList a {
-        color: var(--default-text-color);
+        color: var(--primary-text-color);
         text-decoration: none;
       }
       .genericList a:hover {
         text-decoration: underline;
       }
       .genericList .description {
-        width: 70%;
+        width: 99%;
       }
       .genericList .loadingMsg {
-        color: #666;
+        color: var(--deemphasized-text-color);
         display: block;
-        padding: 1em var(--default-horizontal-margin);
+        padding: .3em var(--default-horizontal-margin);
       }
       .genericList .loadingMsg:not(.loading) {
         display: none;