From 22191cc67d586d239611a01cb3d798dce2c4e4d1 Mon Sep 17 00:00:00 2001
From: philip-ellis-sp <philip.ellis@sailpoint.com>
Date: Tue, 23 May 2023 13:58:49 -0500
Subject: [PATCH] updated to use react looping for blog card generation

---
 .../blog/BlogCard/styles.module.css           |  4 +-
 src/components/blog/BlogCards/index.js        | 53 ++++---------------
 2 files changed, 12 insertions(+), 45 deletions(-)

diff --git a/src/components/blog/BlogCard/styles.module.css b/src/components/blog/BlogCard/styles.module.css
index 51d607b86..3a69e114a 100644
--- a/src/components/blog/BlogCard/styles.module.css
+++ b/src/components/blog/BlogCard/styles.module.css
@@ -69,6 +69,6 @@
   bottom: 10px;
   left: 10px;
   margin: auto;
-  height: 80px;
-  width: 80px;
+  height: 40px;
+  width: 40px;
 }
\ No newline at end of file
diff --git a/src/components/blog/BlogCards/index.js b/src/components/blog/BlogCards/index.js
index e3340f87c..e608181c3 100644
--- a/src/components/blog/BlogCards/index.js
+++ b/src/components/blog/BlogCards/index.js
@@ -23,50 +23,17 @@ export default function BlogCards() {
   if (ans) {
     return (
       <div className={styles.center}>
-
         <div className={styles.gridContainer}>
-          <BlogCard
-            excerpt={ans[0].excerpt}
-            name={ans[0].name}
-            tags={ans[0].tags}
-            link={ans[0].link}
-            title={ans[0].title}
-            image={ans[0].image}></BlogCard>
-          <BlogCard
-            excerpt={ans[1].excerpt}
-            name={ans[1].name}
-            tags={ans[1].tags}
-            link={ans[1].link}
-            title={ans[1].title}
-            image={ans[1].image}></BlogCard>
-          <BlogCard
-            excerpt={ans[0].excerpt}
-            name={ans[0].name}
-            tags={ans[0].tags}
-            link={ans[0].link}
-            title={ans[0].title}
-            image={ans[0].image}></BlogCard>
-          <BlogCard
-            excerpt={ans[1].excerpt}
-            name={ans[1].name}
-            tags={ans[1].tags}
-            link={ans[1].link}
-            title={ans[1].title}
-            image={ans[1].image}></BlogCard>
-          <BlogCard
-            excerpt={ans[0].excerpt}
-            name={ans[0].name}
-            tags={ans[0].tags}
-            link={ans[0].link}
-            title={ans[0].title}
-            image={ans[0].image}></BlogCard>
-          <BlogCard
-            excerpt={ans[1].excerpt}
-            name={ans[1].name}
-            tags={ans[1].tags}
-            link={ans[1].link}
-            title={ans[1].title}
-            image={ans[1].image}></BlogCard>
+
+          {ans.map(function(a, index){
+            return <BlogCard
+            excerpt={a.excerpt}
+            name={a.name}
+            tags={a.tags}
+            link={a.link}
+            title={a.title}
+            image={a.image}></BlogCard>
+          })}
         </div>
       </div>
     );