UX: Responsive reviewables down to tablet width

UX: Responsive reviewables down to tablet width

diff --git a/app/assets/stylesheets/common/base/reviewables.scss b/app/assets/stylesheets/common/base/reviewables.scss
index 0dbd182..80f278c 100644
--- a/app/assets/stylesheets/common/base/reviewables.scss
+++ b/app/assets/stylesheets/common/base/reviewables.scss
@@ -245,14 +245,15 @@
       margin-left: 0.5em;
     }
   }
-  .user {
+  .user,
+  .reviewed-by {
     display: flex;
     align-items: center;
     white-space: nowrap;
+  }
 
-    .user-flag-percentage {
-      margin-left: 0.5em;
-    }
+  .user-flag-percentage {
+    margin-left: 0.5em;
   }
 
   .d-icon {
@@ -290,8 +291,7 @@
       padding: 0.5em 1em 0.5em 0;
     }
     .reviewable-score-spacer {
-      padding-left: 0.5em;
-      padding-right: 1.5em;
+      padding-right: 1em;
     }
   }
 }
@@ -399,3 +399,22 @@
     margin-bottom: 0.5em;
   }
 }
+
+@media screen and (max-width: 1000px) {
+  table.reviewable-scores {
+    width: 100%;
+    display: block;
+    tbody {
+      width: 100%;
+      display: block;
+    }
+  }
+  tr.reviewable-score {
+    display: grid;
+    grid-template-columns: auto auto 1fr;
+    grid-template-rows: 1fr 1fr;
+  }
+  td.reviewable-score-spacer {
+    display: none;
+  }
+}

GitHub sha: b71f19d3