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/EditableText.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'apps/web/components/dashboard/EditableText.tsx')

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