From 4df509e3386ca2b207a372568c44f3fd6efc84f2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Michael=20G=C3=B6tz?=
 <michael-guenther.goetz@stud.uni-bamberg.de>
Date: Tue, 7 May 2019 14:04:16 +0200
Subject: [PATCH] Layout tweak for search field

---
 src/static/css/floating_labels.css       |  8 ++++++--
 src/static/js/main.js                    | 11 +++++++++--
 src/templates/macros/utils_macros.jinja2 |  2 +-
 3 files changed, 16 insertions(+), 5 deletions(-)

diff --git a/src/static/css/floating_labels.css b/src/static/css/floating_labels.css
index a299a6f..2c8056f 100644
--- a/src/static/css/floating_labels.css
+++ b/src/static/css/floating_labels.css
@@ -127,7 +127,11 @@
 /*.dataTables_length, .dataTables_info, .dataTables_paginate {*/
 /*!*visibility: hidden*!*/
 /*}*/
-
+@media (max-width: 480px) {
+    .table-search-field {
+        width: 100% !important;
+    }
+}
 
 /* ------------------------------------------------------------------------------------------------------------------ */
 /* --                                Multiple User deletion Custom checkbox                                        -- */
@@ -192,7 +196,7 @@
 /* ------------------------------------------------------------------------------------------------------------------ */
 /* --                                Realm delete                                                                  -- */
 /* ------------------------------------------------------------------------------------------------------------------ */
-.realm-delete-link{
+.realm-delete-link {
     color: #6c757d;
 }
 
diff --git a/src/static/js/main.js b/src/static/js/main.js
index c35f84b..0d724dc 100644
--- a/src/static/js/main.js
+++ b/src/static/js/main.js
@@ -5,9 +5,16 @@ $(document).ready(function () {
     // if ($(TABLE_CLASS)) {
     const data_table = $(TABLE_CLASS).DataTable({
         "lengthMenu": [[-1], ["All"]],
-        "dom": 'it',
+        "bPaginate": true,
+        "pageLength": 10,
+        // "sPaginationType": "custom",
+        "dom": 'itlp',
+        // "paginate": {
+        //     next: '<i class="fas fa-arrow-alt-circle-right"></i>',
+        //     previous: '<i class="fas fa-arrow-alt-circle-left"></i>'
+        // },
         rowReorder: {
-            selector: 'td:nth-child(2)'
+            selector: true,
         },
         responsive: true,
     });
diff --git a/src/templates/macros/utils_macros.jinja2 b/src/templates/macros/utils_macros.jinja2
index dab4712..1dd9d9e 100644
--- a/src/templates/macros/utils_macros.jinja2
+++ b/src/templates/macros/utils_macros.jinja2
@@ -21,7 +21,7 @@
 {% endmacro %}
 
 {% macro get_user_table(realm, users) -%}
-    <div class="form-group w-25 float-right">
+    <div class="table-search-field form-group w-25 float-right">
         <input type="text"
                class="form-control"
                id="data-table-search-input">