Fix misused aria-label on mobile card table

[bethcollins92]

Done

• Updated aria-label to data-heading
• Updated docs to reflect change

Fixes
#4131

QA

• Open demo
• Turn voice over on while reviewing the table, ensure the content of the cells is read out not just the title. Currently the title is read out twice, not sure how to fix this, I tried to use content: attr(data-heading) / ' '; but this hides the title both times.
• Review updated documentation:
  • /docs/base/tables#responsive

Check if PR is ready for release

If this PR contains Vanilla SCSS code changes, it should contain the following changes to make sure it's ready for the release:

• PR should have one of the following labels to automatically categorise it in release notes:
  • Feature 🎁, Breaking Change 💣, Bug 🐛, Documentation 📝, Maintenance 🔨.
• Vanilla version in package.json should be updated relative to the most recent release, following semver convention:
  • if CSS class names are not changed it can be bugfix relesase (x.x.X)
  • if CSS class names are changed/added/removed it should be minor version (x.X.0)
  • see the wiki for more details
• Any changes to component class names (new patterns, variants, removed or added features) should be listed on the what's new page.
• Documentation side navigation should be updated with the relevant labels.

[webteam-app]

Demo starting at https://vanilla-framework-4179.demos.haus

[bartaz]

@bethcollins92 thanks! Add this to upgrade guide as well, this is a significant breaking change that devs will need to carefully upgrade.

[anthonydillon]

LGTM 👍 did you want to put an a11y label on this PR?

[bethcollins92]

@bartaz Added - could you proof read it please?