Integration: jQuery UI stylesheet didn't have the same options as the DataTables main stylesheet

integration/jqueryui/dataTables.jqueryui.css

@@ -201,6 +201,92 @@ table.dataTable.order-column.hover tbody tr.odd:hover.selected > .sorting_3,
 table.dataTable.order-column.hover tbody tr.even:hover.selected > .sorting_3 {
   background-color: #a4b2cb;
 }
+table.dataTable.nowrap th, table.dataTable.nowrap td {
+  white-space: nowrap;
+}
+table.dataTable.compact thead th,
+table.dataTable.compact thead td {
+  padding: 5px 9px;
+}
+table.dataTable.compact tfoot th,
+table.dataTable.compact tfoot td {
+  padding: 5px 9px 3px 9px;
+}
+table.dataTable.compact tbody th,
+table.dataTable.compact tbody td {
+  padding: 4px 5px;
+}
+table.dataTable th.dt-left,
+table.dataTable td.dt-left {
+  text-align: left;
+}
+table.dataTable th.dt-center,
+table.dataTable td.dt-center,
+table.dataTable td.dataTables_empty {
+  text-align: center;
+}
+table.dataTable th.dt-right,
+table.dataTable td.dt-right {
+  text-align: right;
+}
+table.dataTable th.dt-justify,
+table.dataTable td.dt-justify {
+  text-align: justify;
+}
+table.dataTable th.dt-nowrap,
+table.dataTable td.dt-nowrap {
+  white-space: nowrap;
+}
+table.dataTable thead th.dt-head-left,
+table.dataTable thead td.dt-head-left,
+table.dataTable tfoot th.dt-head-left,
+table.dataTable tfoot td.dt-head-left {
+  text-align: left;
+}
+table.dataTable thead th.dt-head-center,
+table.dataTable thead td.dt-head-center,
+table.dataTable tfoot th.dt-head-center,
+table.dataTable tfoot td.dt-head-center {
+  text-align: center;
+}
+table.dataTable thead th.dt-head-right,
+table.dataTable thead td.dt-head-right,
+table.dataTable tfoot th.dt-head-right,
+table.dataTable tfoot td.dt-head-right {
+  text-align: right;
+}
+table.dataTable thead th.dt-head-justify,
+table.dataTable thead td.dt-head-justify,
+table.dataTable tfoot th.dt-head-justify,
+table.dataTable tfoot td.dt-head-justify {
+  text-align: justify;
+}
+table.dataTable thead th.dt-head-nowrap,
+table.dataTable thead td.dt-head-nowrap,
+table.dataTable tfoot th.dt-head-nowrap,
+table.dataTable tfoot td.dt-head-nowrap {
+  white-space: nowrap;
+}
+table.dataTable tbody th.dt-body-left,
+table.dataTable tbody td.dt-body-left {
+  text-align: left;
+}
+table.dataTable tbody th.dt-body-center,
+table.dataTable tbody td.dt-body-center {
+  text-align: center;
+}
+table.dataTable tbody th.dt-body-right,
+table.dataTable tbody td.dt-body-right {
+  text-align: right;
+}
+table.dataTable tbody th.dt-body-justify,
+table.dataTable tbody td.dt-body-justify {
+  text-align: justify;
+}
+table.dataTable tbody th.dt-body-nowrap,
+table.dataTable tbody td.dt-body-nowrap {
+  white-space: nowrap;
+}
 
 table.dataTable,
 table.dataTable th,

integration/jqueryui/dataTables.jqueryui.scss

@@ -265,6 +265,112 @@ table.dataTable {
       }
     }
   }
+
+  &.nowrap {
+    th, td {
+      white-space: nowrap;
+    }
+  }
+
+  &.compact {
+    thead th,
+    thead td {
+      padding: 5px 9px;
+    }
+
+    tfoot th,
+    tfoot td {
+      padding: 5px 9px 3px 9px;
+    }
+
+    tbody th,
+    tbody td {
+      padding: 4px 5px;
+    }
+  }
+
+
+  // Typography
+  th.dt-left,
+  td.dt-left {
+    text-align: left;
+  }
+
+  th.dt-center,
+  td.dt-center,
+  td.dataTables_empty {
+    text-align: center;
+  }
+
+  th.dt-right,
+  td.dt-right {
+    text-align: right;
+  }
+
+  th.dt-justify,
+  td.dt-justify {
+    text-align: justify;
+  }
+
+  th.dt-nowrap,
+  td.dt-nowrap {
+    white-space: nowrap;
+  }
+
+  thead,
+  tfoot {
+    th.dt-head-left,
+    td.dt-head-left {
+      text-align: left;
+    }
+
+    th.dt-head-center,
+    td.dt-head-center{
+      text-align: center;
+    }
+
+    th.dt-head-right,
+    td.dt-head-right {
+      text-align: right;
+    }
+
+    th.dt-head-justify,
+    td.dt-head-justify {
+      text-align: justify;
+    }
+
+    th.dt-head-nowrap,
+    td.dt-head-nowrap {
+      white-space: nowrap;
+    }
+  }
+
+  tbody {
+    th.dt-body-left,
+    td.dt-body-left {
+      text-align: left;
+    }
+
+    th.dt-body-center,
+    td.dt-body-center {
+      text-align: center;
+    }
+
+    th.dt-body-right,
+    td.dt-body-right {
+      text-align: right;
+    }
+
+    th.dt-body-justify,
+    td.dt-body-justify {
+      text-align: justify;
+    }
+
+    th.dt-body-nowrap,
+    td.dt-body-nowrap {
+      white-space: nowrap;
+    }
+  }
 }
 
 // Its not uncommon to use * {border-box} now, but it messes up the column width