fix: source moved after title

RedTurtle · Nov 2, 2023 · 18e3c6d · 18e3c6d
1 parent 35c1a9d
commit 18e3c6d
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 12 deletions.
diff --git a/src/components/ItaliaTheme/Blocks/RssBlock/CardWithImageRssTemplate.jsx b/src/components/ItaliaTheme/Blocks/RssBlock/CardWithImageRssTemplate.jsx
@@ -68,12 +68,6 @@ const CardWithImageRssTemplate = ({
                   )}
                   <CardBody tag="div">
                     <div className="category-top">
-                      {item?.source?.length > 0 && (
-                        <>
-                          <span className="category">{item.source}</span>
-                          <span className="mx-1">&mdash;</span>
-                        </>
-                      )}
                       {item?.categories?.length > 0 && item.categories[0]._ && (
                         <>
                           <span className="category">
@@ -89,6 +83,11 @@ const CardWithImageRssTemplate = ({
                     <CardTitle className="big-heading" tag="h6">
                       {item.title}
                     </CardTitle>
+                    <div className="source-title">
+                      {item?.source?.length > 0 && (
+                        <span className="source">{item.source}</span>
+                      )}
+                    </div>
                   </CardBody>
                   <CardReadMore
                     iconName="it-arrow-right"

diff --git a/src/components/ItaliaTheme/Blocks/RssBlock/CardWithoutImageRssTemplate.jsx b/src/components/ItaliaTheme/Blocks/RssBlock/CardWithoutImageRssTemplate.jsx
@@ -53,12 +53,6 @@ const CardWithoutImageRssTemplate = ({
                 <Card noWrapper={false} tag="div">
                   <CardBody tag="div">
                     <div className="category-top">
-                      {item?.source?.length > 0 && (
-                        <>
-                          <span className="category">{item.source}</span>
-                          <span className="mx-1">&mdash;</span>
-                        </>
-                      )}
                       {item?.categories?.length > 0 && item.categories[0]._ && (
                         <>
                           <span className="category">
@@ -76,6 +70,11 @@ const CardWithoutImageRssTemplate = ({
                     <CardTitle className="big-heading" tag="h5">
                       {item.title}
                     </CardTitle>
+                    <div className="source-title">
+                      {item?.source?.length > 0 && (
+                        <span className="source">{item.source}</span>
+                      )}
+                    </div>
                     <CardText tag="p" className="text-serif">
                       {item.contentSnippet}
                     </CardText>

diff --git a/theme/ItaliaTheme/Blocks/_rssBlock.scss b/theme/ItaliaTheme/Blocks/_rssBlock.scss
@@ -1,3 +1,20 @@
+.rssBlock {
+  .card {
+    .card-body {
+      .source-title {
+        font-size: $card-category-size;
+        text-transform: uppercase;
+        color: $card-p-color;
+        margin-bottom: $card-category-m-bottom;
+        .source {
+          font-weight: bold;
+          letter-spacing: $card-category-l-spacing;
+        }
+      }
+    }
+  }
+}
+
 #text-body {
   .rssBlock {
     .row > * {