Sample Table Style

Changed the style of the add/manage users table.

static/css/main.css

@@ -341,3 +341,34 @@
         float:none !important;
     }
 }
+
+/* Table Styling */
+.modal-content .dataTable tbody td {
+  font-size: 16px;/* Smaller font on modal tables */
+}
+.dataTables_info{
+  font-size: 15px;
+}
+
+/* Sort Icons */
+table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:after {
+  font-family: 'FontAwesome' !important;
+  position: relative !important;
+  display: initial !important;
+  top: initial!important;
+  right: initial!important;
+  left: 6px;
+  color: #1abc9c;
+}
+table.dataTable thead .sorting:after{
+  content: "\f0dc" !important;
+}
+table.dataTable thead .sorting_asc:after {
+  content: "\f0de" !important;
+  opacity: .8 !important;
+}
+table.dataTable thead .sorting_desc:after {
+  content: "\f0dd" !important;
+  opacity: .8 !important;
+}
+

static/js/app/users.js

@@ -52,7 +52,11 @@ function dismiss(){
 }
 
 function edit(idx){
-    targets = $("#targetsTable").dataTable()
+    targets = $("#targetsTable").dataTable({
+        columnDefs: [
+            { orderable: false, targets: -1 }
+        ]
+    })
     $("#modalSubmit").unbind('click').click(function(){save(idx)})
     if (idx == -1) {
         group = {}

templates/users.html

@@ -94,7 +94,7 @@
               </form>
           </div>
           <br />
-          <table id="targetsTable" class="table table-hover table-striped">
+          <table id="targetsTable" class="table table-hover table-striped table-condensed">
               <thead>
                   <tr>
                       <th>First Name</th>