diff --git a/packages/css/src/components/alert/alert.scss b/packages/css/src/components/alert/alert.scss index 52a0e0a817..12316c6485 100644 --- a/packages/css/src/components/alert/alert.scss +++ b/packages/css/src/components/alert/alert.scss @@ -5,6 +5,7 @@ .ams-alert { align-items: flex-start; + background-color: var(--ams-alert-background-color); border-style: var(--ams-alert-border-style); border-width: var(--ams-alert-border-width); display: flex; @@ -23,21 +24,17 @@ } .ams-alert--error { - background-color: var(--ams-alert-error-background-color); border-color: var(--ams-alert-error-border-color); } .ams-alert--info { - background-color: var(--ams-alert-info-background-color); border-color: var(--ams-alert-info-border-color); } .ams-alert--success { - background-color: var(--ams-alert-success-background-color); border-color: var(--ams-alert-success-border-color); } .ams-alert--warning { - background-color: var(--ams-alert-warning-background-color); border-color: var(--ams-alert-warning-border-color); } diff --git a/packages/react/src/Alert/Alert.tsx b/packages/react/src/Alert/Alert.tsx index d3d4357f07..fddfb9841d 100644 --- a/packages/react/src/Alert/Alert.tsx +++ b/packages/react/src/Alert/Alert.tsx @@ -68,7 +68,7 @@ export const Alert = forwardRef( )} {children} - {closeable && } + {closeable && } ) }, diff --git a/proprietary/tokens/src/components/ams/alert.tokens.json b/proprietary/tokens/src/components/ams/alert.tokens.json index 3d0c670451..d7857e68f1 100644 --- a/proprietary/tokens/src/components/ams/alert.tokens.json +++ b/proprietary/tokens/src/components/ams/alert.tokens.json @@ -1,25 +1,22 @@ { "ams": { "alert": { + "background-color": { "value": "{ams.brand.color.neutral.0}" }, "border-width": { "value": "{ams.border.width.xl}" }, "border-style": { "value": "solid" }, "gap": { "value": "{ams.space.sm}" }, "padding-block": { "value": "{ams.space.md}" }, "padding-inline": { "value": "{ams.space.lg}" }, "error": { - "background-color": { "value": "{ams.brand.color.red.20}" }, "border-color": { "value": "{ams.brand.color.red.60}" } }, "info": { - "background-color": { "value": "{ams.brand.color.azure.20}" }, "border-color": { "value": "{ams.brand.color.azure.60}" } }, "success": { - "background-color": { "value": "{ams.brand.color.green.20}" }, "border-color": { "value": "{ams.brand.color.green.60}" } }, "warning": { - "background-color": { "value": "{ams.brand.color.orange.20}" }, "border-color": { "value": "{ams.brand.color.orange.60}" } }, "content": {