app/src/components/pilots/Pilots.tsx

@@ -4,7 +4,6 @@ import {
   Button,
   Card,
   PlusIcon,
-  DatePicker,
   Typography
 } from '@noahspan/noahspan-components';
 
@@ -13,27 +12,24 @@ const Pilots: React.FC<unknown> = () => {
   const onOpenCloseDrawer = () => {
     setIsDrawerOpen(!isDrawerOpen);
   };
-  const [date, setDate] = useState();
 
   return (
-    <Card className="mt-6">
+    <Card className="mt-6 px-6">
-      <div className="px-6">
+      <Typography variant="h3">Pilots</Typography>
-        <Typography variant="h3">Pilots</Typography>
+      <Button
-        <Button
+        className="flex items-center gap-3"
-          className="flex items-center gap-3"
+        variant="filled"
-          variant="filled"
+        onClick={onOpenCloseDrawer}
-          onClick={onOpenCloseDrawer}
+        data-testid="add-pilot-button"
-          data-testid="add-pilot-button"
+      >
-        >
+        <PlusIcon size="lg" />
-          <PlusIcon size="lg" />
+        Add Pilot
-          Add Pilot
+      </Button>
-        </Button>
 
-        <PilotForm
+      <PilotForm
-          isDrawerOpen={isDrawerOpen}
+        isDrawerOpen={isDrawerOpen}
-          onOpenCloseDrawer={onOpenCloseDrawer}
+        onOpenCloseDrawer={onOpenCloseDrawer}
-        />
+      />
-      </div>
     </Card>
   );
 };

app/src/index.css

@@ -3,6 +3,9 @@
 @tailwind utilities;
 
 @layer base {
+  body {
+    @apply bg-black;
+  }
   h1 {
     @apply text-2xl font-bold leading-7 text-gray-900;
   }