style: make group cards responsive and add text truncate property to …

…improve card view
bandada-infra · Sep 22, 2024 · 11e8c31 · 11e8c31
1 parent b0381b7
commit 11e8c31
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 1 deletion.
diff --git a/apps/dashboard/src/components/group-card.tsx b/apps/dashboard/src/components/group-card.tsx
@@ -40,6 +40,7 @@ export default function GroupCard({
             fontFamily="DM Sans, sans-serif"
             p="24px"
             minW="330px"
+            maxW="370px"
             h="280px"
         >
             <Box>
@@ -84,6 +85,7 @@ export default function GroupCard({
 
                 <Text
                     mt="12px"
+                    noOfLines={2}
                     color={!description ? "balticSea.300" : "balticSea.600"}
                 >
                     {type !== "on-chain" &&

diff --git a/apps/dashboard/src/pages/group.tsx b/apps/dashboard/src/pages/group.tsx
@@ -350,7 +350,7 @@ ${memberIds.join("\n")}
                 </Heading>
 
                 {_group.description && (
-                    <Text mt="15px" color="balticSea.800">
+                    <Text mt="15px" color="balticSea.800" maxW="70vw">
                         {_group.description}
                     </Text>
                 )}