diff --git a/src/components/button/PrimaryButton.tsx b/src/components/button/PrimaryButton.tsx index ee4df82..c66bc5d 100644 --- a/src/components/button/PrimaryButton.tsx +++ b/src/components/button/PrimaryButton.tsx @@ -27,7 +27,7 @@ export default function PrimaryButton(props: ButtonProps){ "text-white": variant === "solid", "text-blue-600 hover:text-blue-700 active:text-blue-800": (variant === "outline" || variant === "icon") && (!disabled), "text-blue-400/80": (variant === "outline" || variant === "icon") && (disabled), - "text-blue-600 hover:text-white active:text-white": variant === "ghost" || variant === "outline-ghost", + "text-blue-600 hover:text-white active:text-white": (variant === "ghost" || variant === "outline-ghost") && (!disabled), "text-blue-400/80 ": (variant === "ghost" || variant === "outline-ghost") && (disabled) }, //Outline diff --git a/src/ui/person/PersonListSkeleton.tsx b/src/ui/person/PersonListSkeleton.tsx index e722147..bf069b3 100644 --- a/src/ui/person/PersonListSkeleton.tsx +++ b/src/ui/person/PersonListSkeleton.tsx @@ -1,7 +1,78 @@ +import { ButtonShape, ButtonSizeType, ButtonVariant } from "@/components/button/Button"; +import Table from "@/components/table/Table"; +import { elementBg } from "@/util/SkeletonUtil"; +import React from "react"; +import PersonAdminButtons from "./PersonAdminButtons"; + export default function PersonListSkeleton(){ - return ( + const headElements: React.ReactNode[] = [
- Person List Skeleton + Person Name +
, +
+ Discord ID +
, +
+ Characters +
, +
+ Actions
+ ]; + + const bodyElements: React.ReactNode[][] = [ + PersonSkeleton(), + PersonSkeleton(), + PersonSkeleton(), + PersonSkeleton(), + PersonSkeleton(), + PersonSkeleton(), + PersonSkeleton(), + PersonSkeleton(), + PersonSkeleton(), + PersonSkeleton() + ]; + + + return ( + ); } + +export function PersonSkeleton(): React.ReactNode[]{ + const buttonsProps = { + buttonProps: { + variant: "ghost" as ButtonVariant, + size: "md" as ButtonSizeType, + shape: "square" as ButtonShape, + disabled: true + }, + showUpdatePersonModal: () => {}, + showDeletePersonModal: () => {}, + showCreatePersonCharacterModal: () => {} + } + const elements: React.ReactNode[] = [ +
, +
, +
, +
+
 
+ +
+ ]; + + return elements; +}