fix: layout for LocationItem and VenuesSmall fixed for tablet (#505)

RELEASE.md

@@ -52,6 +52,7 @@
 - Sistemato il layout e la visualizzazione della vista del CT Cartella Modulistica per gestire al meglio gli elementi
   titolo, titolo del modulo e link al download in caso di testi lunghi, specialmente su mobile
 - Colore di sfondo per il blocco icone impostato sul colore primario. Sistemato il contrasto tra descrizione e lo sfondo
+- Layout delle card per i luoghi migliorato per dispositivi tablet
 - Risolto un problema di visualizzazione e allineamento delle immagini per le card dei blocchi elenco che rappresentano Persone,
   migliorata la visualizzazione e il layout su dispositivi tablet (intervallo dimensioni: 992px-1199px)
 

src/components/ItaliaTheme/View/Commons/VenuesSmall.jsx

@@ -29,7 +29,7 @@ const Location = ({ location, show_icon }) => {
   const image = Image({ item: location, loading: 'lazy', sizes: '80px' });
   return (
     location && (
-      <div className="card card-teaser shadow border-left-card mt-3 rounded">
+      <div className="card card-teaser shadow border-left-card mt-3 rounded location-item">
         {show_icon && <Icon icon={'it-pin'} />}
         <div className="card-body">
           <div className="card-title h5">{location.title}</div>

src/theme/ItaliaTheme/Components/_cardLocationItem.scss

@@ -0,0 +1,5 @@
+@media (min-width: #{map-get($grid-breakpoints, lg)}) and (max-width: #{map-get($grid-breakpoints, xl)}) {
+  .card-wrapper.card-teaser-wrapper .card-teaser.location-item {
+    flex: 0 0 100%;
+  }
+}

src/theme/site.scss

@@ -128,6 +128,7 @@
 @import 'ItaliaTheme/Components/breadcrumbs';
 @import 'ItaliaTheme/Components/card';
 @import 'ItaliaTheme/Components/cardPersona';
+@import 'ItaliaTheme/Components/cardLocationItem';
 @import 'ItaliaTheme/Components/contactsCard';
 @import 'ItaliaTheme/Components/navscroll';
 @import 'ItaliaTheme/Components/customerSatisfaction';