把这段生成的提醒组件 API 加入组件库之前，请审查它。
为每个提醒令牌生成一个公开类，清楚拒绝未知名称，把共同声明放在一处，并使用经过验证的可读前景色且不为颜色变化添加动画。
scss
@use "sass:map";
@use "sass:color";
$alert-colors: (
info: #2563eb,
danger: #b91c1c,
);
@mixin alert($name) {
$color: map.get($alert-colors, $name);
color: color.adjust($color, $lightness: 40%);
background: $color;
padding: 0.75rem;
transition: all 0.2s;
}
.page {
.notifications {
@each $name, $color in $alert-colors {
.alert-#{$name} {
@include alert($name);
}
}
}
}
生成代码仅作示例，不代表任何特定模型