New: Bootstrap 4 styling and example

New: Semantic UI styling and example

Author: AllanJard

css/fixedHeader.bootstrap4.scss

@@ -0,0 +1,21 @@
+
+table.dataTable.fixedHeader-floating,
+table.dataTable.fixedHeader-locked {
+	background-color: white;
+	margin-top: 0 !important;
+	margin-bottom: 0 !important;
+}
+
+table.dataTable.fixedHeader-floating {
+	position: fixed !important;
+}
+
+table.dataTable.fixedHeader-locked {
+	position: absolute !important;
+}
+
+@media print {
+  table.fixedHeader-floating {
+    display: none;
+  }
+}

css/fixedHeader.semanticui.scss

@@ -0,0 +1,16 @@
+
+
+table.fixedHeader-floating {
+	position: fixed !important;
+	border-bottom-width: 0 !important;
+}
+
+table.fixedHeader-locked {
+	position: absolute !important;
+}
+
+@media print {
+    table.fixedHeader-floating {
+        display: none;
+    }
+}

examples/styling/bootstrap4.xml

@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="UTF-8" ?>
+<dt-example table-type="html" order="2" framework="bootstrap4">
+
+<css lib="datatables fixedheader" />
+<js lib="jquery datatables fixedheader">
+<![CDATA[
+$(document).ready(function() {
+	var table = $('#example').DataTable( {
+		fixedHeader: true
+	} );
+} );
+]]>
+</js>
+
+<title lib="FixedHeader">Bootstrap 4</title>
+
+<info><![CDATA[
+
+This example shows FixedHeader being styling by the Bootstrap 4 CSS framework.
+
+]]></info>
+
+</dt-example>

examples/styling/foundation.xml

@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="UTF-8" ?>
-<dt-example table-type="html" order="2" framework="foundation">
+<dt-example table-type="html" order="3" framework="foundation">
 
 <css lib="datatables fixedheader" />
 <js lib="jquery datatables fixedheader">

examples/styling/jqueryui.xml

@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="UTF-8" ?>
-<dt-example table-type="html" order="3" framework="jqueryui">
+<dt-example table-type="html" order="5" framework="jqueryui">
 
 <css lib="datatables fixedheader" />
 <js lib="jquery datatables fixedheader">

examples/styling/semanticui.xml

@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="UTF-8" ?>
+<dt-example table-type="html" order="4" framework="semanticui">
+
+<css lib="datatables fixedheader" />
+<js lib="jquery datatables fixedheader">
+<![CDATA[
+$(document).ready(function() {
+	var table = $('#example').DataTable( {
+		fixedHeader: true
+	} );
+} );
+]]>
+</js>
+
+<title lib="FixedHeader">Semantic UI</title>
+
+<info><![CDATA[
+
+This example shows FixedHeader being styling by the [Semantic UI](http://semantic-ui.com) framework.
+
+]]></info>
+
+</dt-example>