Merge pull request 'table-pagination' (#29) from table-pagination into main

Reviewed-on: #29

src/pages/Tracker/tracker.scss

@@ -1951,4 +1951,100 @@
       }
     }
   }
+
+  .table {
+    &__search {
+      display: flex;
+      background: #F0F2F5;
+      border-radius: 5px;
+      width: 100%;
+      padding: 14px 12px;
+      column-gap: 10px;
+      align-items: center;
+      margin-bottom: 20px;
+
+      img {
+        width: 20px;
+        height: 20px;
+      }
+
+      input {
+        background: none;
+        border: none;
+        outline: none;
+        font-size: 16px;
+        color: #9BABC5;
+        width: 100%;
+
+        &::placeholder {
+          color: #9BABC5;
+        }
+      }
+    }
+
+    &__pagination {
+      display: flex;
+      margin: 25px auto 0;
+      column-gap: 12px;
+
+      button {
+        font-size: 14px;
+        width: 32px;
+        border-radius: 5px;
+        height: 32px;
+        color: #2E3A59;
+      }
+
+      .switch {
+        border: none;
+        background: #F0F2F5;
+        font-weight: 600;
+      }
+
+      .disable {
+        opacity: 0.7;
+      }
+    }
+
+    &__pages {
+      display: flex;
+      column-gap: 4px;
+      color: black;
+      background: white;
+
+      .page {
+        border: 1px solid #E8ECF8;
+        background: none;
+
+        &--active {
+          border: none;
+          background: #9DA65D;
+          color: white;
+        }
+      }
+    }
+  }
+
+  table {
+    grid-template-columns: minmax(0px, 2fr) minmax(0px, 1fr) minmax(0px, 1fr) minmax(0px, 1fr);
+    th {
+      border-top: none;
+      border-bottom: 1px solid #F5F6F8;
+      color: #2E3A59;
+      padding: 0 7.5px 15px;
+    }
+
+    td {
+      padding: 22px 7.5px;
+      color: #2E3A59;
+      border-top: none;
+
+      p {
+        max-width: 430px;
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+      }
+    }
+  }
 }