Skip to content

Replace GlDeprecatedBadge with GlBadge in ee/app/assets/javascripts/feature_flags/components/form.vue

Instructions

  • Replace each instance of GlDeprecatedBadge with GlBadge.
  • Convert each variant attribute to the new variant using the variant mapping guide.
  • Remove any pill prop.
  • Take before/after screenshots of each button in the file, and upload them in the Merge Request description.
  • Request review from the UX DRI for the relevant stage/group.

Variant mapping guide

  • primary -> info
  • secondary -> neutral
  • light -> muted
  • dark -> neutral

Examples

In script sections

- import { GlDeprecatedBadge as GlBadge } from '@gitlab/ui';
+ import { GlBadge } from '@gitlab/ui';

In template sections

- <gl-badge variant="light" />
+ <gl-badge variant="muted" />
- <gl-badge variant="primary" />
+ <gl-badge variant="info" />
- <gl-badge pill />
+ <gl-badge />
- <gl-badge variant="dark" pill />
+ <gl-badge variant="neutral" />
Edited by Mark Florian