Tooltip

Tooltips are icons that display text when they are hovered over in desktop or clicked on on mobile devices. Tooltips are primarily used to provide help text to clarify directions or add additional information.

In LiteFarm tooltips are displayed using the ℹ️ symbol. The tooltip is displayed with a background of gray-400 and with 16px of padding around the text. The text box will always be 224px wide, unless otherwise specified.

 

Tooltips can be tied to questions, text input fields, or radio buttons/checkboxes and displayed as follows in those different instances.

 

Questions

The tooltip icon will appear directly following a question.

 

 

Text Input Fileds

The tooptip will appear to on the top right side of the text field.

 

 

Radio buttons/Checkboxes

The tooltip will appear to the right of the selection option.