Fix: Overflow in Navbar by Making Table Scrollable (To avoid overflow)

Optimize the code by implementing the style globally

src/app/system/audit-trails/audit-trails.component.html

@@ -97,7 +97,7 @@
   </mat-option>
 </mat-autocomplete>
 
-<div class="container mat-elevation-z8">
+<div class="container mat-elevation-z8 table-container">
 
   <table mat-table [dataSource]="dataSource" matSort>
 

src/app/system/manage-external-events/manage-external-events.component.html

@@ -14,7 +14,7 @@
     </div>
   </div>
 
-  <div #eventsTable class="mat-elevation-z8">
+  <div #eventsTable class="mat-elevation-z8 table-container">
 
     <table mat-table [dataSource]="dataSource" matSort>
 

src/app/system/manage-reports/manage-reports.component.html

@@ -16,7 +16,7 @@
         </mat-form-field>
     </div>
 
-    <div #reportsTable class="mat-elevation-z8">
+    <div #reportsTable class="mat-elevation-z8 table-container">
 
         <table mat-table [dataSource]="dataSource" matSort>