From 747efa545d88053e199d3271710b526be0dd3b2b Mon Sep 17 00:00:00 2001
From: Cari <44416326+lilacpixel@users.noreply.github.com>
Date: Thu, 16 May 2024 16:50:56 -0400
Subject: ui(web): Fixed overflow issues for very long titles (#152)

* ui(web): Titles that exceed the allotted space now terminate with an ellipsis

ui(web): Very long titles now break in edit mode instead of overflowing horizontally

* ui(web): Titles on bookmark cards longer than two lines will terminate with an ellipsis

ui(web): Tooltips for long titles now wrap to multiple lines as needed

ui(web): Aligned titles in preview panes to the left margin
---
 apps/web/components/dashboard/preview/EditableTitle.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'apps/web/components/dashboard/preview')

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(
-- 
cgit v1.2.3-70-g09d2