adding pagination at the bottom of tables (terms + documents)

src/Gargantext/Components/NgramsTable.purs

@@ -225,10 +225,10 @@ tableContainerCpt { addCallback
                   B.wad
                   []
                   [
-                    H.i { className: "fa fa-lightbulb-o mr-2" } []
+                    H.i { className: "fa fa-lightbulb-o mr-1" } []
                   , H.text "adding"
                   , H.text $ nbsp 1
-                  , B.b_ $ "« " <> searchQuery <> " »"
+                  , H.span { className: "text-primary" } [ B.b_ $ "« " <>  searchQuery <> " »" ]
                   , H.text $ nbsp 1
                   , H.text "to"
                   ]
@@ -252,29 +252,11 @@ tableContainerCpt { addCallback
           ]
         ]
       ,
-
-        H.div
-        { className: "ngrams-table-container__navigation" }
-        [
-          props.pageSizeDescription
-        ,
-          props.paginationLinks
-        ,
-          B.wad
-          [ "d-flex", "align-items-center" ]
-          [
-            B.label_ "per page"
-          ,
-            B.wad_ [ "virtual-space", "w-1" ]
-          ,
-            props.pageSizeControl
-          ]
-        ]
+        ngrams_controls
       ,
         H.div
         { className: "ngrams-table-container__table-wrapper" }
         [
-
           H.div
           { className: intercalate " "
               [ "ngrams-table-container__actions"
@@ -317,7 +299,21 @@ tableContainerCpt { addCallback
             ngramsTreeEdit (treeEdit)
           ]
         ]
+      ,
+        ngrams_controls
       ]
+    where
+      ngrams_controls = H.div { className: "ngrams-table-container__navigation" }
+                        [ props.pageSizeDescription
+                        , props.paginationLinks
+                        , B.wad
+                          [ "d-flex", "align-items-center" ]
+                          [ B.label_ "per page"
+                          , B.wad_ [ "virtual-space", "w-1" ]
+                          , props.pageSizeControl
+                          ]
+                        ]
+
 
   -- WHY setPath     f = origSetPageParams (const $ f path)
   setTermListFilter x = T.modify (_ { termListFilter = x }) path

src/Gargantext/Components/Table.purs

@@ -788,9 +788,20 @@ filterRows { params: { limit, offset } } rs = newRs
     newRs = Seq.take limit $ Seq.drop offset $ rs
 
 defaultContainer :: Record TableContainerProps -> R.Element
-defaultContainer props = R.fragment $ props.syncResetButton <> controls
+defaultContainer props = R.fragment $ props.syncResetButton <> table_data
   where
-    controls = [ H.div { className: "d-flex align-items-center mb-2" }
+    table_data = [
+                    controls
+                  , R2.row [
+                      H.table {className: "col-md-12 table"}
+                      [ H.thead {className: ""} [ props.tableHead ]
+                      , H.tbody {} props.tableBody
+                      ]
+                    ]
+                  , controls
+                 ]
+      where
+        controls = H.div { className: "table-container__navigation d-flex align-items-center mb-2" }
                     [ H.div {className: "col-md-4"} [ props.pageSizeDescription ]
                     , H.div {className: "col-md-4"} [ props.paginationLinks ]
                     , H.div {className: "col-md-4"} 
@@ -801,13 +812,6 @@ defaultContainer props = R.fragment $ props.syncResetButton <> controls
                           ]
                       ]
                     ]
-               , R2.row [
-                   H.table {className: "col-md-12 table"}
-                   [ H.thead {className: ""} [ props.tableHead ]
-                   , H.tbody {} props.tableBody
-                   ]
-                 ]
-               ]
 
 -- TODO: this needs to be in Gargantext.Pages.Corpus.Graph.Tabs
 graphContainer :: Record TableContainerProps -> R.Element

src/sass/_legacy/_list.sass

@@ -119,7 +119,7 @@
     //       see Gargantext.Components.Router)
     margin-left: - space-x(2)
     margin-right: - space-x(2)
-    margin-bottom: - space-x(4) // (+ another trimmed gutter)
+    margin-bottom: - space-x(2) // (+ another trimmed gutter)
 
   &__actions
     display: flex