diff --git a/src/Alert/Alert.jsx b/src/Alert/Alert.jsx
index 0e043b0a..aba8499f 100644
--- a/src/Alert/Alert.jsx
+++ b/src/Alert/Alert.jsx
@@ -17,7 +17,6 @@ import classNames from 'classnames';
export const MessageTypes = {
SUCCESS: 'success',
INFO: 'info',
- ANNOUNCEMENT: 'announcement',
FEATURE: 'feature',
WARNING: 'warning',
ERROR: 'error',
@@ -39,8 +38,6 @@ const getAlertIcon = (type) => {
);
- case MessageTypes.ANNOUNCEMENT:
- return ();
case MessageTypes.FEATURE:
return ();
case MessageTypes.WARNING:
diff --git a/src/Alert/Alert.mdx b/src/Alert/Alert.mdx
index 6e0fda4f..494668ad 100644
--- a/src/Alert/Alert.mdx
+++ b/src/Alert/Alert.mdx
@@ -36,7 +36,6 @@ page and are not affected by an event.
### Feature
- Use when showcasing a new feature to a user.
-- NOTE: use this variant instead of the Announcement variant (this will be deprecated soon)
diff --git a/src/Alert/Alert.scss b/src/Alert/Alert.scss
index d5959ae3..25b2fe73 100644
--- a/src/Alert/Alert.scss
+++ b/src/Alert/Alert.scss
@@ -129,18 +129,6 @@
}
}
- .Alert-announcement {
- border-left: 8px solid $synth-hyperlink-color;
-
- .close {
- @include close-action;
- }
-
- .primary-action {
- @include primary-action;
- }
- }
-
.Alert-feature {
border: 2px solid $ux-teal-600;
@@ -294,20 +282,6 @@
}
}
-.Alert-announcement {
- background-color: $ux-blue-100;
- color: $ux-blue-700;
- border-left: 8px solid $ux-blue-300;
-
- .close {
- @include close-action;
- }
-
- .primary-action {
- @include primary-action;
- }
-}
-
.Alert-feature {
background-color: $ux-teal-100;
color: $ux-teal-800;