Template:Messagebox/doc: Difference between revisions

Created page with " This template is for generating nicely formatted message boxes in articles, or even other templates. == Usage == The template takes three named parameters that can be given in any order. ; text : (required) is the message ; type : (optional) determines the presentation using pre-defined styling. One of :* success - to indicate what success means :* warning - to alert the user about preventing problems :* failure - to dialog about when something fails :* restricted - sh..."
 
Add Template Data
 
(4 intermediate revisions by the same user not shown)
Line 26: Line 26:


== Visual Examples ==
== Visual Examples ==
<pre>
{{Messagebox
{{Messagebox
| text = no type, uses default (normal)
| text = no type, uses default (normal)
| style = width:50%;
| style = width:50%;
}}
}}
</pre>
{{Messagebox
| text = no type, uses default (normal)
| style = width:50%;
}}


<pre>
{{Messagebox
| type = normal
| text = Why be normal?
}}
</pre>
{{Messagebox
{{Messagebox
| type = normal
| type = normal
Line 36: Line 49:
}}
}}


<pre>
{{Messagebox
| type = success
| text = You won!
}}
</pre>
{{Messagebox
{{Messagebox
| type = success
| type = success
Line 41: Line 60:
}}
}}


<pre>
{{Messagebox
| type = warning
| text = Do not spit into the wind
}}
</pre>
{{Messagebox
{{Messagebox
| type = warning
| type = warning
Line 46: Line 71:
}}
}}


<pre>
{{Messagebox
{{Messagebox
|type = failure
|type = failure
|text = You kissed your cousin
|text = Something went wrong.
}}
</pre>
{{Messagebox
|type = failure
|text = Something went wrong.
}}
}}


<pre>
{{Messagebox
{{Messagebox
| type = forbidden
| type = forbidden
Line 56: Line 88:
}}
}}


</pre>
{{Messagebox
| type = forbidden
| text = You can't do that!
}}
<pre>
{{Messagebox
| type = restricted
| text = You must be a registered user to create or edit articles.  Contact the [[User:Freephile|WikiSysop]] for an account!
}}
</pre>
{{Messagebox
{{Messagebox
| type = restricted
| type = restricted
| text = You must be a registered user to create or edit articles.  Contact the [[User:Freephile|WikiSysop]] for an account!
| text = You must be a registered user to create or edit articles.  Contact the [[User:Freephile|WikiSysop]] for an account!
}}
}}
== To Do ==
# <strike>Based on the existing dialog images [http://freephile.com/wiki/index.php?title=Special%3ASearch&ns6=1&ns7=1&ns8=1&ns9=1&ns10=1&ns11=1&search=dialog&fulltext=Advanced+search], I should add a type for "restricted" for pages with restricted authoring and or "forbidden"</strike>
# {{@todo}} Improve and coordinate the CSS with the new Chameleon skin rather than just the freephile skin


== Making this template ==
== Making this template ==
To generate the resized images from svg
[[Image:Dialog-error.svg|32px]]
[[Image:Dialog-warning.svg|32px]]
[[Image:Dialog-ok-apply.svg?|32px]]
[[Image:Dialog-information.svg|32px]]
[[Image:Dialog-cancel.svg|32px]]
[[Image:Dialog-password.svg|32px]]


The parser code (how to do switch statements) is based on the example of the Ambox template from Mediawiki
The parser code (how to do switch statements) is based on the example of the Ambox template from Mediawiki


The following CSS is added to skins/freephile/freephile_template.css to make this template complete
The CSS is added to [[Template:Messagebox/styles.css]] to make this template complete by incorporating the TemplateStyles extension.


The background images for the CSS are put into the images subfolder to make it easier to distinguish what is based on monobook, and what is extra
[[Category:Templates using ParserFunctions]]
<source lang="css">
<templatedata>
.message-box {
{
font-family: Verdana, Arial, Helvetica, sans-serif;
"params": {
font-size: 11px;
"type": {
background-color:#EBFFEA;
"label": "Type of box",
border:1px solid #0BD200;
"description": "Type determines the decoration of the message box",
color:#333333;
"type": "string",
padding:8px;
"suggestedvalues": [
margin:10px;
"success",
background-repeat: no-repeat;
"warning",
background-position: 6px 6px;
"failure",
" restricted",
"forbidden",
"normal"
],
"default": "normal"
},
"style": {
"label": "CSS markup",
"description": "Add CSS if desired. This will be passed to the \"style\" attribute of the containing div.",
"example": "width:50%;",
"type": "string"
},
"text": {
"label": "Your message",
"description": "The text (and wiki markup) displayed in the message box.",
"type": "string",
"required": true
}
},
"description": "Messagebox is for creating call-outs of text in a bordered box. This visually distinguishes the text from other content on the page. There are multiple \"types\" that are predefined - basically red, yellow green.",
"format": "block"
}
}
.message-box a:link, .message-box a:active, .message-box a:visited {
</templatedata>
color:#990000;
text-decoration:none;
border-bottom:1px solid #cccccc;
}
.message-box a:hover {
color:#990000;
text-decoration:none;
border-bottom:1px solid #990000;
}
.message-success {
font-weight: bold;
border:1px solid #8FD500;
background-color:#F2FFD7;
background-image: url(images/32px-Dialog-ok-apply.svg.png);
padding-left: 32px;
}
.message-failure {
font-weight: bold;
color: #990000;
border:1px solid #DD3C10;
background-color:#FFEBE8;
background-image: url(images/32px-Dialog-error.svg.png);
padding-left: 32px;
}
.message-warning {
font-weight: bold;
color:#FF6633;
border: 1px solid #ff9900;
background-color:#fbf8c7;
background-image: url(images/32px-Dialog-warning.svg.png);
padding-left: 32px;
}
.message-box .message-normal {
font-weight:normal;
color: #333;
background-image: url(images/32px-Dialog-information.svg.png);
padding-left: 32px;
}
</source>
[[Category:Templates using ParserFunctions]]