changeset 6306:2f008f0153c7

style: put all datatable widgets on one line above the table This makes tables look less messy - especially on the repogroups page where there are 2 datatables. We put all the info above the template so it is visible and stays in the same place, no matter how many entries are shown or if filtering change the number. TODO: We should probably get a wrapper around datatable instead of repeating this so many times ...
author Mads Kiilerich <madski@unity3d.com>
date Thu, 10 Nov 2016 16:10:41 +0100
parents 93a337bf46fe
children 39c7bbc36c42
files kallithea/public/css/style.css kallithea/templates/admin/my_account/my_account_repos.html kallithea/templates/admin/my_account/my_account_watched.html kallithea/templates/admin/repo_groups/repo_groups.html kallithea/templates/admin/repos/repos.html kallithea/templates/admin/user_groups/user_groups.html kallithea/templates/admin/users/users.html kallithea/templates/index_base.html
diffstat 8 files changed, 38 insertions(+), 11 deletions(-) [+]
line wrap: on
line diff
--- a/kallithea/public/css/style.css	Thu Nov 10 16:10:41 2016 +0100
+++ b/kallithea/public/css/style.css	Thu Nov 10 16:10:41 2016 +0100
@@ -4560,15 +4560,32 @@
   content: "\23f7";
 }
 
-
-.dataTables_wrapper .dataTables_length {
-  float: right !important;
-}
-
-.dataTables_wrapper .dataTables_filter {
+.dataTables_wrapper .dataTables_left {
   float: left !important;
 }
 
+.dataTables_wrapper .dataTables_right {
+  float: right;
+}
+
+.dataTables_wrapper .dataTables_right > div {
+  padding-left: 30px;
+}
+
+.dataTables_wrapper .dataTables_info {
+  clear: none;
+  padding-top: 1em;
+}
+
+.dataTables_wrapper .dataTables_paginate {
+  padding-top: 0;
+}
+
+.dataTables_wrapper .dataTables_paginate > a.paginate_button {
+  padding-top: 1em;
+  border: 0 !important;
+}
+
 .text-muted {
     color: #777777;
 }
--- a/kallithea/templates/admin/my_account/my_account_repos.html	Thu Nov 10 16:10:41 2016 +0100
+++ b/kallithea/templates/admin/my_account/my_account_repos.html	Thu Nov 10 16:10:41 2016 +0100
@@ -16,6 +16,7 @@
             {data: "action", title: "${_('Action')}", sortable: false, searchable: false}
         ],
         order: [[2, "asc"]],
+        dom: '<"dataTables_left"f><"dataTables_right"ilp>t',
         pageLength: 100
     });
 </script>
--- a/kallithea/templates/admin/my_account/my_account_watched.html	Thu Nov 10 16:10:41 2016 +0100
+++ b/kallithea/templates/admin/my_account/my_account_watched.html	Thu Nov 10 16:10:41 2016 +0100
@@ -15,6 +15,7 @@
             {data: "last_changeset", "orderData": 3, title: "${_('Tip')}", searchable: false},
         ],
         order: [[2, "asc"]],
+        dom: '<"dataTables_left"f><"dataTables_right"ilp>t',
         pageLength: 100
     });
 </script>
--- a/kallithea/templates/admin/repo_groups/repo_groups.html	Thu Nov 10 16:10:41 2016 +0100
+++ b/kallithea/templates/admin/repo_groups/repo_groups.html	Thu Nov 10 16:10:41 2016 +0100
@@ -45,6 +45,7 @@
             {data: "action", title: "${_('Action')}", sortable: false, searchable: false}
         ],
         drawCallback: updateRowCountCallback($("#repo_group_count")),
+        dom: '<"dataTables_left"f><"dataTables_right"ilp>t',
         pageLength: 100
     });
 
--- a/kallithea/templates/admin/repos/repos.html	Thu Nov 10 16:10:41 2016 +0100
+++ b/kallithea/templates/admin/repos/repos.html	Thu Nov 10 16:10:41 2016 +0100
@@ -44,6 +44,7 @@
             {data: "action", title: "${_('Action')}", sortable: false, searchable: false}
         ],
         drawCallback: updateRowCountCallback($("#repo_count")),
+        dom: '<"dataTables_left"f><"dataTables_right"ilp>t',
         pageLength: 100
     });
 </script>
--- a/kallithea/templates/admin/user_groups/user_groups.html	Thu Nov 10 16:10:41 2016 +0100
+++ b/kallithea/templates/admin/user_groups/user_groups.html	Thu Nov 10 16:10:41 2016 +0100
@@ -45,6 +45,7 @@
             {data: "action", title: "${_('Action')}", searchable: false, sortable: false}
         ],
         order: [[1, "asc"]],
+        dom: '<"dataTables_left"f><"dataTables_right"ilp>t',
         pageLength: 100
     });
 </script>
--- a/kallithea/templates/admin/users/users.html	Thu Nov 10 16:10:41 2016 +0100
+++ b/kallithea/templates/admin/users/users.html	Thu Nov 10 16:10:41 2016 +0100
@@ -48,6 +48,7 @@
         ],
         order: [[1, "asc"]],
         drawCallback: updateRowCountCallback($("#user_count")),
+        dom: '<"dataTables_left"f><"dataTables_right"ilp>t',
         pageLength: 100
     });
 </script>
--- a/kallithea/templates/index_base.html	Thu Nov 10 16:10:41 2016 +0100
+++ b/kallithea/templates/index_base.html	Thu Nov 10 16:10:41 2016 +0100
@@ -43,8 +43,8 @@
             %endif
         </div>
         <!-- end box / title -->
+        %if c.groups:
         <div class="table">
-           % if c.groups:
             <div id='groups_list_wrap'>
               <table id="groups_list">
                   <thead>
@@ -74,15 +74,18 @@
                   % endfor
               </table>
             </div>
-            <hr/>
-            % endif
-
+        </div>
+        %endif
+        <div class="table">
             <table id="repos_list_wrap"></table>
         </div>
     </div>
 
       <script>
-        $('#groups_list').DataTable({pageLength: 100});
+        $('#groups_list').DataTable({
+            dom: '<"dataTables_left"f><"dataTables_right"ilp>t',
+            pageLength: 100
+        });
 
         var data = ${c.data|n},
             $dataTable = $("#repos_list_wrap").DataTable({
@@ -103,6 +106,7 @@
                     {data: "atom", sortable: false}
                 ],
                 order: [[1, "asc"]],
+                dom: '<"dataTables_left"f><"dataTables_right"ilp>t',
                 pageLength: 100
             });
       </script>