Template:Sandbox/Aurelain/Hint: Difference between revisions

From Heroes of Might and Magic: Olden Era Official Wiki
No edit summary
No edit summary
 
(17 intermediate revisions by the same user not shown)
Line 3: Line 3:
--><span class="wiki-hint <!--
--><span class="wiki-hint <!--
             -->wiki-hint-{{{side|top}}} <!--
             -->wiki-hint-{{{side|top}}} <!--
             -->{{#if:{{{3|}}}|wiki-hint-no-border}}<!--
             -->{{#ifexpr: {{#ifeq: {{#pos: {{{1|}}} | File }}||0|1}} or {{{underline|1}}}=0
                    |wiki-hint-no-border}}<!--
             -->"<!--
             -->"<!--
-->><!--
-->><!--
     -->{{{1}}}<span class="wiki-hint-floating">{{{2}}}</span><!--
     -->{{{1}}}<span class="wiki-hint-floating {{{class|}}}" style="{{{style|}}}">{{{2}}}</span><!--
--></span><!--
--></span><!--
################################################################################
################################################################################
Line 18: Line 19:


== Usage ==
== Usage ==
1. For texts:
1. Basic:


{{Color|yellow|Input:}} <code><nowiki>{{Sandbox/Aurelain/Hint | Hello | World}}</nowiki></code>
{{Color|yellow|Input:}} <code><nowiki>{{Sandbox/Aurelain/Hint | Hello | World}}</nowiki></code>
Line 25: Line 26:


----
----
2. For icons, pass a third parameter to disable the subtle border:
2. With images. In such cases, the subtle underline is automatically removed.


{{Color|yellow|Input:}} <code><nowiki>{{Sandbox/Aurelain/Hint | [[File:Icon_Resource_Wood.png]] | Wood | 0}}</nowiki></code>
{{Color|yellow|Input:}} <code><nowiki>{{Sandbox/Aurelain/Hint | [[File:Icon_Resource_Wood.png]] | Wood}}</nowiki></code>


{{Color|lime|Output:}} {{Sandbox/Aurelain/Hint | [[File:Icon_Resource_Wood.png]] | Wood | 0}}
{{Color|lime|Output:}} {{Sandbox/Aurelain/Hint | [[File:Icon_Resource_Wood.png]] | Wood}}


----
----
Line 39: Line 40:


----
----
4. Placed at the "bottom":
4. Placed at the {{b|bottom}}:


{{Color|yellow|Input:}} <code><nowiki>{{Sandbox/Aurelain/Hint | Hello | World | side=bottom}}</nowiki></code>
{{Color|yellow|Input:}} <code><nowiki>{{Sandbox/Aurelain/Hint | Hello | World | side=bottom}}</nowiki></code>
Line 46: Line 47:


----
----
5. Placed to the "left":
5. Placed to the {{b|left}}:


{{Color|yellow|Input:}} <code><nowiki>{{Sandbox/Aurelain/Hint | Hello | World | side=left}}</nowiki></code>
{{Color|yellow|Input:}} <code><nowiki>{{Sandbox/Aurelain/Hint | Hello | World | side=left}}</nowiki></code>
Line 53: Line 54:


----
----
6. Placed to the "right":
6. Placed to the {{b|right}}:


{{Color|yellow|Input:}} <code><nowiki>{{Sandbox/Aurelain/Hint | Hello | World | side=right}}</nowiki></code>
{{Color|yellow|Input:}} <code><nowiki>{{Sandbox/Aurelain/Hint | Hello | World | side=right}}</nowiki></code>


{{Color|lime|Output:}} {{Sandbox/Aurelain/Hint | Hello | World | side=right}}
{{Color|lime|Output:}} {{Sandbox/Aurelain/Hint | Hello | World | side=right}}
----
7. With a custom {{b|style}} on the floating hint:
{{Color|yellow|Input:}} <code><nowiki>{{Sandbox/Aurelain/Hint | Hello | World | style=max-width:none;width:300px}}</nowiki></code>
{{Color|lime|Output:}} {{Sandbox/Aurelain/Hint | Hello | World | style=max-width:none;width:300px}}
----
8. With a custom {{b|class}} on the floating hint:
{{Color|yellow|Input:}} <code><nowiki>{{Sandbox/Aurelain/Hint | Hello | World | class=my-class}}</nowiki></code>
{{Color|lime|Output:}} {{Sandbox/Aurelain/Hint | Hello | World | class=my-class}}
----
9. With no underline ({{b|underline{{=}}0}}):
{{Color|yellow|Input:}} <code><nowiki>{{Sandbox/Aurelain/Hint | Hello | World | underline=0}}</nowiki></code>
{{Color|lime|Output:}} {{Sandbox/Aurelain/Hint | Hello | World | underline=0}}


</noinclude>
</noinclude>

Latest revision as of 08:43, 21 July 2026


A minor tooltip for short descriptions. As opposed to the "title" attribute, it has the following advantages:

  • It's instant upon hover (has no delay)
  • It uses a skin customized for Olden Era
  • Wraps the text if too long
  • Can be placed top/left/right/bottom. Defaults to "top".

Usage

1. Basic:

Input: {{Sandbox/Aurelain/Hint | Hello | World}}

Output: Hello World


2. With images. In such cases, the subtle underline is automatically removed.

Input: {{Sandbox/Aurelain/Hint | [[File:Icon_Resource_Wood.png]] | Wood}}

Output: Wood


3. With a lot of text

Input: {{Sandbox/Aurelain/Hint | Lorem | Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.}}

Output: Lorem Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.


4. Placed at the bottom:

Input: {{Sandbox/Aurelain/Hint | Hello | World | side=bottom}}

Output: Hello World


5. Placed to the left:

Input: {{Sandbox/Aurelain/Hint | Hello | World | side=left}}

Output: Hello World


6. Placed to the right:

Input: {{Sandbox/Aurelain/Hint | Hello | World | side=right}}

Output: Hello World


7. With a custom style on the floating hint:

Input: {{Sandbox/Aurelain/Hint | Hello | World | style=max-width:none;width:300px}}

Output: Hello World


8. With a custom class on the floating hint:

Input: {{Sandbox/Aurelain/Hint | Hello | World | class=my-class}}

Output: Hello World


9. With no underline (underline=0):

Input: {{Sandbox/Aurelain/Hint | Hello | World | underline=0}}

Output: Hello World