Description

Use the good variables.
Remove some duplicate selectors inside the loop.
Tweak a bit the color used by each variable.

Rollback the :active state for the .list-group-item-action. Not sure about this one but I felt weird using this. I wasn't sure it was done on purpose, so I tried something. Let me know if you want me to change the color as it is right now in Bootstrap.

Motivation & Context

Have a consistent .active state.
Have some used code.

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-37888--twbs-bootstrap.netlify.app/docs/5.3/components/list-group#variants

Related issues

NA