From 77a0dba73b358291663739491c855e7d224f8bf3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Nicole=20Miko=C5=82ajczyk?= <git@mkljczk.pl>
Date: Mon, 12 May 2025 10:44:00 +0200
Subject: [PATCH] pl-fe: do not truncate headers on landing page
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Nicole Mikołajczyk <git@mkljczk.pl>
---
 packages/pl-fe/src/components/ui/card.tsx  |  5 +++--
 packages/pl-fe/src/pages/utils/landing.tsx | 12 ++++++------
 2 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/packages/pl-fe/src/components/ui/card.tsx b/packages/pl-fe/src/components/ui/card.tsx
index 996f903f6..977901635 100644
--- a/packages/pl-fe/src/components/ui/card.tsx
+++ b/packages/pl-fe/src/components/ui/card.tsx
@@ -89,11 +89,12 @@ const CardHeader: React.FC<ICardHeader> = ({ className, children, backHref, onBa
 
 interface ICardTitle {
   title: React.ReactNode;
+  truncate?: boolean;
 }
 
 /** A card's title. */
-const CardTitle: React.FC<ICardTitle> = ({ title }): JSX.Element => (
-  <Text size='xl' weight='bold' tag='h1' data-testid='card-title' truncate>{title}</Text>
+const CardTitle: React.FC<ICardTitle> = ({ title, truncate = true }): JSX.Element => (
+  <Text size='xl' weight='bold' tag='h1' data-testid='card-title' truncate={truncate}>{title}</Text>
 );
 
 interface ICardBody {
diff --git a/packages/pl-fe/src/pages/utils/landing.tsx b/packages/pl-fe/src/pages/utils/landing.tsx
index d72e78bf4..8934455cf 100644
--- a/packages/pl-fe/src/pages/utils/landing.tsx
+++ b/packages/pl-fe/src/pages/utils/landing.tsx
@@ -26,27 +26,27 @@ const LandingPage = () => {
             <Button to='/login/external' theme='primary'><FormattedMessage id='landing.sign_in' defaultMessage='Sign in' /></Button>
           </HStack>
           <Card variant='rounded'>
-            <CardTitle title={<FormattedMessage id='landing.use_with_platform.title' defaultMessage='Use with your favorite Fediverse platform.' />} />
+            <CardTitle title={<FormattedMessage id='landing.use_with_platform.title' defaultMessage='Use with your favorite Fediverse platform.' />} truncate={false} />
             <Text><FormattedMessage id='landing.use_with_platform.description' defaultMessage='pl-fe works with any backend implementing Mastodon API.' /></Text>
           </Card>
           <Card variant='rounded'>
-            <CardTitle title={<FormattedMessage id='landing.feature_rich.title' defaultMessage='Feature-rich.' />} />
+            <CardTitle title={<FormattedMessage id='landing.feature_rich.title' defaultMessage='Feature-rich.' />} truncate={false} />
             <Text><FormattedMessage id='landing.feature_rich.description' defaultMessage='pl-fe includes a lot features to improve your experience, like WYSIWYG text editor, draft posts and language detection.' /></Text>
           </Card>
           <Card variant='rounded'>
-            <CardTitle title={<FormattedMessage id='landing.pl_api.title' defaultMessage='Get the most out of your Fediverse instance.' />} />
+            <CardTitle title={<FormattedMessage id='landing.pl_api.title' defaultMessage='Get the most out of your Fediverse instance.' />} truncate={false} />
             <Text><FormattedMessage id='landing.pl_api.description' defaultMessage='pl-fe implements features not present in standard Mastodon API, like emoji reactions, chats or interaction policies.' /></Text>
           </Card>
           <Card variant='rounded'>
-            <CardTitle title={<FormattedMessage id='landing.customizable.title' defaultMessage='Customizable.' />} />
+            <CardTitle title={<FormattedMessage id='landing.customizable.title' defaultMessage='Customizable.' />} truncate={false} />
             <Text><FormattedMessage id='landing.customizable.description' defaultMessage='pl-fe lets you choose between three themes and adjust accent color to your liking.' /></Text>
           </Card>
           <Card variant='rounded'>
-            <CardTitle title={<FormattedMessage id='landing.private.title' defaultMessage='Stay private.' />} />
+            <CardTitle title={<FormattedMessage id='landing.private.title' defaultMessage='Stay private.' />} truncate={false} />
             <Text><FormattedMessage id='landing.private.description' defaultMessage='pl-fe includes features which help you maintain online privacy. This includes URL cleaning, which helps you remove unwanted parts of URLs used to mark your online activity.' /></Text>
           </Card>
           <Card variant='rounded'>
-            <CardTitle title={<FormattedMessage id='landing.open_source.title' defaultMessage='Open source.' />} />
+            <CardTitle title={<FormattedMessage id='landing.open_source.title' defaultMessage='Open source.' />} truncate={false} />
             <Text><FormattedMessage id='landing.open_source.description' defaultMessage='pl-fe is free and open source software. You can participate in development, contribute to the project or report bugs.' /></Text>
           </Card>
         </Stack>