From 199e28bf3e2306d587b27b9b1a4769a7d661bbfc Mon Sep 17 00:00:00 2001
From: Roman Nastyuk <rnastyuk@exoft.net>
Date: Tue, 3 Jun 2025 16:24:38 +0300
Subject: [PATCH 1/2] fix(table-styles): changed table styling according to the
 figma design

---
 src/assets/styles/overrides/table.scss | 151 ++++++++++++-------------
 1 file changed, 75 insertions(+), 76 deletions(-)

diff --git a/src/assets/styles/overrides/table.scss b/src/assets/styles/overrides/table.scss
index 4e2174bcf..1b3d7f40d 100644
--- a/src/assets/styles/overrides/table.scss
+++ b/src/assets/styles/overrides/table.scss
@@ -1,104 +1,103 @@
 @use "assets/styles/variables" as var;
+@use "assets/styles/mixins" as mix;
 
-@layer reset {
-  p-table {
-    .p-datatable {
-      border: 1px solid var.$grey-2;
-      border-radius: 8px;
-      padding: 24px;
-    }
+p-table {
+  .p-datatable {
+    border: 1px solid var.$grey-2;
+    border-radius: mix.rem(8px);
+    padding: mix.rem(12px) mix.rem(24px) mix.rem(24px) mix.rem(24px);
+  }
 
-    table {
-      tr:hover {
-        background: var.$bg-blue-2;
+  table {
+    tr:hover {
+      background: var.$bg-blue-2;
 
-        td {
-          background: var.$bg-blue-2;
-        }
-      }
-
-      tr.loading-row {
-        td {
-          background: transparent;
-          border: none;
-          padding: 0;
-          width: 100%;
-        }
+      td {
+        background: var.$bg-blue-2;
       }
+    }
 
-      th,
+    tr.loading-row {
       td {
-        color: var.$dark-blue-1;
+        background: transparent;
         border: none;
-        height: 60px;
-        //max-width: calc((100vw - 27rem) / 3);
+        padding: 0;
+        width: 100%;
       }
+    }
 
-      th {
-        background-color: var.$white;
-        font-weight: 700;
-        padding-top: 0;
+    th,
+    td {
+      color: var.$dark-blue-1;
+      border: none;
+      height: mix.rem(65px);
+      //max-width: calc((100vw - 27rem) / 3);
+    }
 
-        .p-sortable-column-icon {
-          color: var.$grey-1;
-          margin-left: 6px;
-        }
-      }
+    th {
+      background-color: var.$white;
+      font-weight: 700;
+      padding-top: 0;
 
-      td {
-        background-color: var.$bg-blue-3;
-        border-bottom: 12px solid var.$white;
-        overflow: hidden;
-        white-space: nowrap;
-        text-overflow: ellipsis;
+      .p-sortable-column-icon {
+        color: var.$grey-1;
+        margin-left: 6px;
       }
     }
-  }
 
-  .my-projects-table {
-    tr:not(.loading-row) {
-      cursor: pointer;
+    td {
+      background-color: var.$bg-blue-3;
+      border-bottom: mix.rem(12px) solid var.$white;
+      overflow: hidden;
+      white-space: nowrap;
+      text-overflow: ellipsis;
     }
+  }
+}
 
-    &.loading {
-      table {
-        tr.loading-row {
-          td {
-            background: transparent;
-            border: none;
-            padding: 0;
-            width: 100%;
-          }
+.my-projects-table {
+  tr:not(.loading-row) {
+    cursor: pointer;
+  }
+
+  &.loading {
+    table {
+      tr.loading-row {
+        td {
+          background: transparent;
+          border: none;
+          padding: 0;
+          width: 100%;
         }
+      }
 
-        tr:hover {
-          background: inherit;
+      tr:hover {
+        background: inherit;
 
-          td {
-            background: inherit;
-          }
+        td {
+          background: inherit;
         }
       }
     }
   }
+}
 
-  .addon-table {
-    tr {
-      &.background-warning td {
-        background-color: var.$yellow-2;
-      }
+.addon-table {
+  tr {
+    &.background-warning td {
+      background-color: var.$yellow-2;
+    }
 
-      &.background-success td {
-        background-color: var.$green-2;
-      }
+    &.background-success td {
+      background-color: var.$green-2;
+    }
 
-      &.background-danger td {
-        background-color: var.$red-2;
-      }
+    &.background-danger td {
+      background-color: var.$red-2;
+    }
 
-      td {
-        white-space: wrap;
-      }
+    td {
+      white-space: wrap;
     }
   }
 }
@@ -120,7 +119,7 @@
   .addon-table,
   .my-projects-table {
     .p-datatable {
-      padding: 0.85rem;
+      padding: mix.rem(16px);
       overflow-x: auto;
     }
   }
@@ -173,7 +172,7 @@
         max-width: calc(100vw - 3.14rem - 2px);
         display: flex;
         flex-direction: column;
-        padding: 0.85rem;
+        padding: mix.rem(16px);
         background: var.$bg-blue-3;
 
         td {
@@ -202,7 +201,7 @@
     display: block;
 
     .p-datatable {
-      padding: 0.85rem;
+      padding: mix.rem(16px);
       width: 100%;
 
       table {

From eb85cbcc485562934746f229b44458d267bc5242 Mon Sep 17 00:00:00 2001
From: Roman Nastyuk <rnastyuk@exoft.net>
Date: Tue, 3 Jun 2025 16:42:51 +0300
Subject: [PATCH 2/2] fix(table-styles): removed unused styles

---
 src/assets/styles/overrides/table.scss | 10 +---------
 1 file changed, 1 insertion(+), 9 deletions(-)

diff --git a/src/assets/styles/overrides/table.scss b/src/assets/styles/overrides/table.scss
index 1b3d7f40d..13ac4bbe4 100644
--- a/src/assets/styles/overrides/table.scss
+++ b/src/assets/styles/overrides/table.scss
@@ -31,7 +31,6 @@ p-table {
       color: var.$dark-blue-1;
       border: none;
       height: mix.rem(65px);
-      //max-width: calc((100vw - 27rem) / 3);
     }
 
     th {
@@ -41,7 +40,7 @@ p-table {
 
       .p-sortable-column-icon {
         color: var.$grey-1;
-        margin-left: 6px;
+        margin-left: mix.rem(8px);
       }
     }
 
@@ -107,13 +106,6 @@ p-table {
     .p-datatable {
       padding: 1.71rem 0.85rem 1.71rem 0.85rem;
     }
-
-    //table {
-    //  th,
-    //  td {
-    //    max-width: calc((100vw - 6.85rem - 2px) / 3);
-    //  }
-    //}
   }
 
   .addon-table,