M assets/js/app.js → assets/js/app.js

@@ -24,16 +24,26 @@ { data: 'Updated' },
         ],
         columnDefs: [
             {
-                targets: [8, 14],
+                targets: [7, 8, 9, 10, 11, 14],
                 render: function (data) {
+                    if (data === 'N/A') {
+                        return '<span class="label label-default" style="background-color: rgba(26, 26, 26, 1); color: #9b9b9b;">' + data + '</span>';
+                    }
                     if (data === 'Easy') {
-                        return '<span class="text-success">' + data + '</span>';
+                        return '<span class="label label-default" style="background-color: rgba(26, 26, 26, 1); color: #0FB492;">' + data + '</span>';
                     }
                     if (data === 'Medium') {
-                        return '<span class="text-warning">' + data + '</span>';
+                        return '<span class="label label-default" style="background-color: rgba(26, 26, 26, 1); color: #EE7E2A;">' + data + '</span>';
                     }
                     if (data === 'Hard') {
-                        return '<span class="text-danger">' + data + '</span>';
+                        return '<span class="label label-default" style="background-color: rgba(26, 26, 26, 1); color: #E64141;">' + data + '</span>';
+                    }
+
+                    if (data === 'Yes') {
+                        return '<span class="label label-default" style="background-color: rgba(26, 26, 26, 1); color: #50992a;">' + data + '</span>';
+                    }
+                    if (data === 'No') {
+                        return '<span class="label label-default" style="background-color: rgba(26, 26, 26, 1); color: #a05262;">' + data + '</span>';
                     }
                     return data;
                 }

M index.html → index.html

@@ -74,7 +74,7 @@ <div class="col-lg-12">
                 <div class="alert alert-bg-white alert-primary text-center">
                     <strong>Hey There!</strong> Like what you see? Feel free to contribute<a class="alert-link" href="https://github.com/HDVinnie/Private-Trackers-Spreadsheet"> HERE!</a>
                 </div>
-                <table id="table" class="dataTable table-striped compact hover" style="width: 100% !important;">
+                <table id="table" class="dataTable table-hover compact hover" style="width: 100% !important;">
                     <thead>
                     <tr>
                         <th>Name</th>