From e2b640f4bbb26d80b5441e33addffd22d2c90e98 Mon Sep 17 00:00:00 2001
From: KateMacdonald <ktmacdonald@westpac.com.au>
Date: Thu, 19 Sep 2024 11:01:02 +1000
Subject: [PATCH 1/3] Update src/content/design-system/components/alert

---
 .../alert/design/alert-text/content.mdoc      | 23 +++++++++++++++++++
 1 file changed, 23 insertions(+)

diff --git a/apps/site/src/content/design-system/components/alert/design/alert-text/content.mdoc b/apps/site/src/content/design-system/components/alert/design/alert-text/content.mdoc
index ee8f7ed9b..b04e9341c 100644
--- a/apps/site/src/content/design-system/components/alert/design/alert-text/content.mdoc
+++ b/apps/site/src/content/design-system/components/alert/design/alert-text/content.mdoc
@@ -1,3 +1,5 @@
+### Styles
+
 Alert text comes in four different styles and is configurable to allow for simple styling, eg links, bold and italics. It must be used with the defaulted icon to comply with accessibility guidelines, as per Alert boxes. Definitions and usage examples for each style are provided further down the page.
 
 ```jsx
@@ -20,3 +22,24 @@ Alert text comes in four different styles and is configurable to allow for simpl
   </Alert>
 </div>
 ```
+
+### Icon sizes
+
+The icon that accompanies Alert text has three size options, Md-24px, Sm-18px and Xs-12px.
+
+```jsx
+<div>
+     <ComponentTitle>Medium</ComponentTitle>
+      <Alert look="info" iconSize="medium" mode="text">
+        <strong>Medium</strong> This alert has a medium icon. <a href="#">Link</a>
+      </Alert>
+      <ComponentTitle>Small</ComponentTitle>
+      <Alert look="info" iconSize="small" mode="text">
+        <strong>Small</strong> This alert has a small icon. <a href="#">Link</a>
+      </Alert>
+      <ComponentTitle>Extra Small</ComponentTitle>
+      <Alert look="info" iconSize="xsmall" mode="text">
+        <strong>Extra Small</strong> This alert has an extra small icon. <a href="#">Link</a>
+      </Alert>
+</div>
+```

From c0aaae7a65d3d9ebf2b584712fb3b2ee4211d37a Mon Sep 17 00:00:00 2001
From: KateMacdonald <ktmacdonald@westpac.com.au>
Date: Thu, 19 Sep 2024 11:03:43 +1000
Subject: [PATCH 2/3] Update src/content/design-system/components/alert

---
 .../components/alert/design/alert-text/content.mdoc         | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/apps/site/src/content/design-system/components/alert/design/alert-text/content.mdoc b/apps/site/src/content/design-system/components/alert/design/alert-text/content.mdoc
index b04e9341c..bae7c4229 100644
--- a/apps/site/src/content/design-system/components/alert/design/alert-text/content.mdoc
+++ b/apps/site/src/content/design-system/components/alert/design/alert-text/content.mdoc
@@ -31,15 +31,15 @@ The icon that accompanies Alert text has three size options, Md-24px, Sm-18px an
 <div>
      <ComponentTitle>Medium</ComponentTitle>
       <Alert look="info" iconSize="medium" mode="text">
-        <strong>Medium</strong> This alert has a medium icon. <a href="#">Link</a>
+        This alert has a <strong>Medium</strong> icon.
       </Alert>
       <ComponentTitle>Small</ComponentTitle>
       <Alert look="info" iconSize="small" mode="text">
-        <strong>Small</strong> This alert has a small icon. <a href="#">Link</a>
+        This alert has a <strong>Small</strong> icon.
       </Alert>
       <ComponentTitle>Extra Small</ComponentTitle>
       <Alert look="info" iconSize="xsmall" mode="text">
-        <strong>Extra Small</strong> This alert has an extra small icon. <a href="#">Link</a>
+       This alert has an <strong>Extra Small</strong> icon.
       </Alert>
 </div>
 ```

From 55a2c180e83c9e36e9daf1180651a3b8cebbf8db Mon Sep 17 00:00:00 2001
From: KateMacdonald <ktmacdonald@westpac.com.au>
Date: Thu, 19 Sep 2024 11:05:11 +1000
Subject: [PATCH 3/3] Update src/content/design-system/components/alert

---
 .../code/development-examples/content.mdoc    | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)

diff --git a/apps/site/src/content/design-system/components/alert/code/development-examples/content.mdoc b/apps/site/src/content/design-system/components/alert/code/development-examples/content.mdoc
index cf2720b59..cab4267e7 100644
--- a/apps/site/src/content/design-system/components/alert/code/development-examples/content.mdoc
+++ b/apps/site/src/content/design-system/components/alert/code/development-examples/content.mdoc
@@ -39,3 +39,22 @@
   <strong>Heads up!</strong> This alert needs your attention, but it’s not super important. <a href="#">Link</a>
 </Alert>
 ```
+
+### Icon sizes
+
+```jsx
+<div>
+     <ComponentTitle>Medium</ComponentTitle>
+      <Alert look="info" iconSize="medium" mode="text">
+        This alert has a <strong>Medium</strong> icon.
+      </Alert>
+      <ComponentTitle>Small</ComponentTitle>
+      <Alert look="info" iconSize="small" mode="text">
+        This alert has a <strong>Small</strong> icon.
+      </Alert>
+      <ComponentTitle>Extra Small</ComponentTitle>
+      <Alert look="info" iconSize="xsmall" mode="text">
+       This alert has an <strong>Extra Small</strong> icon.
+      </Alert>
+</div>
+```