improve profile delete styling

ui/src/components/api-keys/table.tsx

@@ -64,8 +64,6 @@ export default function ApiKeysTable({
           header: "Delete",
           cell: ({ row }) => (
             <ConfirmButton
-              variant="filled"
-              color="red"
               icon={<ICONS.Delete size="1rem" />}
               onClick={() => onDelete(row.original.key)}
               loading={deletePending}

ui/src/pages/profile/linked-logins.tsx

@@ -95,7 +95,6 @@ export const LinkedLogins = ({
     <Section
       title="Providers"
       titleFz="h3"
-     
       icon={<ICONS.Provider size="1.2rem" />}
       withBorder
     >
@@ -151,7 +150,6 @@ export const LinkedLogins = ({
             }) =>
               data ? (
                 <ConfirmModal
-                  targetProps={{ color: "red" }}
                   icon={<ICONS.Unlink size="1rem" />}
                   onConfirm={() => unlink({ provider })}
                   confirmText="Unlink"

ui/src/pages/profile/passkey.tsx

@@ -68,9 +68,7 @@ export const EnrollPasskey = ({ user }: { user: Types.User }) => {
           icon={<Trash size="1rem" />}
           loading={unenrollPending}
           onConfirm={() => unenroll({})}
-          variant="filled"
-          color="red"
-          w={220}
+          targetProps={{ variant: "filled", color: "red", c: "bw", w: 220 }}
         >
           Unenroll Passkey 2FA
         </ConfirmModal>

ui/src/pages/profile/totp.tsx

@@ -135,8 +135,7 @@ export const EnrollTotp = ({ user }: { user: Types.User }) => {
           icon={<Trash size="1rem" />}
           loading={unenrollPending}
           onConfirm={() => unenroll({})}
-          color="red"
-          w={220}
+          targetProps={{ variant: "filled", color: "red", c: "bw", w: 220 }}
         >
           Unenroll TOTP 2FA
         </ConfirmModal>

ui/src/pages/settings/variables/delete.tsx

@@ -3,7 +3,13 @@ import { ICONS } from "@/theme/icons";
 import ConfirmButton from "@/ui/confirm-button";
 import { notifications } from "@mantine/notifications";
 
-export default function DeleteVariable({ name, disabled }: { name: string; disabled: boolean }) {
+export default function DeleteVariable({
+  name,
+  disabled,
+}: {
+  name: string;
+  disabled: boolean;
+}) {
   const invalidate = useInvalidate();
   const { mutate, isPending } = useWrite("DeleteVariable", {
     onSuccess: () => {