Add visually-hidden class

[JeffersonBledsoe]

This PR adds a visually-hidden class which is useful in situations where you want to provide additional information to Assistive Technology and an aria-label may not be appropriate.

Questions

• Should this be 'CMS' only? Or should we provide this utility class for users of the Volto view-mode to rely on too.

Todo

• Add to @plone/components
• Rename to sr-only
• Documentation!

[netlify]

✅ Deploy Preview for plone-components canceled.

Name	Link
🔨 Latest commit	f9c67ee
🔍 Latest deploy log	https://app.netlify.com/sites/plone-components/deploys/67208980082b3400082d9915

[ichim-david]

there might be something from semantic already for visually hidden

[sneridagh]

@JeffersonBledsoe @ichim-david if we do this, we need that also in @plone/components (for now) to have it also in the future theming.

[sneridagh]

@JeffersonBledsoe it seems you pushed more changes than the needed in this PR. Can you take a look, please? you deleted things and files, that we cannot remove.

[ichim-david]

@sneridagh @JeffersonBledsoe I've taken a deeper look and it seems that bootstrap 5 renamed sr-only to visually-hidden.
barceloneta is now based on bootstrap 5 as I see
https://getbootstrap.com/docs/5.3/migration/#helpers-2
https://github.com/plone/plonetheme.barceloneta/tree/master/scss
If we stick to the visually-hidden class, we have the same class name in both systems.

This is such a standard nowadays that I doubt that it could lead to class conflicts on account of modifying such class.
As such I don't think we need to rename it to sr-only unless @sneridagh you have another opinion.

[Wagner3UB]

@plone/volto-accessibility I'll try to run some tests within our theme to see if I can find any conflicts.

[ichim-david]

I think this is fine from my point of view, waiting also for @Wagner3UB review if there would be any conflict with the bootstrap theme