From d331288ebc49fb1b74137d4006bcc4e925e84df6 Mon Sep 17 00:00:00 2001
From: Giulia Ghisini <giulia.ghisini@redturtle.it>
Date: Thu, 16 Nov 2023 14:54:57 +0100
Subject: [PATCH] fix: revert  card image height changed like bootstrap-italia
 templates

---
 .../ItaliaTheme/Blocks/Listing/CardWithImageTemplate.jsx   | 1 +
 .../ItaliaTheme/Blocks/Listing/InEvidenceTemplate.jsx      | 7 ++++++-
 .../TemplatesSkeletons/CardWithImageTemplateSkeleton.jsx   | 6 +++++-
 .../TemplatesSkeletons/InEvidenceTemplateSkeleton.jsx      | 7 ++++++-
 .../Blocks/RssBlock/CardWithImageRssTemplate.jsx           | 2 +-
 .../TemplatesSkeleton/CardWithImageRssTemplateSkeleton.jsx | 2 +-
 src/components/ItaliaTheme/View/Commons/GenericCard.jsx    | 2 +-
 .../ItaliaTheme/Blocks/_cardWithImageAndInEvidence.scss    | 6 ++++++
 src/theme/ItaliaTheme/_main.scss                           | 4 ++++
 src/theme/bootstrap-override/bootstrap-italia/_card.scss   | 6 ------
 10 files changed, 31 insertions(+), 12 deletions(-)

diff --git a/src/components/ItaliaTheme/Blocks/Listing/CardWithImageTemplate.jsx b/src/components/ItaliaTheme/Blocks/Listing/CardWithImageTemplate.jsx
index 14f76ccf6..54e5734fc 100644
--- a/src/components/ItaliaTheme/Blocks/Listing/CardWithImageTemplate.jsx
+++ b/src/components/ItaliaTheme/Blocks/Listing/CardWithImageTemplate.jsx
@@ -118,6 +118,7 @@ const CardWithImageTemplate = (props) => {
                 ) : (
                   <Card
                     className={cx('listing-item card-bg', {
+                      'card-img': showImage,
                       'card-teaser-image card-flex no-after':
                         item['@type'] === 'Persona',
                     })}
diff --git a/src/components/ItaliaTheme/Blocks/Listing/InEvidenceTemplate.jsx b/src/components/ItaliaTheme/Blocks/Listing/InEvidenceTemplate.jsx
index c67bfbb5b..408ab9182 100644
--- a/src/components/ItaliaTheme/Blocks/Listing/InEvidenceTemplate.jsx
+++ b/src/components/ItaliaTheme/Blocks/Listing/InEvidenceTemplate.jsx
@@ -104,7 +104,12 @@ const InEvidenceTemplate = (props) => {
                 key={index}
               />
             ) : (
-              <Card key={index} className={cx('listing-item card-bg')}>
+              <Card
+                key={index}
+                className={cx('listing-item card-bg', {
+                  'card-img': index === 0 && image,
+                })}
+              >
                 {index === 0 && image && (
                   <div className="img-responsive-wrapper">
                     <div className="img-responsive">
diff --git a/src/components/ItaliaTheme/Blocks/Listing/TemplatesSkeletons/CardWithImageTemplateSkeleton.jsx b/src/components/ItaliaTheme/Blocks/Listing/TemplatesSkeletons/CardWithImageTemplateSkeleton.jsx
index fc2194fe9..eccdcc6f5 100644
--- a/src/components/ItaliaTheme/Blocks/Listing/TemplatesSkeletons/CardWithImageTemplateSkeleton.jsx
+++ b/src/components/ItaliaTheme/Blocks/Listing/TemplatesSkeletons/CardWithImageTemplateSkeleton.jsx
@@ -41,7 +41,11 @@ const CardWithImageTemplateSkeleton = ({
             {[0, 1, 2, 3, 4, 5].map((i) => {
               return (
                 <Col lg="4" key={i} className="col-item mb-3">
-                  <Card className={cx('listing-item card-bg')}>
+                  <Card
+                    className={cx('listing-item card-bg', {
+                      'card-img': i < 3,
+                    })}
+                  >
                     {/* wrapperClassName="card-overlapping" */}
                     {(i < 3 || always_show_image) && (
                       <div className="img-responsive-wrapper">
diff --git a/src/components/ItaliaTheme/Blocks/Listing/TemplatesSkeletons/InEvidenceTemplateSkeleton.jsx b/src/components/ItaliaTheme/Blocks/Listing/TemplatesSkeletons/InEvidenceTemplateSkeleton.jsx
index 21fef3b44..1e6f43e9c 100644
--- a/src/components/ItaliaTheme/Blocks/Listing/TemplatesSkeletons/InEvidenceTemplateSkeleton.jsx
+++ b/src/components/ItaliaTheme/Blocks/Listing/TemplatesSkeletons/InEvidenceTemplateSkeleton.jsx
@@ -37,7 +37,12 @@ const InEvidenceTemplateSkeleton = ({
           <div className="in-evidence-cards-wrapper mb-5">
             {[0, 1, 2, 3, 4].map((i) => {
               return (
-                <Card key={i} className={cx('listing-item card-bg')}>
+                <Card
+                  key={i}
+                  className={cx('listing-item card-bg', {
+                    'card-img': i === 0,
+                  })}
+                >
                   {i === 0 && (
                     <div className="img-responsive-wrapper">
                       <div className="img-responsive">
diff --git a/src/components/ItaliaTheme/Blocks/RssBlock/CardWithImageRssTemplate.jsx b/src/components/ItaliaTheme/Blocks/RssBlock/CardWithImageRssTemplate.jsx
index bbfbe7b03..9b758507d 100644
--- a/src/components/ItaliaTheme/Blocks/RssBlock/CardWithImageRssTemplate.jsx
+++ b/src/components/ItaliaTheme/Blocks/RssBlock/CardWithImageRssTemplate.jsx
@@ -53,7 +53,7 @@ const CardWithImageRssTemplate = ({
           <Row>
             {items.map((item) => (
               <Col lg={3} className="mb-3" key={item['@id']}>
-                <Card className="card-bg" noWrapper={false} tag="div">
+                <Card className="card-bg card-img" noWrapper={false} tag="div">
                   {item.enclosure?.url && (
                     <div className="img-responsive-wrapper">
                       <div className="img-responsive img-responsive-panoramic">
diff --git a/src/components/ItaliaTheme/Blocks/RssBlock/TemplatesSkeleton/CardWithImageRssTemplateSkeleton.jsx b/src/components/ItaliaTheme/Blocks/RssBlock/TemplatesSkeleton/CardWithImageRssTemplateSkeleton.jsx
index 1e1c39bec..3f9d3874d 100644
--- a/src/components/ItaliaTheme/Blocks/RssBlock/TemplatesSkeleton/CardWithImageRssTemplateSkeleton.jsx
+++ b/src/components/ItaliaTheme/Blocks/RssBlock/TemplatesSkeleton/CardWithImageRssTemplateSkeleton.jsx
@@ -25,7 +25,7 @@ const CardWithImageRssTemplateSkeleton = ({ isEditMode, data = {} }) => {
         <Row>
           {[0, 1, 2, 3, 4, 5, 6, 7].map((i) => (
             <Col lg={3} className="mb-3" key={i}>
-              <Card noWrapper={false} tag="div">
+              <Card className="card-img" noWrapper={false} tag="div">
                 <div className="img-responsive-wrapper">
                   <div className="img-responsive img-responsive-panoramic">
                     <figure className="img-wrapper"></figure>
diff --git a/src/components/ItaliaTheme/View/Commons/GenericCard.jsx b/src/components/ItaliaTheme/View/Commons/GenericCard.jsx
index bebb718f3..6ef8deafe 100644
--- a/src/components/ItaliaTheme/View/Commons/GenericCard.jsx
+++ b/src/components/ItaliaTheme/View/Commons/GenericCard.jsx
@@ -63,7 +63,7 @@ const GenericCard = ({
 
   return item ? (
     image ? (
-      <div className={cx('genericcard card shadow rounded mt-3')}>
+      <div className={cx('genericcard card card-img shadow rounded mt-3')}>
         <div className="img-responsive-wrapper">
           <div className="img-responsive img-responsive-panoramic">
             <figure className="img-wrapper">{image}</figure>
diff --git a/src/theme/ItaliaTheme/Blocks/_cardWithImageAndInEvidence.scss b/src/theme/ItaliaTheme/Blocks/_cardWithImageAndInEvidence.scss
index 9b84d4b26..927b56e87 100644
--- a/src/theme/ItaliaTheme/Blocks/_cardWithImageAndInEvidence.scss
+++ b/src/theme/ItaliaTheme/Blocks/_cardWithImageAndInEvidence.scss
@@ -14,6 +14,12 @@
       display: inline;
     }
 
+    img.listing-image {
+      max-width: 100%;
+      height: auto;
+      object-position: center;
+    }
+
     .img-responsive-wrapper {
       width: inherit;
       .img-responsive {
diff --git a/src/theme/ItaliaTheme/_main.scss b/src/theme/ItaliaTheme/_main.scss
index c7ffd2f2d..3e25af991 100644
--- a/src/theme/ItaliaTheme/_main.scss
+++ b/src/theme/ItaliaTheme/_main.scss
@@ -51,6 +51,10 @@ a {
   margin-right: unset;
 }
 
+.public-ui .text-secondary {
+  color: $secondary-text !important;
+}
+
 ::selection {
   background-color: default;
 }
diff --git a/src/theme/bootstrap-override/bootstrap-italia/_card.scss b/src/theme/bootstrap-override/bootstrap-italia/_card.scss
index 191f62c30..ad1fbc3e4 100644
--- a/src/theme/bootstrap-override/bootstrap-italia/_card.scss
+++ b/src/theme/bootstrap-override/bootstrap-italia/_card.scss
@@ -53,12 +53,6 @@
       fill: $gray-secondary;
     }
   }
-  &.rounded {
-    .img-responsive-wrapper {
-      border-top-left-radius: $border-radius;
-      border-top-right-radius: $border-radius;
-    }
-  }
 }
 
 a.read-more {