From b6c3e972b9bc385bf24e1dfbb7e54c70ef95eb32 Mon Sep 17 00:00:00 2001
From: Bernhard Reiter <bernhard@intevation.de>
Date: Fri, 18 Nov 2016 14:07:45 +0100
Subject: [PATCH] Tables: improves datatables styling

 * Activating dataTables.bootstrap.css (it is already shipped)
 * Overriding the sorting icons for a good style with already available
   icons.
---
 src/components/dash/Tables.vue | 26 ++++++++++++++++++++++++++
 1 file changed, 26 insertions(+)

diff --git a/src/components/dash/Tables.vue b/src/components/dash/Tables.vue
index 8afdce86..6998fa68 100644
--- a/src/components/dash/Tables.vue
+++ b/src/components/dash/Tables.vue
@@ -213,4 +213,30 @@ module.exports = {
 </script>
 
 <style>
+/* Using the bootstrap style, but overriding the font to not draw in
+   the Glyphicons Halflings font as an additional requirement for sorting icons.
+
+   An alternative to the solution active below is to use the jquery style
+   which uses images, but the color on the images does not match adminlte.
+
+@import url('/static/js/plugins/datatables/jquery.dataTables.min.css');
+*/
+
+@import url('/static/js/plugins/datatables/dataTables.bootstrap.css');
+
+table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:after {
+  font-family: 'FontAwesome';
+}
+
+table.dataTable thead .sorting:after {
+  content: "\f0dc";
+}
+
+table.dataTable thead .sorting_asc:after {
+  content: "\f0dd";
+}
+
+table.dataTable thead .sorting_desc:after {
+  content: "\f0de";
+}
 </style>