Refactor horizontal margins

1 files changed, 23 insertions, 20 deletions

diff --git a/client/src/sass/primeng-custom.scss b/client/src/sass/primeng-custom.scss
index e71fb99a7..9c9b5d4fc 100644
--- a/client/src/sass/primeng-custom.scss
+++ b/client/src/sass/primeng-custom.scss
@@ -753,29 +753,32 @@ p-table {
 }
 
 // overflow data table
-@mixin overflow-datatable ($table-min-width, $horizontal-margins, $mobile-paginator: true) {
-  p-table {
-    .p-datatable-wrapper {
-      overflow-x: auto;
-      max-width: calc(100vw - #{$horizontal-margins * 2});
-
-      table {
-        min-width: $table-min-width;
-      }
-    }
+p-table {
+  .p-datatable-wrapper {
+    overflow-x: auto;
+    max-width: 100%;
 
-    @if $mobile-paginator {
-      p-paginator .p-paginator-bottom {
-        display: block;
+    table {
+      min-width: breakpoint(lg);
+    }
+  }
 
-        .p-paginator-current {
-          position: relative;
-          display: block;
-        }
+  @media screen and (max-width: #{breakpoint(lg)}) {
+    // Prevent overflow
+    p-paginator {
+      .p-paginator-current,
+      .p-dropdown {
+        top: 0;
+        margin-top: 30px;
+      }
+    }
+  }
 
-        a, .p-paginator-pages {
-          vertical-align: middle;
-        }
+  @media screen and (max-width: $mobile-view) {
+    // Prevent overflow
+    p-paginator {
+      .p-paginator-pages > .p-paginator-page:not(.p-highlight) {
+        display: none;
       }
     }
   }