From 2765b3dfd11ea99969f6dbe52b458d5819369fa1 Mon Sep 17 00:00:00 2001
From: Fernando Terra <fernando.terra@encora.com>
Date: Wed, 30 Oct 2024 17:29:04 -0300
Subject: [PATCH 1/2] fix: fix columns' width

---
 frontend/src/assets/styles/global.scss    | 21 +++++++++++++++------
 frontend/src/pages/SearchPage.vue         |  4 +---
 frontend/src/pages/SubmissionListPage.vue |  2 +-
 3 files changed, 17 insertions(+), 10 deletions(-)

diff --git a/frontend/src/assets/styles/global.scss b/frontend/src/assets/styles/global.scss
index 50681690d1..2df76f9560 100644
--- a/frontend/src/assets/styles/global.scss
+++ b/frontend/src/assets/styles/global.scss
@@ -1283,7 +1283,7 @@ cds-modal {
 }
 
 .paginator {
-  width: calc(100vw - 16rem);
+  width: 100%;
 }
 
 .headers-compact ~ .full {
@@ -1490,9 +1490,18 @@ cds-table-header-cell {
   background: var(--light-theme-layer-accent-layer-accent-01, #dfdfe1);
 }
 
-:is(cds-table-header-cell, cds-table-cell):is(:first-child, :last-child) {
-  padding: 0;
-  width: 1.5rem;
+#submissions-table {
+  :is(cds-table-header-cell, cds-table-cell):is(:first-child, :last-child) {
+    padding: 0;
+    width: 1.5rem;
+  }
+}
+
+#search-table {
+  :is(cds-table-header-cell, cds-table-cell):is(:first-child) {
+    padding: 0;
+    width: 1.5rem;
+  }
 }
 
 .col-6_75rem {
@@ -1874,7 +1883,7 @@ div.internal-grouping-01:has(svg.warning) span.body-compact-01 {
   }
 
   .paginator {
-    width: 100vw;
+    width: 100%;
   }
   .submission-details--title svg {
     width: 5rem;
@@ -1985,7 +1994,7 @@ div.internal-grouping-01:has(svg.warning) span.body-compact-01 {
   }
 
   .paginator {
-    width: 100vw;
+    width: 100%;
   }
   cds-table {
     width: 82rem;
diff --git a/frontend/src/pages/SearchPage.vue b/frontend/src/pages/SearchPage.vue
index 0eda586c07..afea69e5d9 100644
--- a/frontend/src/pages/SearchPage.vue
+++ b/frontend/src/pages/SearchPage.vue
@@ -246,7 +246,7 @@ onMounted(() => {
     </div>
     <div id="datatable" v-if="userhasAuthority">
 
-      <cds-table use-zebra-styles v-if="!loadingSearch">
+      <cds-table id="search-table" use-zebra-styles v-if="!loadingSearch">
         <cds-table-head>
           <cds-table-header-row>
             <cds-table-header-cell />
@@ -256,7 +256,6 @@ onMounted(() => {
             <cds-table-header-cell class="col-14_75rem">Type</cds-table-header-cell>
             <cds-table-header-cell class="col-14_75rem">City</cds-table-header-cell>
             <cds-table-header-cell class="col-7_0625rem">Status</cds-table-header-cell>
-            <cds-table-header-cell />
           </cds-table-header-row>
         </cds-table-head>
         <cds-table-body>
@@ -276,7 +275,6 @@ onMounted(() => {
                 <cds-tag :type="tagColor(row.clientStatus)" title=""><span>{{ row.clientStatus }}</span></cds-tag>
               </div>
             </cds-table-cell>
-            <cds-table-cell />
           </cds-table-row>
         </cds-table-body>
       </cds-table>
diff --git a/frontend/src/pages/SubmissionListPage.vue b/frontend/src/pages/SubmissionListPage.vue
index 022aa61c14..5aab4eef60 100644
--- a/frontend/src/pages/SubmissionListPage.vue
+++ b/frontend/src/pages/SubmissionListPage.vue
@@ -129,7 +129,7 @@ const summitSvg = useSvg(summit);
     </div>
     
     <div id="datatable" v-if="userhasAuthority">
-      <cds-table use-zebra-styles v-if="!loading">
+      <cds-table id="submissions-table" use-zebra-styles v-if="!loading">
         <cds-table-head>
           <cds-table-header-row>
             <cds-table-header-cell />

From 529606a0a18039e53561d380d2cf2629b81b3688 Mon Sep 17 00:00:00 2001
From: Fernando Terra <fernando.terra@encora.com>
Date: Wed, 30 Oct 2024 18:09:47 -0300
Subject: [PATCH 2/2] refator: create css class padding-column

---
 frontend/src/assets/styles/global.scss    | 19 +++++--------------
 frontend/src/pages/SearchPage.vue         |  2 +-
 frontend/src/pages/SubmissionListPage.vue |  4 ++--
 3 files changed, 8 insertions(+), 17 deletions(-)

diff --git a/frontend/src/assets/styles/global.scss b/frontend/src/assets/styles/global.scss
index 2df76f9560..2fb561569e 100644
--- a/frontend/src/assets/styles/global.scss
+++ b/frontend/src/assets/styles/global.scss
@@ -1490,20 +1490,6 @@ cds-table-header-cell {
   background: var(--light-theme-layer-accent-layer-accent-01, #dfdfe1);
 }
 
-#submissions-table {
-  :is(cds-table-header-cell, cds-table-cell):is(:first-child, :last-child) {
-    padding: 0;
-    width: 1.5rem;
-  }
-}
-
-#search-table {
-  :is(cds-table-header-cell, cds-table-cell):is(:first-child) {
-    padding: 0;
-    width: 1.5rem;
-  }
-}
-
 .col-6_75rem {
   width: 6.75rem;
 }
@@ -1520,6 +1506,11 @@ cds-table-header-cell {
   width: 7.0625rem;
 }
 
+.padding-column {
+  padding: 0;
+  width: 1.5rem;
+}
+
 cds-pagination {
   border-radius: 0px 0px 4px 4px;
   border-top: 1px solid var(--light-theme-border-border-subtle-01, #dfdfe1);
diff --git a/frontend/src/pages/SearchPage.vue b/frontend/src/pages/SearchPage.vue
index afea69e5d9..07a877b0a1 100644
--- a/frontend/src/pages/SearchPage.vue
+++ b/frontend/src/pages/SearchPage.vue
@@ -249,7 +249,7 @@ onMounted(() => {
       <cds-table id="search-table" use-zebra-styles v-if="!loadingSearch">
         <cds-table-head>
           <cds-table-header-row>
-            <cds-table-header-cell />
+            <cds-table-header-cell class="padding-column" />
             <cds-table-header-cell class="col-6_75rem">Client number</cds-table-header-cell>
             <cds-table-header-cell class="col-6_75rem">Acronym</cds-table-header-cell>
             <cds-table-header-cell class="col-19_4375rem">Name</cds-table-header-cell>
diff --git a/frontend/src/pages/SubmissionListPage.vue b/frontend/src/pages/SubmissionListPage.vue
index 5aab4eef60..029f21b509 100644
--- a/frontend/src/pages/SubmissionListPage.vue
+++ b/frontend/src/pages/SubmissionListPage.vue
@@ -132,13 +132,13 @@ const summitSvg = useSvg(summit);
       <cds-table id="submissions-table" use-zebra-styles v-if="!loading">
         <cds-table-head>
           <cds-table-header-row>
-            <cds-table-header-cell />
+            <cds-table-header-cell class="padding-column" />
             <cds-table-header-cell>Client name</cds-table-header-cell>
             <cds-table-header-cell>Client type</cds-table-header-cell>
             <cds-table-header-cell>District</cds-table-header-cell>
             <cds-table-header-cell>Submitted on</cds-table-header-cell>
             <cds-table-header-cell>Submission status</cds-table-header-cell>
-            <cds-table-header-cell />
+            <cds-table-header-cell class="padding-column" />
           </cds-table-header-row>
         </cds-table-head>
         <cds-table-body>