Cleanup UI columns on change list

This change involves positioning items better and not having them
overflow onto second+ lines.

It is pretty difficult to make blanket rules regarding how wide certain
columns can be. It also doesn't work to say white-space nowrap and have
cells truncated. If white-space nowrap is applied across the board,
the full width of content is displayed and the table will have a scroll
bar.

Here's what this change does to improve the situation:

- Remove max-width from CSS rules, because items were cut off when
  there would have been enough space, it was too difficult to guess
  what the correct width was (some projects have long names, branch
  names, etc).

- Add white-space nowrap to all columns except for Subject
    - These columns will never get truncated and will display on a
      single line.

- Add various styles to the subject in order to achieve a single line
  truncated with ellipses.
    - When the window size shrinks, Extra space will be taken out here.

Bug: Issue 5410, Issue 5335, Issue 4254
Change-Id: I96f215cb4adf2e8b54b771afd14e7f57e96bce41

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

@@ -39,40 +39,26 @@ limitations under the License.
       gr-change-star {
         vertical-align: middle;
       }
-      .number {
-        max-width: 4em;
-      }
-      .subject {
-        word-break: break-word;
-      }
-      .status {
-        max-width: 9em;
-      }
-      .owner {
-        max-width: 15em;
-      }
-      .project,
-      .branch {
-        overflow: hidden;
-        white-space: nowrap;
-        text-overflow: ellipsis;
-      }
+      .keyboard,
+      .branch,
+      .star,
+      .label,
+      .number,
+      .owner,
+      .updated,
+      .size,
+      .status,
       .project {
-        max-width: 10em;
-      }
-      .branch {
-        max-width: 7em;
+        white-space: nowrap;
       }
       .updated {
-        max-width: 9em;
         text-align: right;
       }
-      .size {
-        max-width: 9em;
+      .size,
+      .updated {
         text-align: right;
       }
       .label {
-        max-width: 2.6em;
         text-align: center;
       }
       @media only screen and (max-width: 50em) {