From 49e72e77dc32c39566002880681c530f3bb19bdc Mon Sep 17 00:00:00 2001
From: Max Morgan <maxwell.morgan@detroitmi.gov>
Date: Mon, 17 Jun 2024 15:46:35 -0400
Subject: [PATCH] Update styles given feedback

---
 src/components/organisms/ArticleCard/ArticleCard.css | 9 ++++++---
 src/stories/articlecard.stories.js                   | 8 ++++----
 2 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/src/components/organisms/ArticleCard/ArticleCard.css b/src/components/organisms/ArticleCard/ArticleCard.css
index a6afbb82..e2b521d7 100644
--- a/src/components/organisms/ArticleCard/ArticleCard.css
+++ b/src/components/organisms/ArticleCard/ArticleCard.css
@@ -12,9 +12,12 @@
 .text-container {
   position: absolute;
   box-sizing: border-box;
-  padding: 0.5em;
+  padding-top: 0.5em;
+  padding-bottom: 0.5em;
+  padding-left: 1em;
+  padding-right: 1em;
   width: 100%;
-  height: 20%;
+  height: 40%;
   bottom: 0;
   left: 0;
   transition:
@@ -25,7 +28,7 @@
 .card-container:hover .text-container {
   box-sizing: border-box;
   height: 100%;
-  padding-top: 40%;
+  padding-top: 30%;
 }
 
 .subtitle-container {
diff --git a/src/stories/articlecard.stories.js b/src/stories/articlecard.stories.js
index 2d989d64..de030a95 100644
--- a/src/stories/articlecard.stories.js
+++ b/src/stories/articlecard.stories.js
@@ -30,9 +30,9 @@ export default {
   args: {
     src: 'https://placehold.co/300x400',
     title:
-      '<h3 class="text-center text-light" style="text-transform: uppercase; font-weight: 900;">The Great Money Transfer</h3>',
+      '<h2 class="text-center text-light" style="text-transform: uppercase; font-weight: 900; font-size: 42px;">The Great Money Transfer</h2>',
     subTitle:
-      '<h5 class="text-center text-success" style="text-transform: uppercase; font-weight: 900;">The Power of Generational Wealth</h4>',
+      '<h3 class="text-center text-success" style="text-transform: uppercase; font-weight: 700; font-size: 26px; line-height: 116%;">The Power of Generational Wealth</h3>',
     color: 'primary',
     href: 'https://www.example.com',
     target: '_blank',
@@ -62,7 +62,7 @@ function _createArticleCard(args) {
     title.slot = 'title';
     articleCardElt1.appendChild(title);
   } else {
-    const title = document.createElement('h3');
+    const title = document.createElement('h2');
     title.innerText = args.title;
     title.classList.add('text-center');
     title.slot = 'title';
@@ -74,7 +74,7 @@ function _createArticleCard(args) {
     subTitle.slot = 'subtitle';
     articleCardElt1.appendChild(subTitle);
   } else {
-    const subTitle = document.createElement('h4');
+    const subTitle = document.createElement('h3');
     subTitle.innerText = args.subTitle;
     subTitle.classList.add('text-center');
     subTitle.slot = 'subtitle';