Difference between revisions of "Template:Notice/doc"

From Project: Gorgon Wiki
Jump to: navigation, search
m (removing extra whitespace from sample and added extra sample)
m (Added documentation for 'float')
Line 34: Line 34:
 
*<i>Optional</i>: {{para|border}}
 
*<i>Optional</i>: {{para|border}}
 
*:Notice box left-border-bar definition.
 
*:Notice box left-border-bar definition.
*:Use {{para|border|<var>definition</var>}}, where <var>definition</var> is a valid custom definition for the [http://www.w3schools.com/cssref/pr_border-left.asp CSS property <code>border-left</code>].
+
*:Use {{para|border|<var>definition</var>}}, where <code><var>definition</var></code> is a valid custom definition for the [http://www.w3schools.com/cssref/pr_border-left.asp CSS property <code>border-left</code>].
*:Or use {{para|border|preset}}, where <var>preset</var> is one of the predefined names below<nowiki>:</nowiki>
+
*:Or use {{para|border|preset}}, where <code>preset</code> is one of the predefined names below<nowiki>:</nowiki>
 
*:*<span style="background-color:#b22222;">&nbsp; &nbsp;</span> red &rArr; <code>10px solid #b22222</code>
 
*:*<span style="background-color:#b22222;">&nbsp; &nbsp;</span> red &rArr; <code>10px solid #b22222</code>
 
*:*<span style="background-color:#f28500;">&nbsp; &nbsp;</span> orange &rArr; <code>10px solid #f28500</code>
 
*:*<span style="background-color:#f28500;">&nbsp; &nbsp;</span> orange &rArr; <code>10px solid #f28500</code>
Line 45: Line 45:
 
*:Default: {{para|border|blue}}
 
*:Default: {{para|border|blue}}
 
*:<i>You don't need to provide the <code>;</code> at the end to properly terminate the definition(s) because it will be appended automatically for proper functionality.</i>
 
*:<i>You don't need to provide the <code>;</code> at the end to properly terminate the definition(s) because it will be appended automatically for proper functionality.</i>
 +
*<i>Optional</i>: {{para|float|side}}
 +
*:Float the Notice box.
 +
*:Where <code>side</code> can be one of: <i>(Case insensitive)</i>
 +
*:*<code>l</code> or <code>left</code>
 +
*:*<code>r</code> or <code>right</code>
 +
*:*<code>n</code> or <code>none</code>
 +
*:When anything else is provided it will be treated as <b><code>none</code></b>.
 +
*:<span style="color:red;"><b>When used</b> it alters the <u>default value</u> for <code>styleWidth</code></span> of {{para|style}}<sup>(see below)</sup> as following when the effective floating is:
 +
*:*left &rArr; <code>25%</code>
 +
*:*right &rArr; <code>25%</code>
 +
*:*none &rArr; <code>50%</code>
 
*<i>Optional</i>: {{para|style|<var>inline-CSS;</var>}}
 
*<i>Optional</i>: {{para|style|<var>inline-CSS;</var>}}
 
*:Completely override the inline-CSS used in the [http://www.w3schools.com/tags/att_global_style.asp style-attribute] of the table that generates the Notice box.
 
*:Completely override the inline-CSS used in the [http://www.w3schools.com/tags/att_global_style.asp style-attribute] of the table that generates the Notice box.
Line 51: Line 62:
 
*:To override parts of the default shown above you can use: <i>(defaults shown as value)</i>
 
*:To override parts of the default shown above you can use: <i>(defaults shown as value)</i>
 
*:*{{para|styleFontSize|95%}}
 
*:*{{para|styleFontSize|95%}}
*:*{{para|styleWidth|80%}}
+
*:*{{para|styleWidth|80%}} <i>(Default value is altered when {{para|float}}<sup>(see above)</sup> is used.)</i>
 
*:*{{para|styleMargin|0 auto}}
 
*:*{{para|styleMargin|0 auto}}
 
*:*{{para|styleBorder|1px #aaa solid}}
 
*:*{{para|styleBorder|1px #aaa solid}}

Revision as of 05:19, 29 April 2016

Description:
A simple notice box.
Dependencies:
  • Uses File:Gtk-ok.png as default image.
  • Uses for this documentation:
    • {{SPW}} = Wikia specific to link back to original.
    • {{t}} = To show clickable template mentions.
    • {{para}} = To show parameter usage.
Syntax:
Type {{Notice|parameters}} somewhere.
Parameters:
  • Recommended: |type=
    Notice box header text.
    Default: |type=Header text
  • Recommended: |info=
    Notice box additional info.
    Default: |type=Explanation
  • Optional: |image=
    Notice box symbol image.
    Provide the image-filename with extension, or use |image=no to completely remove/inhibit the image part.
    Default: |image=Gtk-ok.png
  • Optional: |imageSize=
    Notice box symbol image-size.
    Provide the image-size including the unit, eg: px, part.
    Default: |imageSize=50px
  • Optional: |border=
    Notice box left-border-bar definition.
    Use |border=definition, where definition is a valid custom definition for the CSS property border-left.
    Or use |border=preset, where preset is one of the predefined names below:
    •     red ⇒ 10px solid #b22222
    •     orange ⇒ 10px solid #f28500
    •     yellow ⇒ 10px solid #f4c430
    •     purple ⇒ 10px solid #9932cc
    •     blue ⇒ 10px solid #1e90ff
    •     green ⇒ 10px solid #228b22
    •     gray ⇒ 10px solid #bba
    Default: |border=blue
    You don't need to provide the ; at the end to properly terminate the definition(s) because it will be appended automatically for proper functionality.
  • Optional: |float=side
    Float the Notice box.
    Where side can be one of: (Case insensitive)
    • l or left
    • r or right
    • n or none
    When anything else is provided it will be treated as none.
    When used it alters the default value for styleWidth of |style=(see below) as following when the effective floating is:
    • left ⇒ 25%
    • right ⇒ 25%
    • none ⇒ 50%
  • Optional: |style=inline-CSS;
    Completely override the inline-CSS used in the style-attribute of the table that generates the Notice box.
    Where inline-CSS; defaults to:
    font-size:{{{styleFontSize}}}; width:{{{styleWidth}}}; margin:{{{styleMargin}}}; border:{{{styleBorder}}}; border-collapse:{{{styleBorderCollapse}}}; background-color:{{{styleBackgroundColor}}}; border-left:{{{border}}}
    To override parts of the default shown above you can use: (defaults shown as value)
    • |styleFontSize=95%
    • |styleWidth=80% (Default value is altered when |float=(see above) is used.)
    • |styleMargin=0 auto
    • |styleBorder=1px #aaa solid
    • |styleBorderCollapse=collapse
    • |styleBackgroundColor=#eee
Sample output:
{{Notice|type=Notice box|info=Does not use the {{t|Ambox}} template and could be considered a simpler alternative, since it doesn't have a CSS dependency.}}
gives...
Gtk-ok.pngNotice box
Does not use the {{Ambox}} template and could be considered a simpler alternative, since it doesn't have a CSS dependency.


{{Notice|styleWidth=50%|type=Notice box|info=Does not use the {{t|Ambox}} template and could be considered a simpler alternative, since it doesn't have a CSS dependency.}}
gives...

Gtk-ok.pngNotice box
Does not use the {{Ambox}} template and could be considered a simpler alternative, since it doesn't have a CSS dependency.

See also: