From 1a900f215eb442e084a2d52d2c65259d7a6c6114 Mon Sep 17 00:00:00 2001
From: Felix Hamann <felix.hamann@campus.lmu.de>
Date: Sun, 27 Jan 2019 19:42:50 +0100
Subject: [PATCH] nicer table footer and pagination layout

---
 messages/uniworx/de.msg       |  2 +-
 templates/table/layout.hamlet | 24 ++++++++++++++----------
 templates/table/layout.lucius | 27 ++++++++++++++-------------
 3 files changed, 29 insertions(+), 24 deletions(-)

diff --git a/messages/uniworx/de.msg b/messages/uniworx/de.msg
index 725d16422..0a34cfad1 100644
--- a/messages/uniworx/de.msg
+++ b/messages/uniworx/de.msg
@@ -241,7 +241,7 @@ MultiFileUploadInfo: (Mehrere Dateien mit Shift oder Strg auswählen)
 
 NrColumn: Nr
 SelectColumn: Auswahl
-DBTablePagesize: Einträge
+DBTablePagesize: Einträge pro Seite
 DBTablePagesizeAll: Alle
 
 CorrDownload: Herunterladen
diff --git a/templates/table/layout.hamlet b/templates/table/layout.hamlet
index a7e4070cc..58b4b5f78 100644
--- a/templates/table/layout.hamlet
+++ b/templates/table/layout.hamlet
@@ -3,15 +3,19 @@ $if null rows && (dbsEmptyStyle == DBESNoHeading)
   _{dbsEmptyMessage}
 $else
   ^{table}
-  _{MsgRowCount rowCount}
-  <!-- TODO: replace '5' with 'minPagesize' -->
-  $if rowCount > 5
-    <div .pagination>
+
+  <div .table-footer>
+    <div .table__row-count>
+      _{MsgRowCount rowCount}
+    <!-- TODO: replace '5' with 'minPagesize' -->
+    $if rowCount > 5
       <form .pagesize method=GET enctype=#{pagesizeEnc} action=#{rawAction}>
         ^{pagesizeWdgt}
-      $if pageCount > 1
-        <ul ##{wIdent "pagination"} .pages>
-          $forall p <- pageNumbers
-            <li .page-link :p == psPage:.current>
-              <a href=#{tblLink $ setParam (wIdent "page") (Just $ tshow p)}>
-                _{MsgPage (succ p)}
+
+  $if pageCount > 1
+    <div .pagination>
+      <ul ##{wIdent "pagination"} .pages>
+        $forall p <- pageNumbers
+          <li .page-link :p == psPage:.current>
+            <a href=#{tblLink $ setParam (wIdent "page") (Just $ tshow p)}>
+              _{MsgPage (succ p)}
diff --git a/templates/table/layout.lucius b/templates/table/layout.lucius
index 605fb0c77..c35fcecde 100644
--- a/templates/table/layout.lucius
+++ b/templates/table/layout.lucius
@@ -1,24 +1,29 @@
+/* TABLE FOOTER */
+.table-footer {
+  display: flex;
+  flex-flow: row-reverse;
+  justify-content: space-between;
+}
+
 /* PAGINATION */
 .pagination {
     margin-top: 20px;
-    display: flex;
-    flex-direction: column-reverse;
-
-    .pagesize {
-        float: left;
-        flex-grow: 0;
-    }
+    overflow: auto;
 
     .pages {
         text-align: center;
-        flex-grow: 1;
+        white-space: nowrap;
         margin: 0;
 
         .page-link {
-          margin: 7px;
+          margin-top: 7px;
           display: inline-block;
           background-color: var(--color-grey);
 
+          + .page-link {
+            margin-left: 7px;
+          }
+
           a {
             color: var(--color-lightwhite);
             padding: 7px 13px;
@@ -42,10 +47,6 @@
               pointer-events: none;
             }
           }
-
-          &:last-child {
-            margin-right: 0;
-          }
         }
     }
 }