move reviews list table styling in to it's own partial

opentech/apply/review/templates/review/review_list.html

@@ -20,12 +20,12 @@
     </div>
 </div>
 <div class="wrapper wrapper--reviews-table js-reviews-table">
-    <table class="table table--reviews">
+    <table class="reviews-list">
     {% for question, answers in review_data.items %}
-        <tr>
-            <th>{{ question }}</th>
+        <tr class="reviews-list__tr">
+            <th class="reviews-list__th">{{ question }}</th>
             {% for answer in answers %}
-                <td>{{ answer|bleach }}</td>
+                <td class="reviews-list__td">{{ answer|bleach }}</td>
             {% endfor %}
         </tr>
     {% endfor %}

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

+.reviews-list {
+    margin-top: 40px;
+    table-layout: auto;
+
+    &__th {
+        &:hover {
+            box-shadow: none;
+        }
+
+        &:first-child {
+            font-weight: $weight--bold;
+        }
+    }
+
+    &__tr {
+        border-top: 0;
+        border-bottom: 2px solid $color--light-grey;
+    }
+
+    &__td {
+        max-width: 340px;
+        min-width: 340px;
+        padding: 20px;
+    }
+
+    &__th,
+    &__td {
+        display: table-cell;
+        height: auto;
+        vertical-align: top;
+
+        &:first-child {
+            width: 160px;
+            max-width: 160px;
+            min-width: 160px;
+            background-color: $color--light-mid-grey;
+        }
+    }
+}

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

@@ -49,43 +49,6 @@ table,
         background-color: transparent;
     }
 
-    &--reviews {
-        margin-top: 40px;
-        table-layout: auto;
-
-        tbody {
-            tr {
-                &:hover {
-                    box-shadow: none;
-                }
-
-                &:first-child {
-                    font-weight: $weight--bold;
-                }
-
-                > th:first-child,
-                > td:first-child {
-                    width: 160px;
-                    max-width: 160px;
-                    min-width: 160px;
-                    background-color: $color--light-mid-grey;
-                }
-
-                th,
-                td {
-                    display: table-cell;
-                    height: auto;
-                    vertical-align: top;
-                }
-
-                td {
-                    max-width: 340px;
-                    min-width: 340px;
-                }
-            }
-        }
-    }
-
     thead {
         display: none;
 
@@ -167,8 +130,13 @@ table,
     }
 
     .tr {
+        &--child,
         &--subchild {
             border: 0;
+
+            &:hover {
+                box-shadow: none;
+            }
         }
 
         @include media-query($table-breakpoint) {

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

@@ -33,6 +33,7 @@
 @import 'components/input';
 @import 'components/nav';
 @import 'components/pagination';
+@import 'components/reviews-list';
 @import 'components/reviews-summary';
 @import 'components/select2';
 @import 'components/table';