Apply .text-dark for .badge with some .bg-* classes

Created by: theonlypwner

In Bootstrap 4, class="badge badge-light" was enough, but in Bootstrap 5, it's class="badge bg-light text-dark". This is less convenient when switching between badge bg-dark and badge bg-light, since text-dark also has to be added or removed.

Bootstrap 5 should apply the styles for text-dark to .badge.bg-light and .badge.bg-warning. The Bootstrap 5 docs also recommend text-dark for bg-info, but I find that one is not necessary.

One workaround is to add this to our SCSS files, which is what Bootswatch does:

@import "~bootstrap/scss/bootstrap";

.badge {
  &.bg-warning,
  &.bg-info, /* optional */
  &.bg-light {
    @extend .text-dark;
  }
}