move reviews table styling into it's own partial and show emails that are too long on hover

opentech/apply/funds/templates/funds/includes/review_table.html

 {% load review_tags %}
 
-<table class="table table--reviews-sidebar">
+<table class="reviews-sidebar">
     <tr class="tr tr--subchild light-grey-bg">
         <th colspan="2"></th>
         <th>{{ object.reviews.submitted.recommendation|traffic_light }}</th>

opentech/apply/funds/templates/funds/includes/review_table_row.html

 {% for review in reviews %}
     <tr class="tr--subchild {% if missing %}no-response{% endif %}">
         {% if missing %}
-            <td class="td td--author" colspan="2">{{ review }}</td>
+            <td colspan="2">{{ review }}</td>
             <td>-</td>
             <td>-</td>
         {% else %}
-            <td class="td td--author" colspan="2">
+            <td class="reviews-sidebar__author" colspan="2">
                 {% if request.user.is_apply_staff %}
-                    <a href="{% url 'apply:reviews:review' submission_pk=review.submission.id pk=review.id %}">{{ review.author }}</a></td>
+                    <a href="{% url 'apply:reviews:review' submission_pk=review.submission.id pk=review.id %}">
+                        {{ review.author }}
+                    </a>
                 {% else %}
                     {{ review.author }}
                 {% endif %}
+            </td>
             <td>{{ review.get_recommendation_display }}</td>
             <td>{{ review.score }}</td>
         {% endif %}

opentech/static_src/src/sass/apply/components/_reviews-sidebar.scss

+.reviews-sidebar {
+    $root: &;
+    margin-bottom: 20px;
+    font-weight: $weight--bold;
+
+    tbody {
+        tr {
+            @include media-query(tablet-portrait) {
+                border-bottom: 0;
+            }
+
+            &:hover {
+                box-shadow: none;
+            }
+
+            > th {
+                font-size: inherit;
+                font-weight: $weight--bold;
+            }
+
+            > td {
+                display: table-cell;
+                height: auto;
+            }
+
+            th,
+            td,
+            td:last-child,
+            td:first-child {
+                padding: 10px;
+            }
+
+            &.no-response {
+                color: $color--black-20;
+            }
+        }
+    }
+
+    &__author {
+        a {
+            position: relative;
+            z-index: 1;
+            display: block;
+            overflow: hidden;
+            background: $color--white;
+        }
+
+        &:hover {
+            a {
+                display: inline;
+                overflow: visible;
+            }
+        }
+    }
+}

opentech/static_src/src/sass/apply/components/_table.scss

@@ -7,44 +7,6 @@ table,
     border-collapse: collapse;
     table-layout: fixed;
 
-    &--reviews-sidebar {
-        margin-bottom: 20px;
-        font-weight: $weight--bold;
-
-        tbody {
-            tr {
-                @include media-query($table-breakpoint) {
-                    border-bottom: 0;
-                }
-
-                &:hover {
-                    box-shadow: none;
-                }
-
-                > th {
-                    font-size: inherit;
-                    font-weight: $weight--bold;
-                }
-
-                > td {
-                    display: table-cell;
-                    height: auto;
-                }
-
-                th,
-                td,
-                td:last-child,
-                td:first-child {
-                    padding: 10px;
-                }
-
-                &.no-response {
-                    color: $color--black-20;
-                }
-            }
-        }
-    }
-
     &--transparent {
         background-color: transparent;
     }
@@ -317,9 +279,6 @@ table,
     }
 
     td {
-        &--author {
-            word-break: break-all;
-        }
 
         &.comments {
             display: none;

opentech/static_src/src/sass/apply/main.scss

@@ -35,6 +35,7 @@
 @import 'components/pagination';
 @import 'components/reviews-list';
 @import 'components/reviews-summary';
+@import 'components/reviews-sidebar';
 @import 'components/select2';
 @import 'components/table';
 @import 'components/traffic-light';