#39817 issue to add outlined badges

[deepeshagarwal150106]

Description

added outlined badges

Motivation & Context

it improve badge feature

Type of changes

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Refactoring (non-breaking change)
• Breaking change (fix or feature that would change existing functionality)

Checklist

• I have read the contributing guidelines
• My code follows the code style of the project (using npm run lint)
• My change introduces changes to the documentation
• I have updated the documentation accordingly
• I have added tests to cover my changes
• All new and existing tests passed

Live previews

• https://deploy-preview-{your_pr_number}--twbs-bootstrap.netlify.app/

Related issues

Closes #39817 [feature request] outlined badges

[julien-deramond]

Thanks for submitting a PR @deepeshagarwal150106

I'm going to close it as it is for now, too far from what's expected in terms of content.

Please, feel free to create a new one whenever the following points will be tackled:

• A new variant of a component must be documented
• We never use hexadecimal values directly in components Sass files, we rely on other Sass or CSS semantic color variables
• Instead of declaring x times a .badge-outline-* class, a Sass loop should be used from the map that contains the different semantic colors (see other components like this one)