Tabs > badge counter should use SR only

Problem

The counter badge in a tab is announced, however it lacks context for what the number means and could be read simply as part of the tab label.

Solution

• The counter badge should use the SR only pattern from https://gitlab-org.gitlab.io/gitlab-ui/?path=/story/base-button--badge-with-sr-only-text to provide context to the count.
• This property could be added with a counter component to keep it straightforward (see discussion below for details).

For example:

<span class="badge gl-tab-counter-badge badge-muted badge-pill gl-badge sm">250<span class="sr-only"> items</span></span>