Template:Rounded info box/doc

This template is used on the Main page. Be careful when editing (test on your user page first!)

Examples

{{Rounded info box|Header|Text}}

Header

Text

Existing shortcuts

• Template:Red rounded info box
• Template:Grey rounded info box
• Template:Orange rounded info box
• Template:Green rounded info box

{{Red rounded info box|Header|Text}}

Header

Text

{{Grey rounded info box|Header|Text}}

Header

Text

{{Orange rounded info box|Header|Text}}

Header

Text

{{Green rounded info box|Header|Text}}

Header

Text

Custom colors

{{Rounded info box|Header|Text|bordercolor=red|hbgcolor=yellow|hcolor=#090}}

Header

Text

Bad example:

{{Rounded info box|Header|Text|hcolor=purple|hbgcolor=red|bgcolor=lime|color=rgb(255,150,10)|bordercolor=hsl(0, 100%, 0%)}}

Header

Text

Parameters (optional)

Colors

• color: The text color of the body (named after the CSS property)
• hcolor: The text color of the header
• bordercolor: Border color of the infobox (hard to see)
• bgcolor: Background color of the body
• hbgcolor: Background color of the header

Multiple formats are acceptable.

Format	Red	Light blue [1]
Hexadecimal	#f00 or #ff0000	#e0f0ff
Text	red	None [2]
RGB	rgb(255,0,0)	rgb(224,240,255)
HSL	hsl(0, 100%, 50%)	hsl(209, 100%, 94%)

[1] This is only an example - many other colors would also work.

[2] Some browsers may support a name for this color (like skyBlue) but it might not be consistent.

Creating a new color scheme (shortcut to this template)

1. Create a new page with the text from Template:Red rounded info box (or another similar template).
2. Change the colors, preferably to something else.
3. Save the page.

Be sure to include the link to this page so documentation is easy to find.

Technical Notes

• The rounded corners are produced with border-radius, -webkit-border-radius and -moz-border-radius, which don't work on all browsers (only ones that support CSS3)
• The header comes after the body in the template. Make sure you don't edit the wrong part by mistake!