Template:Icon link inline: Difference between revisions
Jump to navigation
Jump to search
(trying top valign) |
m (alignment adjustment) |
||
(5 intermediate revisions by the same user not shown) | |||
Line 2: | Line 2: | ||
--><span style="position: relative; {{#if:{{{width|}}}|padding-left: {{#expr:({{{width}}} - {{{size|22}}} * {{#if:{{{icon2|}}}|2|1}}) / 2}}px;}} white-space: nowrap;"><!-- | --><span style="position: relative; {{#if:{{{width|}}}|padding-left: {{#expr:({{{width}}} - {{{size|22}}} * {{#if:{{{icon2|}}}|2|1}}) / 2}}px;}} white-space: nowrap;"><!-- | ||
--><span style="position: absolute; top: | --><span style="position: absolute; top: -2px; pointer-events: none;"><!-- | ||
-->[[File:{{{icon}}}|{{{size|22}}}px|top|link=|alt=]]<!-- | -->[[File:{{{icon}}}|{{{size|22}}}px|top|link=|alt=]]<!-- | ||
-->{{#if:{{{icon2|}}}|<!-- | -->{{#if:{{{icon2|}}}|<!-- | ||
Line 10: | Line 10: | ||
-->[[{{{link}}}|<!-- | -->[[{{{link}}}|<!-- | ||
--><span style="display: inline-block; padding-left: {{#expr:{{#if:{{{width|}}}|{{{size|22}}} * {{#if:{{{icon2|}}}|2|1}} / 2 + {{{width}}} / 2|{{{size|22}}} * {{#if:{{{icon2|}}}|2|1}}}} + 4}}px; white-space: normal; text-decoration: inherit;"><!-- | --><span style="display: inline-block; vertical-align: top; padding-left: {{#expr:{{#if:{{{width|}}}|{{{size|22}}} * {{#if:{{{icon2|}}}|2|1}} / 2 + {{{width}}} / 2|{{{size|22}}} * {{#if:{{{icon2|}}}|2|1}}}} + 4}}px; white-space: normal; text-decoration: inherit;"><!-- | ||
-->{{{text|{{{link}}}}}}<!-- | -->{{{text|{{{link}}}}}}<!-- | ||
--></span><!-- | --></span><!-- |
Latest revision as of 16:14, 2 October 2023
[edit] [ ] Documentation
Displays an inline icon and text link. The icon and text are combined as a single tap target.
Parameters
- icon
- Required. Filename of icon to display.
- icon2
- Optional. Filename of second icon to display. Default: No second icon displayed.
- size
- Optional. Width of each icon, in pixels. Avoid icon heights larger than the text's line height, usually 22px. Default: 22.
- width
- Optional. Width of space that icon(s) will be centered in. Used for aligning icons of different widths. Default: Same as size parameter, or double size parameter if icon2 is given.
- link
- Required. Page to link to.
- text
- Optional. Text to display. Default: Same as link parameter.
Examples
Basic use
{{icon link inline | icon = IO Accurate Defense Debuff.png | link = :Category:Sets for improving Accurate Defense Debuff | text = Accurate Defense Debuff }}
Two icons, one link
{{icon link inline | icon = Badge event spectral.png | icon2 = Badge event corsair.png | link = Clothes Horse Badge | text = Clothes Horse }}
Aligning icons of different widths
* {{icon link inline | icon = Badge DayJob CareGiver.png | link = Caregiver Badge | size = 20 | width = 31 | text = Caregiver }} * {{icon link inline | icon = Badge DayJob Scholar.png | link = Professor Badge | size = 20 | width = 31 | text = Professor }} * {{icon link inline | icon = Badge DayJobAcc Doctor.png | link = Physician Badge | size = 31 | text = Physician }}