Difference between revisions of "Template:Color box"

From EVE University Wiki
Jump to: navigation, search
m (Apply CSS shorthand. Remove overflow: only functions when a fixed height: is used. Sort CSS properties by the CSS Box model from outer to inner.)
(Add CSS to stop from overlapping floats.)
 
(3 intermediate revisions by the same user not shown)
Line 1: Line 1:
 
<div style="
 
<div style="
margin:0 auto;  
+
margin: 0.2em auto;
border:1px solid {{{border|#888888}}};  
+
border: 2px solid {{{border|#888888}}};
padding:1em;  
+
padding: 0.8em;  
width: {{{width|auto}}};  
+
width: {{{width|auto}}};
background-color:{{{color|black}}};  
+
overflow: hidden; /* To stop the div from overlapping floating elements. */
text-align:{{{align|left}}};  
+
background-color: {{{color|black}}};
color:{{{text|white}}};  
+
text-align: {{{align|left}}};
font-style:italic;  
+
color: {{{text|white}}};
 +
{{#ifeq: {{{italics}}} | no
 +
| font-style: normal;
 +
| font-style: italic;
 +
}}
 
">{{{1|Example text}}}</div><noinclude>
 
">{{{1|Example text}}}</div><noinclude>
 
{{documentation}}
 
{{documentation}}
 
</noinclude>
 
</noinclude>

Latest revision as of 10:00, 2 April 2024

Example text
Template documentation (for the above template, sometimes hidden or invisible)
Description
This template creates a colored text box.
Dependencies
Used by
{{Example}}
{{Important note box}}
{{Note box}}
Syntax
{{Color box|<content>|<border= color>|<width= percentage>|<color= color>|<align= position>|<text= color>|<italics= no>}}
Parameters
All named parameters, with an = in the syntax, are optional.
content
The contents of the box. This can be as long or short as necessary, and wiki formatting (such as bold text or links) works just fine. Note: If the text you would like to use include an equals sign (=), you need to explicitly declare your text as a numbered parameter (i.e. put 1= before your text), otherwise the template will display nothing.
border
Sets the border color of the box. The default is set to a shade of gray. Colors can be given either by color name[1] (e.g. red or green) or values[2] (like #FF0000).
width
Sets the width of the box. It's recommended to set this as a percentage (of the paragraph width), so 50% will produce a text box half as wide as the surrounding paragraph. If omitted, the text box will be as wide as the surrounding paragraph. When width is set to less than 100%, the box will be centered.
color
Sets the background color of the box. The default is set to black. For valid values see border
align
Sets the position of the text within the box. The default is set to left. Values are: left, center, right or justify.
text
Sets the text color of the box. The default is set to white. For valid values see border.
italics
Set italics= no to override the default of the contents of the box being in italics. Otherwise omit.
Usage notes
The background color should be darker than the border. Depending on how light the background color is, either white or black text is easier to read. Given that the default skin for the UniWiki has light text on a dark background, a text box with a light background will stand out much more than one with a darker background (but will also make a page look more cluttered, especially if it is used repeatedly).
Examples
{{Color box|A very basic text box}}: gives ...
A very basic text box


{{Color box|color= #144f1d|border= #2f8f2f|A more colorful box!}}: gives ...
A more colorful box!


{{Color box|color= #110033|border= #6600bb|width=50%|A smaller, purple box}}: gives ...
A smaller, purple box


{{Color box|color= #66FFFF|border= #6600FF|text= black|A light blue box with dark text}}: gives ...
A light blue box with dark text


References
Visit Template:Color box/doc to edit this text! (How does this work?) (Refresh this text - why?)