Issue #387 - Fix padding on schedule to fix issue in shifting on mobile

components/schedule/BackupWitnessSchedule.tsx

@@ -61,7 +61,7 @@ const BackupWitnessSchedule: React.FC<BackupWitnessScheduleProps> = ({
   return (
     <>
       <div className="flex w-full overflow-auto">
-        <div className="text-text w-[100%] bg-theme dark:bg-theme p-5">
+        <div className="text-text w-[100%] bg-theme dark:bg-theme p-4">
           <p className="text-center text-3xl my-2">Backup Witness Schedule</p>
           <Table data-testid="table-body">
             <TableHeader>

components/schedule/WitnessSchedule.tsx

@@ -88,9 +88,8 @@ const WitnessSchedule: React.FC<WitnessSchedule> = ({
   blocksLeftBeforeRefetch,
 }) => {
   return (
-    <div>
       <div className="flex w-full overflow-auto">
-        <div className="text-text w-[100%] bg-theme dark:bg-theme p-5">
+        <div className="text-text w-[100%] bg-theme dark:bg-theme p-4">
           <p className="text-center text-3xl my-2">Witness Schedule</p>
 
           <Table data-testid="table-body">
@@ -109,7 +108,6 @@ const WitnessSchedule: React.FC<WitnessSchedule> = ({
           </div>
         </div>
       </div>
-    </div>
   );
 };
 

pages/schedule.tsx

@@ -63,7 +63,7 @@ const Schedule = () => {
       <Loader2 className="animate-spin mt-1 h-12 w-12 ml-3 ..." />
     </div>
   ) : (
-    <div className="w-full grid lg:grid-cols-2 gap-4 content-start px-[2rem] md:px-[5rem] ">
+    <div className="w-full grid lg:grid-cols-2 gap-4 content-start px-[1rem] md:px-[5rem] ">
       <WitnessSchedule
         data={scheduledWitnessesData}
         currentProducer={producerAccount}