Merge "Update selected change item styling"

polygerrit-ui/app/elements/change-list/gr-change-list-item/gr-change-list-item.html

@@ -32,11 +32,15 @@ limitations under the License.
       :host {
         display: table-row;
       }
+      :host:focus {
+        outline: none;
+      }
       :host(:hover) {
         background-color: #f5fafd;
       }
       :host([selected]) {
-        background-color: #ebf5fb;
+        border: 1px solid #2a66d9;
+        border-left-width: .5rem;
       }
       :host([needs-review]) {
         font-family: var(--font-family-bold);
@@ -44,9 +48,6 @@ limitations under the License.
       :host([assigned]) {
         background-color: #fcfad6;
       }
-      :host([selected][assigned]) {
-        background-color: #fcfaa6;
-      }
       .container {
         position: relative;
       }
@@ -103,13 +104,15 @@ limitations under the License.
         :host {
           display: flex;
         }
+        :host([selected]) {
+          border: none;
+          border-top: 1px solid #ddd;
+        }
       }
     </style>
     <style include="gr-change-list-styles"></style>
-    <td class="keyboard">
-      <span class="positionIndicator">&#x25b6;</span>
-    </td>
-    <td class="star" hidden$="[[!showStar]]" hidden>
+    <td class="cell keyboard"></td>
+    <td class="cell star" hidden$="[[!showStar]]" hidden>
       <gr-change-star change="{{change}}"></gr-change-star>
     </td>
     <td class="cell number" hidden$="[[!showNumber]]" hidden>

polygerrit-ui/app/styles/gr-change-list-styles.html

@@ -19,7 +19,7 @@ limitations under the License.
       :host {
         font-size: var(--font-size-normal);
       }
-      gr-change-list-item,
+      gr-change-list-item:not([selected]),
       tr {
         border-top: 1px solid #ddd;
       }
@@ -106,8 +106,9 @@ limitations under the License.
           justify-content: space-between;
           padding: .25em .5em;
         }
-        gr-change-list-item[selected] {
-          background-color: transparent;
+        .cell {
+          align-items: center;
+          display: flex;
         }
         .topHeader,
         .keyboard,
@@ -121,10 +122,6 @@ limitations under the License.
         .noChanges .star {
           display: none;
         }
-        .star {
-          padding-left: .35em;
-          padding-top: .25em;
-        }
         .groupHeader .cell,
         .noChanges .cell {
           padding: 0 .5em;