Us 71576 long titles in cards

RELEASE.md

@@ -53,6 +53,7 @@
 
 ### Fix
 
+- Ora i titoli molto lunghi e senza spazi nelle card vengono spezzati automaticamente con un trattino ("-") per evitare problemi di layout.
 - Le card del blocco elenco di tipo "Bandi" mostrano ora la tipologia bando correttamente.
 
 ## Versione 12.7.3 (26/11/2025)

src/components/ItaliaTheme/Blocks/Listing/SquaresImageTemplate.jsx

@@ -46,7 +46,11 @@ const SquaresImageTemplate = ({
                 key={index}
                 data-element={id_lighthouse}
               >
-                <span className="title fw-bold">{item?.title}</span>
+                <span className="title fw-bold">
+                  {item?.title.length > 56
+                    ? `${item?.title.slice(0, 56)}…`
+                    : item?.title}
+                </span>
               </UniversalLink>
             );
           })}

src/theme/ItaliaTheme/Blocks/_cardWithSlideUpTextTemplate.scss

@@ -27,6 +27,9 @@
 
     .title-link {
       text-decoration: none;
+      overflow-wrap: anywhere;
+      word-break: break-word;
+      hyphens: auto;
     }
 
     .title {

src/theme/ItaliaTheme/Blocks/_completeBlockLinkstemplate.scss

@@ -35,6 +35,9 @@
     font-size: 1rem !important;
     font-weight: 700 !important;
     line-height: 1.44444rem;
+    overflow-wrap: anywhere;
+    word-break: break-word;
+    hyphens: auto;
   }
 
   .card:after {

src/theme/ItaliaTheme/Blocks/_gridGalleryTemplate.scss

@@ -134,6 +134,9 @@
         margin: 0;
         color: #fff;
         text-align: left;
+        overflow-wrap: anywhere;
+        word-break: break-word;
+        hyphens: auto;
       }
 
       a {

src/theme/ItaliaTheme/Blocks/_squaresImageTemplate.scss

@@ -30,6 +30,9 @@
       max-height: 100%;
       color: #fff;
       font-size: 1.2rem;
+      overflow-wrap: anywhere;
+      word-break: break-word;
+      hyphens: auto;
     }
 
     &:before {

src/theme/ItaliaTheme/Components/_card.scss

@@ -1,6 +1,13 @@
 .public-ui {
   .card {
     .card-body {
+      .card-title {
+        a {
+          overflow-wrap: anywhere;
+          word-break: break-word;
+          hyphens: auto;
+        }
+      }
       .card-text {
         line-height: 1.5em;
       }