diff --git a/js/src/admin/components/EditGroupModal.js b/js/src/admin/components/EditGroupModal.js index 70d3c65fd8..129af73a91 100644 --- a/js/src/admin/components/EditGroupModal.js +++ b/js/src/admin/components/EditGroupModal.js @@ -32,7 +32,7 @@ export default class EditGroupModal extends Modal { this.color() || this.icon() ? Badge.component({ icon: this.icon(), - style: { backgroundColor: this.color() }, + color: this.color(), }) : '', ' ', diff --git a/js/src/common/components/Badge.js b/js/src/common/components/Badge.js index 885f69d7ff..39f63e16b1 100644 --- a/js/src/common/components/Badge.js +++ b/js/src/common/components/Badge.js @@ -18,15 +18,18 @@ import classList from '../utils/classList'; */ export default class Badge extends Component { view() { - const { type, icon: iconName, label, ...attrs } = this.attrs; + const { type, icon: iconName, label, color, style = {}, ...attrs } = this.attrs; const className = classList('Badge', [type && `Badge--${type}`], attrs.className); const iconChild = iconName ? icon(iconName, { className: 'Badge-icon' }) : m.trust(' '); + const newStyle = { ...style, '--badge-bg': color }; + const badgeAttrs = { ...attrs, className, + style: newStyle, }; const badgeNode =