From 271a94909099eb41b329323a98b3a4a3c2f66a48 Mon Sep 17 00:00:00 2001
From: Pouria Delfanazari <pdelfan@gmail.com>
Date: Sun, 9 Nov 2025 21:28:41 -0800
Subject: [PATCH] feat: note modal content skeleton design

---
 .../noteCardModal/NoteCardModalContent.tsx         | 14 +++++++++++---
 .../Skeleton.NoteCardModalContent.tsx              |  5 +++--
 2 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/src/webapp/features/notes/components/noteCardModal/NoteCardModalContent.tsx b/src/webapp/features/notes/components/noteCardModal/NoteCardModalContent.tsx
index fc3eb134..9d30c3d2 100644
--- a/src/webapp/features/notes/components/noteCardModal/NoteCardModalContent.tsx
+++ b/src/webapp/features/notes/components/noteCardModal/NoteCardModalContent.tsx
@@ -138,7 +138,7 @@ export default function NoteCardModalContent(props: Props) {
             href={`/profile/${props.cardAuthor.handle}`}
             target="_blank"
             fw={700}
-            c="blue"
+            c="bright"
             lineClamp={1}
           >
             {props.cardAuthor.name}
@@ -174,9 +174,17 @@ export default function NoteCardModalContent(props: Props) {
                 </Anchor>
               </Tooltip>
               {props.cardContent.title && (
-                <Text fw={500} lineClamp={1} c={'bright'}>
+                <Anchor
+                  component={Link}
+                  href={props.cardContent.url}
+                  target="_blank"
+                  fw={500}
+                  lineClamp={1}
+                  c={'bright'}
+                  w={'fit-content'}
+                >
                   {props.cardContent.title}
-                </Text>
+                </Anchor>
               )}
             </Stack>
           </Group>
diff --git a/src/webapp/features/notes/components/noteCardModal/Skeleton.NoteCardModalContent.tsx b/src/webapp/features/notes/components/noteCardModal/Skeleton.NoteCardModalContent.tsx
index e71d0f08..77344527 100644
--- a/src/webapp/features/notes/components/noteCardModal/Skeleton.NoteCardModalContent.tsx
+++ b/src/webapp/features/notes/components/noteCardModal/Skeleton.NoteCardModalContent.tsx
@@ -4,13 +4,14 @@ export default function NoteCardModalContentSkeleton() {
   return (
     <Stack gap={'xs'}>
       <Group gap={5}>
-        <Avatar size={'md'} />
+        <Avatar size={'sm'} />
         <Skeleton w={100} h={14} />
       </Group>
       {/* Note */}
       <Skeleton w={'100%'} h={14} />
       <Skeleton w={'100%'} h={14} />
-      <Skeleton w={'100%'} h={14} />
+
+      <Skeleton w={'100%'} h={72} radius={'lg'} />
     </Stack>
   );
 }
-- 
2.51.2