Fix scene list view

ui/v2.5/src/components/Scenes/SceneListTable.tsx

@@ -1,3 +1,4 @@
+/* eslint-disable jsx-a11y/control-has-associated-label */
 import React from "react";
 import { Table } from "react-bootstrap";
 import { Link } from "react-router-dom";
@@ -23,7 +24,9 @@ export const SceneListTable: React.FC<ISceneListTableProps> = (
       <Link
         key={performer.id}
         to={NavUtils.makePerformerScenesUrl(performer)}
-      />
+      >
+        <h6>{performer.name}</h6>
+      </Link>
     ));
 
   const renderSceneRow = (scene: GQL.SlimSceneDataFragment) => (
@@ -62,11 +65,12 @@ export const SceneListTable: React.FC<ISceneListTableProps> = (
   );
 
   return (
-    <div className="row table-list col col-lg-8 mx-auto">
+    <div className="row table-list justify-content-center">
       <Table striped bordered>
         <thead>
           <tr>
-            <th colSpan={2}>Title</th>
+            <th />
+            <th className="text-left">Title</th>
             <th>Rating</th>
             <th>Duration</th>
             <th>Tags</th>

ui/v2.5/src/index.scss

@@ -29,9 +29,25 @@ code {
   font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New", monospace;
 }
 
-.table-list td {
+.table-list table {
+  width: inherit;
+}
+
+.table-list td,
+.table-list th {
+  border-left: 1px solid rgba(255, 255, 255, .15);
+  font-size: 1rem;
   text-align: center;
   vertical-align: middle;
+
+  h5,
+  h6 {
+    font-size: 1rem;
+  }
+
+  &:first-child {
+    border-left: none;
+  }
 }
 
 @media (min-width: 576px) {

ui/v2.5/src/styles/_theme.scss

@@ -111,14 +111,21 @@ hr {
   thead {
     th {
       border-bottom: 1px solid rgba(255, 255, 255, .15);
+      border-color: rgba(255, 255, 255, .15);
+      border-right: none;
       border-top: none;
     }
   }
 
   td {
     border: none;
+    border-color: rgba(255, 255, 255, .15);
     padding: .25rem .75rem;
   }
+
+  a {
+    color: $text-color;
+  }
 }
 
 .popover {