improved admin and events tables

client/src/app/admin/(tasks)/TaskEditor.tsx

@@ -47,7 +47,11 @@ export default function TaskEditor(props: {
 		<Modal
 			isOpen={props.isOpen}
 			onOpenChange={props.onOpenChange}
-			shadow={"none" as "sm"}
+			shadow={"none"}
+			backdrop="blur"
+			classNames={{
+				base: "bg-accent-5",
+			}}
 		>
 			<Form
 				validationBehavior="native"
@@ -55,7 +59,6 @@ export default function TaskEditor(props: {
 					e.preventDefault();
 					submit(e);
 				}}
-				className="w-fit border-2"
 			>
 				<ModalContent>
 					<ModalHeader>

client/src/app/admin/(tasks)/Tasks.tsx

@@ -88,7 +88,7 @@ export default function Tasks() {
 	}
 
 	const topContent = (
-		<>
+		<div>
 			<Button
 				color="primary"
 				startContent={<AddLarge />}
@@ -96,7 +96,7 @@ export default function Tasks() {
 			>
 				Add Task
 			</Button>
-		</>
+		</div>
 	);
 
 	return (
@@ -109,6 +109,13 @@ export default function Tasks() {
 				topContent={topContent}
 				sortDescriptor={tasks.sortDescriptor}
 				onSortChange={tasks.sort}
+				topContentPlacement="outside"
+				classNames={{
+					wrapper: "bg-accent-4",
+					tr: "even:bg-accent-5 ",
+					th: "font-subheadline text-xl text-accent-1 bg-transparent ",
+					thead: "[&>tr]:first:!shadow-border",
+				}}
 			>
 				<TableHeader>
 					<TableColumn allowsSorting key="userName">
@@ -173,7 +180,7 @@ export default function Tasks() {
 			<DeleteConfirmation
 				isOpen={!!deleteTask}
 				onOpenChange={(isOpen) => (!isOpen ? setDeleteTask(undefined) : null)}
-				header="Delete Task"
+				itemName="Task"
 				onDelete={() => sendDeleteTask(deleteTask?.id)}
 			>
 				{!!deleteTask ? (