Add aria-describedby support

[SrMouraSilva]

https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-describedby_attribute

The aria-describedby attribute is used to indicate the IDs of the elements that describe the object. It is used to establish a relationship between widgets or groups and text that described them. This is very similar to aria-labelledby: a label describes the essence of an object, while a description provides more information that the user might need.

[cheshrkat]

Not sure if labelled-by will work here as the implementation uses generated content. Labelled by works for tooltips which have a separate DOM element (http://accessibility.athena-ict.com/aria/examples/tooltip.shtml) but I don't think generated content can be associated that way (I could be wrong though! :)).

This implementation would work if it was based on aria-label rather than the custom data attr; or included the same text string in aria-label as the custom data attribute. To see it in action the examples need tabindex="0" (so you can tab to them with the keyboard); and the styles will need to show for focus as well as hover (which is mouse-only). http://codepen.io/jacmaes/pen/sDiof has a similar proof of concept.

Putting it together in the HTML:
<span aria-label="This is a tooltip!" data-wenk="This is a tooltip!" tabindex="0"></span>

Then in, say, wenk.scss change &:hover on line 36 to &:focus, &:hover, &:active

To test visibly: hit tab until the system focus moves to the element with the tooltip; your tooltip should show.

[tiaanduplessis]

@cheshrkat sounds good 👍. Will take a look as soon as I have time