From e40cff7febdfba66a773fd655574f262fc29b8b1 Mon Sep 17 00:00:00 2001
From: highperfocused <highperfocused@pm.me>
Date: Sun, 5 Oct 2025 17:39:22 +0200
Subject: [PATCH] Enhance MarkdownContent styling to improve text wrapping and
 link behavior

---
 src/components/MarkdownContent.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/MarkdownContent.tsx b/src/components/MarkdownContent.tsx
index 1f72387..7ece0e7 100644
--- a/src/components/MarkdownContent.tsx
+++ b/src/components/MarkdownContent.tsx
@@ -15,7 +15,7 @@ interface MarkdownContentProps {
  */
 export function MarkdownContent({ content, className }: MarkdownContentProps) {
   return (
-    <div className={cn('prose prose-slate dark:prose-invert max-w-none', className)}>
+    <div className={cn('prose prose-slate dark:prose-invert max-w-none break-words overflow-wrap-anywhere', className)}>
       <ReactMarkdown
         remarkPlugins={[remarkGfm]}
         components={{
@@ -32,7 +32,7 @@ export function MarkdownContent({ content, className }: MarkdownContentProps) {
                 return (
                   <Link
                     to={`/${nostrId}`}
-                    className="text-blue-500 hover:underline"
+                    className="text-blue-500 hover:underline break-all"
                   >
                     {children}
                   </Link>
@@ -49,7 +49,7 @@ export function MarkdownContent({ content, className }: MarkdownContentProps) {
                 href={href}
                 target="_blank"
                 rel="noopener noreferrer"
-                className="text-blue-500 hover:underline"
+                className="text-blue-500 hover:underline break-all"
                 {...props}
               >
                 {children}