diff options
Diffstat (limited to 'apps/web/components')
4 files changed, 15 insertions, 7 deletions
diff --git a/apps/web/components/dashboard/EditableText.tsx b/apps/web/components/dashboard/EditableText.tsx index 7539bd8f..a8f61c13 100644 --- a/apps/web/components/dashboard/EditableText.tsx +++ b/apps/web/components/dashboard/EditableText.tsx @@ -96,7 +96,7 @@ function ViewMode({ }: Props) { return ( <Tooltip delayDuration={500}> - <div className="flex items-center gap-3 text-center"> + <div className="flex max-w-full items-center gap-3"> <TooltipTrigger asChild> {originalText ? ( <p className={viewClassName}>{originalText}</p> @@ -119,7 +119,7 @@ function ViewMode({ </div> <TooltipPortal> {originalText && ( - <TooltipContent side="bottom" className="max-w-[40ch]"> + <TooltipContent side="bottom" className="max-w-[40ch] break-words"> {originalText} </TooltipContent> )} diff --git a/apps/web/components/dashboard/bookmarks/BookmarkLayoutAdaptingCard.tsx b/apps/web/components/dashboard/bookmarks/BookmarkLayoutAdaptingCard.tsx index d282c3f4..e1cc1f7c 100644 --- a/apps/web/components/dashboard/bookmarks/BookmarkLayoutAdaptingCard.tsx +++ b/apps/web/components/dashboard/bookmarks/BookmarkLayoutAdaptingCard.tsx @@ -65,7 +65,11 @@ function ListView({ </div> <div className="flex h-full flex-1 flex-col justify-between gap-2 overflow-hidden"> <div className="flex flex-col gap-2 overflow-hidden"> - {title && <div className="flex-none shrink-0 text-lg">{title}</div>} + {title && ( + <div className="line-clamp-2 flex-none shrink-0 overflow-hidden text-ellipsis break-words text-lg"> + {title} + </div> + )} {content && <div className="shrink-1 overflow-hidden">{content}</div>} <div className="flex shrink-0 flex-wrap gap-1 overflow-hidden"> <TagList @@ -104,7 +108,11 @@ function GridView({ {img && <div className="h-56 w-full shrink-0 overflow-hidden">{img}</div>} <div className="flex h-full flex-col justify-between gap-2 overflow-hidden p-2"> <div className="grow-1 flex flex-col gap-2 overflow-hidden"> - {title && <div className="flex-none shrink-0 text-lg">{title}</div>} + {title && ( + <div className="line-clamp-2 flex-none shrink-0 overflow-hidden text-ellipsis break-words text-lg"> + {title} + </div> + )} {content && <div className="shrink-1 overflow-hidden">{content}</div>} <div className="flex shrink-0 flex-wrap gap-1 overflow-hidden"> <TagList diff --git a/apps/web/components/dashboard/bookmarks/LinkCard.tsx b/apps/web/components/dashboard/bookmarks/LinkCard.tsx index 348e7f43..1446b031 100644 --- a/apps/web/components/dashboard/bookmarks/LinkCard.tsx +++ b/apps/web/components/dashboard/bookmarks/LinkCard.tsx @@ -17,7 +17,7 @@ function LinkTitle({ bookmark }: { bookmark: ZBookmarkTypeLink }) { const link = bookmark.content; const parsedUrl = new URL(link.url); return ( - <Link className="line-clamp-2" href={link.url} target="_blank"> + <Link href={link.url} target="_blank"> {bookmark.title ?? link?.title ?? parsedUrl.host} </Link> ); diff --git a/apps/web/components/dashboard/preview/EditableTitle.tsx b/apps/web/components/dashboard/preview/EditableTitle.tsx index 8067e23d..237ad108 100644 --- a/apps/web/components/dashboard/preview/EditableTitle.tsx +++ b/apps/web/components/dashboard/preview/EditableTitle.tsx @@ -35,8 +35,8 @@ export function EditableTitle({ bookmark }: { bookmark: ZBookmark }) { return ( <EditableText originalText={title} - editClassName="p-2 text-center text-lg" - viewClassName="line-clamp-2 text-lg" + editClassName="p-2 text-lg break-all" + viewClassName="break-words line-clamp-2 text-lg text-ellipsis" untitledClassName="text-lg italic text-gray-600" onSave={(newTitle) => { updateBookmark( |