updated padding across cards and forms

src/components/HistoryList/HistoryList.tsx

@@ -25,7 +25,7 @@ const HistoryList = () => {
   };
 
   return (
-    <Card className="h-100">
+    <Card className="h-100 p-4">
       <CardHeader title="Alert History" />
       <button
         className="bg-red-600 text-white px-4 py-2 rounded hover:bg-red-700 transition md:w-[10%] mb-2"
@@ -33,9 +33,9 @@ const HistoryList = () => {
       >
         Clear List
       </button>
-      {isLoading && <p>Loading...</p>}
-      {error && <p className="text-red-500">Error: {error.message}</p>}
-      <div className="flex flex-col gap-1">
+      {isLoading && <p className="px-2">Loading...</p>}
+      {error && <p className="text-red-500 px-2">Error: {error.message}</p>}
+      <div className="flex flex-col gap-1 px-2">
         {state?.alertList?.length > 0 ? (
           state?.alertList?.map((alertItem, index) => (
             <div key={index} className="flex flex-row space-x-2">