Ported dataTables css from ios7 tempalte

public/css/styles.less

@@ -42,3 +42,137 @@ body {
   border-color: #333;
 }
 
+// TODO: REFACTOR
+
+// Search field
+.dataTables_filter {
+  float: right;
+
+  input {
+    .form-control;
+    display: inline-block;
+    width: inherit;
+    height: 30px;
+    margin: 0 0 5px 5px;
+
+    &:focus {
+      border-color: #007aff;
+      box-shadow: none;
+    }
+  }
+}
+
+// Show "X" entries
+.dataTables_length {
+  float: left;
+}
+
+// Sorting controls
+.dataTable th {
+  position: relative;
+  font-weight: normal;
+
+  &.sorting {
+    color: #007aff;
+    cursor: pointer;
+
+    &:after,
+    &:before {
+      content: "";
+      width: 0;
+      height: 0;
+      position: absolute;
+      right: 8px;
+      border-right: 5px solid transparent;
+      border-left: 5px solid transparent;
+    }
+
+    &:after {
+      top: 19px;
+      border-top: 5px solid #007aff;
+    }
+
+    &:before {
+      top: 11px;
+      border-bottom: 5px solid #007aff;
+    }
+  }
+
+  &.sorting_asc {
+    color: #007aff;
+    cursor: pointer;
+
+    &:after {
+      content: "";
+      width: 0;
+      height: 0;
+      position: absolute;
+      right: 12px;
+      top: 15px;
+      border-bottom: 5px solid #007aff;
+      border-right: 5px solid transparent;
+      border-left: 5px solid transparent;
+    }
+  }
+
+  &.sorting_desc {
+    color: #007aff;
+    cursor: pointer;
+
+    &:after {
+      content: "";
+      width: 0;
+      height: 0;
+      position: absolute;
+      right: 12px;
+      top: 15px;
+      border-top: 5px solid #007aff;
+      border-right: 5px solid transparent;
+      border-left: 5px solid transparent;
+    }
+  }
+}
+
+.dataTables_wrapper {
+  clear: both;
+}
+
+// Showing 1 to 10 of "X" entries
+.dataTables_info {
+  float: left;
+  font-size: 13px;
+}
+
+// Pagination container
+.dataTables_paginate {
+  float: right;
+}
+
+// Pagination buttons
+.dataTables_paginate a {
+  border-radius: 4px;
+  font-size: 13px;
+  cursor: pointer;
+  border: 1px solid #aaa;
+  color: #999;
+  background: #fff;
+  padding: 4px 8px;
+  margin-left:5px;
+
+  &:hover {
+    color: #007aff;
+    border-color: #007aff;
+  }
+
+  &.paginate_active {
+    border-color: #007aff;
+    background: #007aff;
+    color: #fff;
+  }
+
+  &.paginate_button_disabled {
+    border-color: #e3e3e3;
+    color: #ddd;
+    pointer-events: none;
+  }
+}