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> </form>
</CardContent> </CardContent>
<Dialog open={showModal} onOpenChange={handleCloseModal}> <Dialog open={showModal} onOpenChange={handleCloseModal}>
<DialogContent> <DialogContent className="sm:max-w-md">
<DialogHeader> <DialogHeader>
<DialogTitle>{isSuccess ? "Chain Created" : "Chain Preview"}</DialogTitle> <DialogTitle>{isSuccess ? "Chain Created" : "Chain Preview"}</DialogTitle>
</DialogHeader> </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> <p>{block.description}</p>
<div className="flex flex-col space-y-2 mt-2"> <div className="flex flex-col space-y-2 mt-2">
<p className="text-sm text-muted-foreground"> <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>
<p className="text-sm text-muted-foreground"> <p className="text-sm text-muted-foreground">
Created at: {new Date(block.timestamp).toLocaleString()} Created at: {new Date(block.timestamp).toLocaleString()}
@ -88,7 +88,9 @@ const ChainList: React.FC<ChainListProps> = ({ chainsData, onChainUpdate, isLoad
</Card> </Card>
) : ( ) : (
<div className="flex-grow"> <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>
)} )}
</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 }) const { data: ensName } = useEnsName({ address })
return ( return (
<p className="text-sm"> <span className="text-sm">
Signed by: {ensName || `${address.slice(0, 6)}...${address.slice(-4)}`} {prefix && `${prefix}: `}{ensName || `${address.slice(0, 6)}...${address.slice(-4)}`}
</p> </span>
); );
}; };

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

@ -31,15 +31,19 @@ const DialogContent = React.forwardRef<
React.ElementRef<typeof DialogPrimitive.Content>, React.ElementRef<typeof DialogPrimitive.Content>,
React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>
>(({ className, ...props }, ref) => ( >(({ className, ...props }, ref) => (
<DialogPrimitive.Content <DialogPortal>
ref={ref} <DialogOverlay />
className={cn( <DialogPrimitive.Content
"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", ref={ref}
"max-h-[85vh] overflow-y-auto", className={cn(
className "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",
{...props} "max-h-[85vh] overflow-y-auto",
/> className
)}
{...props}
/>
</DialogPortal>
)) ))
DialogContent.displayName = DialogPrimitive.Content.displayName DialogContent.displayName = DialogPrimitive.Content.displayName