made things red

barkmanui/src/features/inventory/InventoryList.tsx

@@ -1,7 +1,7 @@
 import {useQuery} from "@tanstack/react-query";
 import {InventoryItem} from "./types";
 import {BarkHeader} from "../../common/components/BarkHeader.tsx";
-import { Table } from '@mantine/core';
+import {Flex, Table} from '@mantine/core';
 import BarkButton from "../../common/components/BarkButton.tsx";
 
 
@@ -28,20 +28,31 @@ function InventoryList() {
     return (
         <>
             <BarkHeader></BarkHeader>
-            <p>
-                ARFF ARFF BARK BARK
-            </p>
-            <BarkButton>Add Item</BarkButton>
+
+            <Flex
+                mih={50}
+                gap="xl"
+                justify="center"
+                align="center"
+                direction="row"
+                wrap="wrap"
+            >
+                <p>
+                    ARFF ARFF BARK BARK
+                </p>
+                <BarkButton>Add Item</BarkButton>
+            </Flex>
+
 
             <div>{isFetching ? 'Updating...' : ''}</div>
 
             <Table striped>
-                <Table.Thead>
-                <Table.Tr className="text-left">
-                    <Table.Th color="red">ID</Table.Th>
-                    <Table.Th className="text-brand">Brand</Table.Th>
-                    <Table.Th className="text-brand">Item</Table.Th>
-                    <Table.Th className="text-brand">Status</Table.Th>
+            <Table.Thead>
+                <Table.Tr>
+                    <Table.Th c="red">ID</Table.Th>
+                    <Table.Th c="red">Brand</Table.Th>
+                    <Table.Th c="red">Item</Table.Th>
+                    <Table.Th c="red">Status</Table.Th>
                 </Table.Tr>
                 </Table.Thead>
                 <Table.Tbody>