From fbdee01ba47cb9da967f536aae9e36b6de088f08 Mon Sep 17 00:00:00 2001
From: Klink <85062+dogmar@users.noreply.github.com>
Date: Fri, 6 Oct 2023 15:57:53 -0700
Subject: [PATCH] fix: Callout buttons rendered as links had incorrect styles
 (#522)

---
 src/components/Callout.tsx      | 8 +++++---
 src/stories/Callout.stories.tsx | 4 ++--
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/components/Callout.tsx b/src/components/Callout.tsx
index aa805249..4119a33b 100644
--- a/src/components/Callout.tsx
+++ b/src/components/Callout.tsx
@@ -309,6 +309,11 @@ const CalloutSC = styled.div<{
   '.children *:last-child': {
     marginBottom: '0',
   },
+  '.children': {
+    '& a, & a:any-link': {
+      ...theme.partials.text.inlineLink,
+    },
+  },
   '.buttonArea': {
     display: 'flex',
     gap: theme.spacing.xsmall,
@@ -350,9 +355,6 @@ const CalloutSC = styled.div<{
     width: 0,
     height: 0,
   },
-  '& a, & a:any-link': {
-    ...theme.partials.text.inlineLink,
-  },
   '.expandIcon': {
     ...theme.partials.dropdown.arrowTransition({ isOpen: $expanded }),
   },
diff --git a/src/stories/Callout.stories.tsx b/src/stories/Callout.stories.tsx
index d3a4cc70..13757bb9 100644
--- a/src/stories/Callout.stories.tsx
+++ b/src/stories/Callout.stories.tsx
@@ -117,7 +117,7 @@ function ExpandableTemplate({
           key={style}
           severity={style}
           title={title}
-          buttonProps={{ children: 'Learn more' }}
+          buttonProps={{ children: 'Learn more', as: 'a' }}
           expandable
           defaultExpanded
           expanded={controlled ? expanded[i] : undefined}
@@ -156,7 +156,7 @@ function CloseableTemplate({ title }: CalloutProps) {
           key={style}
           severity={style}
           title={title}
-          buttonProps={{ children: 'Learn more' }}
+          buttonProps={{ children: 'Learn more', as: 'a' }}
           closeable
           closed={closed}
           onClose={setClosed}