Tornado | Tooltips
Tooltips is a good way to make a declaration or show up a hint or small description for some element.
Sass Customize
in order to edit the Tooltips you can use the css class's to overide the theme or you can edit it with sass Tornado Folder/SCSS/assets/_utilities.scss and do not forget to compile the main files of the framework Tornado Folder/SCSS/tornado.scss and tornado-rtl.scss.
Tooltips
in order to use the tooltip you can easily by give your element class name tooltip then add a data-title attribute with your tip/hint text in it for an example Hover Me and see the code below.
<a href="#" class="tooltip" data-title="Default Tooltip Example">Hover Me</a>
Tooltip Positions
you can change the position of a tooltip by changing the class to tooltip-position here is example of the 4 positions Default Position and Bottom Position and Start Position and End Position
<span class="tooltip" data-title="Default Position">Default</span>
<span class="tooltip-bottom" data-title="Bottom Position">Bottom</span>
<span class="tooltip-start" data-title="Direction Start Position">Start</span>
<span class="tooltip-end" data-title="Direction End Position">End</span>
Tooltip Responsive
for a responsive position of tooltip and avoid overflow elements you can do that by adding class name tooltip-responsive and it works like that if you have a default positioned tooltip and the element is closer to the top edge of the window will change the position to bottom position tooltip and the same thing applyed to any other position.