[NOREF] Tweak style for CalendarDate (#1279)

* Tweak style for CalendarDate * Added abbreviation to model name
CMS-Enterprise · Aug 5, 2024 · 8a2c26b · 8a2c26b
1 parent d4252c4
commit 8a2c26b
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 4 deletions.
diff --git a/src/components/CalendarDate/index.tsx b/src/components/CalendarDate/index.tsx
@@ -38,9 +38,13 @@ const CalendarDate = ({
           </span>
         </time>
       </div>
-      <UswdsReactLink to={link} className="display-flex flex-align-center">
-        <h4 className="usa-collection__heading">{linkText}</h4>
-        <Icon.ArrowForward />
+      <UswdsReactLink to={link}>
+        <span>
+          <h4 className="usa-collection__heading display-inline margin-right-1">
+            {linkText}
+          </h4>
+          <Icon.ArrowForward className="top-3px" />
+        </span>
       </UswdsReactLink>
     </div>
   );

diff --git a/src/stylesheets/custom.scss b/src/stylesheets/custom.scss
@@ -184,3 +184,7 @@
 .z-400 {
   z-index: 400 !important;
 }
+
+.top-3px {
+  top: 3px !important;
+}
diff --git a/src/views/Home/components/ModelsApproachingClearance/index.tsx b/src/views/Home/components/ModelsApproachingClearance/index.tsx
@@ -80,7 +80,9 @@ const ModelsApproachingClearance = () => {
                       <CalendarDate
                         dateISO={model.basics.clearanceStarts}
                         link={`/models/${model.id}/read-view`}
-                        linkText={model.modelName}
+                        linkText={`${model.modelName}${
+                          model.abbreviation ? ` (${model.abbreviation})` : ''
+                        }`}
                       />
                     </Card>
                   ))}