waku-org
/
waku-lab
mirror of https://github.com/waku-org/waku-lab.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

chore(buddybook): fix modal CSS

This commit is contained in:
Danish Arora 2024-11-05 11:43:50 +05:30
parent cc5629810d
commit 9239b80487
No known key found for this signature in database
GPG Key ID: 1C6EF37CDAE1426E
3 changed files with 22 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
examples/buddybook/src/components/Chain/Create/CreationPreview.tsx
View File

@ -165,7 +165,7 @@ const ChainCreationForm: React.FC = () => {
</form>
</CardContent>
<Dialog open={showModal} onOpenChange={handleCloseModal}>
<DialogContent>
<DialogContent className="sm:max-w-md">
<DialogHeader>
<DialogTitle>{isSuccess ? "Chain Created" : "Chain Preview"}</DialogTitle>
</DialogHeader>

14
examples/buddybook/src/components/Chain/View/ChainList.tsx
View File

@ -42,7 +42,7 @@ const ChainList: React.FC<ChainListProps> = ({ chainsData, onChainUpdate, isLoad
<p>{block.description}</p>
<div className="flex flex-col space-y-2 mt-2">
<p className="text-sm text-muted-foreground">
Created by: <SignerName address={block.signatures[0].address} />
<SignerName address={block.signatures[0].address} prefix="Created by" />
</p>
<p className="text-sm text-muted-foreground">
Created at: {new Date(block.timestamp).toLocaleString()}
@ -88,7 +88,9 @@ const ChainList: React.FC<ChainListProps> = ({ chainsData, onChainUpdate, isLoad
</Card>
) : (
<div className="flex-grow">
<SignerName address={block.signatures[0].address} />
<p className="text-sm">
<SignerName address={block.signatures[0].address} prefix="Signed by" />
</p>
</div>
)}
</div>
@ -129,13 +131,13 @@ const ChainList: React.FC<ChainListProps> = ({ chainsData, onChainUpdate, isLoad
);
};
const SignerName: React.FC<{ address: `0x${string}` }> = ({ address }) => {
const SignerName: React.FC<{ address: `0x${string}`; prefix?: string }> = ({ address, prefix }) => {
const { data: ensName } = useEnsName({ address })
return (
<p className="text-sm">
Signed by: {ensName || `${address.slice(0, 6)}...${address.slice(-4)}`}
</p>
<span className="text-sm">
{prefix && `${prefix}: `}{ensName || `${address.slice(0, 6)}...${address.slice(-4)}`}
</span>
);
};

6
examples/buddybook/src/components/ui/dialog.tsx
View File

@ -31,15 +31,19 @@ const DialogContent = React.forwardRef<
React.ElementRef<typeof DialogPrimitive.Content>,
React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>
>(({ className, ...props }, ref) => (
<DialogPortal>
<DialogOverlay />
<DialogPrimitive.Content
ref={ref}
className={cn(
"fixed z-50 grid w-full gap-4 rounded-b-lg border bg-background p-6 shadow-lg animate-in data-[state=open]:fade-in-90 data-[state=open]:slide-in-from-bottom-10 sm:max-w-lg sm:rounded-lg sm:zoom-in-90 data-[state=open]:sm:slide-in-from-bottom-0",
"fixed left-[50%] top-[50%] z-50 grid w-full translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200",
"rounded-lg",
"max-h-[85vh] overflow-y-auto",
className
)}
{...props}
/>
</DialogPortal>
))
DialogContent.displayName = DialogPrimitive.Content.displayName