<div class="new-and-total-badge">
  <span class="new-items"
        data-tooltip
        data-bind='{"title":"unreadText", "text":"unreadCount"}'
        title="<%= t('unread_count_tooltip', { 
                     :zero => 'No unread replies',
                     :one => '1 unread reply',
                     :other => '%{count} unread replies'
                    }, :count => unread_count) %>"><%= unread_count if unread_count > 0 %></span>
  <span class="total-items"
        data-tooltip
        title="<%= t('reply_count_tooltip', {
                     :zero => 'No replies',
                     :one => '1 reply',
                     :other => '%{count} replies'
                    }, :count => reply_count) %>"><%= reply_count if reply_count > 0 %></span>
</div>

<div class="new-and-total-badge">
  <span class="new-items"
        aria-hidden="true"
        data-tooltip
        data-bind='{"title":"unreadText", "text":"unreadCount"}'
        title="<%= t('unread_count_tooltip', { 
                     :zero => 'No unread replies.',
                     :one => '1 unread reply.',
                     :other => '%{count} unread replies.'
                    }, :count => unread_count) %>"><%= unread_count if unread_count > 0 %></span>
  <span class="screenreader-only"
        data-bind='{"text":"unreadText"}'>
    <%= t('unread_count_tooltip', { 
           :zero => 'No unread replies.',
           :one => '1 unread reply.',
           :other => '%{count} unread replies.'
          }, :count => unread_count) %>
  </span>
  <span class="total-items"
        aria-hidden="true"
        data-tooltip
        title="<%= t('reply_count_tooltip', {
                     :zero => 'No replies.',
                     :one => '1 reply.',
                     :other => '%{count} replies.'
                    }, :count => reply_count) %>"><%= reply_count if reply_count > 0 %></span>
  <span class="screenreader-only">
    <%= t('reply_count_tooltip', {
           :zero => 'No replies.',
           :one => '1 reply.',
           :other => '%{count} replies.'
          }, :count => reply_count) %>
  </span>
</div>

Make Screen Readers read the number of replies and unread replies
Discussions: Make Screen Readers read the number of replies and unread replies

Fixes CNVS-11719

Test plan:
* Using a screen reader, visit a discussion page, with and without replies,
  and with and without unread replies.
* Verify that the number of replies and number of unread replies are read,
  with context (I.E. text that says what the numbers refer to).

Change-Id: Iab57637c162fec04ca3fcb3c1681e42955ec384a
Reviewed-on: https://gerrit.instructure.com/31875
Tested-by: Jenkins <d95b56ce41a2e1ac4cecdd398defd7414407cc08@instructure.com>
QA-Review: Matt Fairbourn <5f353e1c97bb9cc046b9db20beca0b9392f6f1b2@instructure.com>
Product-Review: Aaron Cannon <25919c673621c006b735dcd5a28df63325948e2b@instructure.com>
Reviewed-by: Joel Hough <4816dabf8db1bc6cac35b3a24cab2ff844b5b0c7@instructure.com>
