docs(slider): apply a11y guidance

[Splaktar]

• update configurable example to
  • have useful labels and use aria-labelledby
  • have labels that work in horizontal and vertical modes
• add aria-label to other examples
• add step to formatting example

Fixes #7933

Images of new labels

This layout was inspired by the example in the spec: https://material.io/components/sliders#theming.

Previous screen reader output

1. 0 , slider
2. 1 , slider
3. 50 , slider
4. 0 , slider

New screen reader output

1. 0 , Max Value, slider
2. 0 , units, slider
3. 50 , unit(s), slider
4. 0 , unit(s), slider

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}