Template:Clickable button 2: Difference between revisions
en>Technical 13 Allow custom styling on pages that aren't selflinks |
en>Jackmcbarn condense style code |
||
| Line 2: | Line 2: | ||
|{{{url}}} | |{{{url}}} | ||
|[{{{1|}}}{{!}} | |[{{{1|}}}{{!}} | ||
}}<span class="{{#switch:{{lc:{{{class|}}}}}|ui-button-green|ui-button-blue|ui-button-red=submit ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only ui-button-text|#default=mw-ui-button}} {{{class|}}}" role="button" aria-disabled="false" {{#ifeq:{{FULLPAGENAME:{{{1}}}}}|{{FULLPAGENAME}}| | }}<span class="{{#switch:{{lc:{{{class|}}}}}|ui-button-green|ui-button-blue|ui-button-red=submit ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only ui-button-text|#default=mw-ui-button}} {{{class|}}}" role="button" aria-disabled="false" style="{{#ifeq:{{FULLPAGENAME:{{{1}}}}}|{{FULLPAGENAME}}|cursor: default; | ||
{{#switch:{{{class|}}} | {{#switch:{{{class|}}} | ||
| ui-button-blue | mw-ui-progressive = background-color: #2962CB; | | ui-button-blue | mw-ui-progressive = background-color: #2962CB; | ||
| Line 8: | Line 8: | ||
| ui-button-red | mw-ui-destructive = background-color: #A6170F; | | ui-button-red | mw-ui-destructive = background-color: #A6170F; | ||
| #default = background-color: #CCC; color: #666; | | #default = background-color: #CCC; color: #666; | ||
} | }}}} {{{style|}}}">{{#if:{{{url|}}} | ||
|{{#if:{{{1|}}} | |{{#if:{{{1|}}} | ||
|{{{1}}} | |{{{1}}} | ||
Revision as of 00:44, 27 February 2014
[[|]]
 | This template uses Lua: |
This template styles a link like a button, using the mediawiki.ui.button module. This expands the clickable area and tap target for the link. It can be used in the following ways,
- Code:
{{Clickable button 2|Main Page}} - Code:
{{Clickable button 2|Main Page|Cover page}} - Code:
{{Clickable button 2|Main Page|url=http://en.wikipedia.org}} - Code:
{{Clickable button 2|Main Page|class=mw-ui-destructive}} - Code:
{{Clickable button 2|Main Page|class=mw-ui-progressive}}
Note: After the changes outlined in Phabricator task T110555 were implemented, {{Clickable button 2|Main Page|class=mw-ui-constructive}} produces the same output as {{Clickable button 2|Main Page|class=mw-ui-progressive}}.
Template data
Styles a link like a button, using the mediawiki.ui.button module
| Parameter | Description | Type | Status | |
|---|---|---|---|---|
| Link/Label | 1 | Defines the page to link to, and uses that page's title as the text for the button
| Page name | required |
| Label | 2 | Defines the text that appears on the button | Unknown | suggested |
| URL | url | Defines a web address for the button to link to
| URL | optional |
| class | class | Defines the visual type of the button
| String | optional |
| style | style | no description | String | optional |
| category | category | no description | Boolean | optional |
See also
- commons:Template:Clickable button, corresponding clickable button at Commons.
- Wikimedia design style guide advice on buttons
Button templates | |
|---|---|
| General button templates |
|
| WikiProject-specific buttons |
|
