added: feat table pagination

src/app/shared/components/table/table.component.css

 .table-container {
-    box-shadow: 0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f
+    box-shadow: 0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f;
+    margin-bottom: 10px;
 }
 
 .table-header {
@@ -56,6 +57,8 @@
     border: 1px solid #e4e4e4;
     font-size: 12px;
     font-weight: 200;
+    padding-left: 10px;
+    padding-right: 10px;
 }
 
 .btn-action-table span {
@@ -64,4 +67,32 @@
 
 .btn-action-table i {
     margin-right: 6px;
+}
+
+.pagination {
+    padding-left: 15px;
+    padding-right: 20px;
+    padding-top: 10px;
+    padding-bottom: 10px;
+    color: #676a6c;
+}
+
+.btn-reload, .btn-left, .btn-right {
+    color: #676a6c;
+    border-radius: 50%;
+    height: 40px;
+    width: 40px;
+}
+
+.btn-reload i {
+    font-size: 16px;
+    font-weight: 700;
+}
+
+.select-pagination {
+    background-color: white;
+    border: none;
+    border-bottom: 1px solid #676a6c;
+    color: #676a6c;
+    width: 60px;
 }
\ No newline at end of file

src/app/shared/components/table/table.component.html

@@ -2,7 +2,7 @@
     <div class="content flex-fill">
         <shared-table-filter></shared-table-filter>
         <div class="table-container mt-3">
-            <table class="table table-striped">
+            <table class="table table-striped mb-0">
                 <thead class="pt-4" >
                     <tr class="table-header">
                         <th *ngFor="let item of tableModel" class="table-item">{{ item }}</th>
@@ -27,8 +27,33 @@
                     </tr>
                 </tbody>
             </table>
-            <div class="pagination w-auto">
-                
+            <div class="pagination w-auto d-flex align-items-center">
+                <div class="flex-fill">
+                    <button class="btn btn-reload">
+                        <i class="bi bi-arrow-clockwise"></i>
+                    </button>
+                </div>
+                <div class="d-flex align-items-center gap-4">
+                    <div class="d-flex">
+                        <p class="m-0 pe-2">Resultados por pagina: </p>
+                        <select class="select-pagination">
+                            <option value="10">5</option>
+                            <option value="20">10</option>
+                            <option value="50">15</option>
+                        </select>
+                    </div>
+                    <div class="d-flex">
+                        <p class="m-0">1 - 3 de 1</p>
+                    </div>
+                    <div class="d-flex">
+                        <button class="btn btn-right">
+                            <i class="bi bi-chevron-left"></i>
+                        </button>
+                        <button class="btn btn-left">
+                            <i class="bi bi-chevron-right"></i>
+                        </button>
+                    </div>
+                </div>
             </div>
         </div>
     </div>
@@ -37,4 +62,4 @@
             <i class="bi bi-file-earmark"></i>
         </button>
     </div>
-</div>
+</div>
\ No newline at end of file