Components

Definition tooltips

Sometimes domain specific terminology is unavoidable because it's the most accurate way to describe a concept. These tooltips can be used to help bridge that gap without sending the user outward to help.

Quick look

The only thing you need to keep in mind when using this pattern is to do so sparingly. It should not be used as an excuse to fill up an application with jargon, but rather, to supplement already excellent UX and well written documentation.

Try it out

"Everything in this man’s manner revealed a calm and temperament. There was nothing indolent about him, but his appearance spoke of tranquility. He was one of those who never seemed to expect anything from anybody, who liked to work when he thought proper, and whose philosophy nothing could astonish or trouble."

Code samples

<p>"Everything in this man’s manner revealed a calm and<span class="dqpl-definition-button-wrap">
    <button class="dqpl-button-definition" data-help-text="Self-possessed, calm, or composed.">phlegmatic</button>
    <div class="dqpl-inline">temperament. There was nothing indolent about him, but his appearance spoke of tranquillity. He was one of those who never seemed to expect anything from anybody, who liked to work when he thought proper, and whose philosophy nothing could astonish or trouble."</div></span></p>

For more information on implementation read thewiki.