Inline Tooltips

:information_source: Summary Provides a button in the Discourse Composer toolbar to add Inline Tooltips within posts.
:eyeglasses: Preview discourse-inline-tooltips/README.md at main · denvergeeks/discourse-inline-tooltips · GitHub
:hammer_and_wrench: Repository https://github.com/denvergeeks/discourse-inline-tooltips
:question: Install Guide How to install a theme or theme component
:open_book: New to Discourse Themes? Beginner’s guide to using Discourse Themes

Install this theme component

Provides a button in the Discourse Composer toolbar to add Inline Tooltips in Topics and Posts.

7 Likes

Will this TC work on any theme? Looks interesting.

1 Like

To me, this looks similar to the Add <abbr> tags to words in posts component. I noticed that this component doesn’t use the <abbr> HTML tag, like Hover me (<abbr title="Text shown on hover">Hover me</abbr>), which made me curious about the design choice.

From my understanding, one advantage of using <abbr> is that the information remains available even if the component is removed later. I think with the current approach, the span would become invisible in that case. I’d love to understand what advantages this approach has and am hoping to learn something new.

2 Likes

As always, I would be so grateful for anyone who would like to share ideas or participate in this effort :hugs:

My objective here is to have a toolbar button to enable the quick creation of a tooltip which reveals on hover (or optionally on click) and which can contain anything (including but not necessarily limited to HTML and Markdown), and which will most gracefully continue to display the enclosed content even if the component is removed, or when the page is viewed as a published page, and in the absence of any non-core/default plugin or theme component.

I would like the TC to provide the best general compatibility for going forward, leveraging the core Tooltip and/or DModal, or perhaps simply extending or adapting the Footnotes Plugin.

I’ve tested some of the existing theme components and plugins which each provide for specific use cases and each have their own limitations or quirky behaviors, such as not rendering certain types of content correctly, or not useable in mobile, or the Tip container not showing or not adapting to position changes, etc.

I had wanted to make a table showing each existing component/plugin including its respective use case and limitations, but at the moment I don’t have the time, and would certainly welcome any input.

1 Like