Difference between revisions of "Template:Message box"

From Nookipedia, the Animal Crossing wiki
(Created page with "<includeonly><div class="nomobile"> {| width=90% align=center style=" background-color: hsl({{{primarycolor|0 0}}}% {{#if:{{{overrideprimary|}}}|{{{overrideprimary}}}|80%}});...")
 
(Updating to use CSS classes and colours. Removing mobile version of template as this is now also controlled with CSS.)
 
Line 1: Line 1:
<includeonly><div class="nomobile">
+
<includeonly>
{| width=90% align=center style=" background-color: hsl({{{primarycolor|0 0}}}% {{#if:{{{overrideprimary|}}}|{{{overrideprimary}}}|80%}}); {{roundy|15px}}; padding: 4px 4px 4px 4px; margin: 10px auto"
+
{| class="s-messagebox {{{colorclass|}}}"
|
+
| id="title" colspan=2 style="font-family: Coustard; font-size: 1.5em; text-align:left; padding:0 0 0 9px;" | {{{title|Message box}}}
{| width=100% style="background: hsl({{{primarycolor|0 0}}}% {{#if:{{{overrideprimary|}}}|{{{overrideprimary}}}|80%}}); {{roundy|9px}};"  
 
| colspan=2 style="font-family: Coustard; font-size: 1.5em; text-align:left; padding:0 0 0 9px;" | {{{title|Message box}}}
 
 
|-
 
|-
| colspan=2 style="background: #fff; {{roundy|9px}}; padding:9px;"| {{{image|}}} {{{message|Put an informative message here}}}
+
| colspan=2 style="{{roundy|9px}}; padding:9px;"| {{{image|}}} {{{message|Put an informative message here}}}
 
{{#if:{{{submessage|}}}|
 
{{#if:{{{submessage|}}}|
 
{{!-}}
 
{{!-}}
Line 11: Line 9:
 
{{!-}}|}}{{#if:{{{submessage|}}}|{{#if:{{{sublabel|}}}|
 
{{!-}}|}}{{#if:{{{submessage|}}}|{{#if:{{{sublabel|}}}|
 
{{!-}}
 
{{!-}}
{{!}} align=center style="background: hsl({{#if:{{{secondarycolor|}}}|{{{secondarycolor|}}}|{{{primarycolor|0 0}}}}}% {{#if:{{{overridesecondary|}}}|{{{overridesecondary}}}|90%}}); {{roundytl|9px}}; padding:5px; border-bottom: 2px;" {{!}}{{{sublabel|}}}
+
{{!}} id="sub" style="text-align: center; {{roundytl|9px}}; padding:5px; border-bottom: 2px;" {{!}}{{{sublabel|}}}
{{!}} align=left style="background: hsl({{#if:{{{secondarycolor|}}}|{{{secondarycolor|}}}|{{{primarycolor|0 0}}}}}% {{#if:{{{overridesecondary|}}}|{{{overridesecondary}}}|90%}}); {{roundytr|9px}}; padding:5px; border-bottom: 2px;"  {{!}}{{{submessage|}}}|
+
{{!}} id="sub" style="{{roundytr|9px}}; padding:5px; border-bottom: 2px;"  {{!}}{{{submessage|}}}|
 
{{!-}}
 
{{!-}}
{{!}} align=left style="background: hsl({{#if:{{{secondarycolor|}}}|{{{secondarycolor|}}}|{{{primarycolor|0 0}}}}}% {{#if:{{{overridesecondary|}}}|{{{overridesecondary}}}|90%}}); {{roundy|9px}}; padding:9px; border-bottom: 2px;" {{!}}{{{submessage|}}}}}
+
{{!}} id="sub" style="{{roundy|9px}}; padding:9px; border-bottom: 2px;" {{!}}{{{submessage|}}}}}
 
|}}
 
|}}
 
|-
 
|-
 
{{#if:{{{submessage2|}}}|
 
{{#if:{{{submessage2|}}}|
{{!}} align=center style="background: hsl({{#if:{{{secondarycolor|}}}|{{{secondarycolor|}}}|{{{primarycolor|0 0}}}}}% {{#if:{{{overridesecondary|}}}|{{{overridesecondary}}}|90%}}); padding:5px;" {{!}} {{{sublabel2|}}}
+
{{!}} id="sub" style="text-align: center; padding:5px;" {{!}} {{{sublabel2|}}}
{{!}} align=left style="background: hsl({{#if:{{{secondarycolor|}}}|{{{secondarycolor|}}}|{{{primarycolor|0 0}}}}}% {{#if:{{{overridesecondary|}}}|{{{overridesecondary}}}|90%}}); padding:5px;"  {{!}} {{{submessage2|}}}
+
{{!}} id="sub" style="padding:5px;"  {{!}} {{{submessage2|}}}
|}}
 
|-
 
{{#if:{{{submessage3|}}}|
 
{{!}} align=center style="hsl({{#if:{{{secondarycolor|}}}|{{{secondarycolor|}}}|{{{primarycolor|0 0}}}}}% {{#if:{{{overridesecondary|}}}|{{{overridesecondary}}}|90%}}); padding:5px;" {{!}} {{{sublabel3|}}}
 
{{!}} align=left style="background: hsl({{#if:{{{secondarycolor|}}}|{{{secondarycolor|}}}|{{{primarycolor|0 0}}}}}% {{#if:{{{overridesecondary|}}}|{{{overridesecondary}}}|90%}}); padding:5px;"  {{!}} {{{submessage3|}}}
 
|}}
 
|-
 
{{#if:{{{footer|}}}|
 
{{!}} colspan=2 align=center style="background: hsl({{#if:{{{secondarycolor|}}}|{{{secondarycolor|}}}|{{{primarycolor|0 0}}}}}% {{#if:{{{overridesecondary|}}}|{{{overridesecondary}}}|90%}}); {{roundybottom|9px}}; padding:5px;" {{!}} {{{footer|}}}
 
|}}
 
|}
 
|}</div>
 
<div class="onlymobile">
 
{| width=100% align=center style=" background-color: hsl({{{primarycolor|0 0}}}% {{#if:{{{overrideprimary|}}}|{{{overrideprimary}}}|80%}}); {{roundy|15px}}; padding: 8px 8px 8px 8px; margin: 10px auto"</div>
 
|
 
{| width=100% style="background: hsl({{{primarycolor|0 0}}}% {{#if:{{{overrideprimary|}}}|{{{overrideprimary}}}|80%}}); {{roundy|9px}};"
 
| colspan=2 style="font-family: Coustard; font-size: 1.5em; text-align:left; padding:0 0 0 9px;" | {{{title|Message box}}}
 
|-
 
| colspan=2 style="background: #fff; {{roundy|9px}}; padding:9px;"| {{{image|}}} {{{message|Put an informative message here}}}
 
{{#if:{{{submessage|}}}|
 
{{!-}}
 
{{!}}
 
{{!-}}|}}{{#if:{{{submessage|}}}|{{#if:{{{sublabel|}}}|
 
{{!-}}
 
{{!}} align=center style="background: hsl({{#if:{{{secondarycolor|}}}|{{{secondarycolor|}}}|{{{primarycolor|0 0}}}}}% {{#if:{{{overridesecondary|}}}|{{{overridesecondary}}}|90%}}); {{roundytl|9px}}; padding:5px; border-bottom: 2px;" {{!}}{{{sublabel|}}}
 
{{!}} align=left style="background: hsl({{#if:{{{secondarycolor|}}}|{{{secondarycolor|}}}|{{{primarycolor|0 0}}}}}% {{#if:{{{overridesecondary|}}}|{{{overridesecondary}}}|90%}}); {{roundytr|9px}}; padding:5px; border-bottom: 2px;"   {{!}}{{{submessage|}}}|
 
{{!-}}
 
{{!}} align=left style="background: hsl({{#if:{{{secondarycolor|}}}|{{{secondarycolor|}}}|{{{primarycolor|0 0}}}}}% {{#if:{{{overridesecondary|}}}|{{{overridesecondary}}}|90%}}); {{roundy|9px}}; padding:9px; border-bottom: 2px;" {{!}}{{{submessage|}}}}}
 
|}}
 
|-
 
{{#if:{{{submessage2|}}}|
 
{{!}} align=center style="background: hsl({{#if:{{{secondarycolor|}}}|{{{secondarycolor|}}}|{{{primarycolor|0 0}}}}}% {{#if:{{{overridesecondary|}}}|{{{overridesecondary}}}|90%}}); padding:5px;" {{!}} {{{sublabel2|}}}
 
{{!}} align=left style="background: hsl({{#if:{{{secondarycolor|}}}|{{{secondarycolor|}}}|{{{primarycolor|0 0}}}}}% {{#if:{{{overridesecondary|}}}|{{{overridesecondary}}}|90%}}); padding:5px;"  {{!}} {{{submessage2|}}}
 
|}}
 
|-
 
{{#if:{{{submessage3|}}}|
 
{{!}} align=center style="hsl({{#if:{{{secondarycolor|}}}|{{{secondarycolor|}}}|{{{primarycolor|0 0}}}}}% {{#if:{{{overridesecondary|}}}|{{{overridesecondary}}}|90%}}); padding:5px;" {{!}} {{{sublabel3|}}}
 
{{!}} align=left style="background: hsl({{#if:{{{secondarycolor|}}}|{{{secondarycolor|}}}|{{{primarycolor|0 0}}}}}% {{#if:{{{overridesecondary|}}}|{{{overridesecondary}}}|90%}}); padding:5px;"  {{!}} {{{submessage3|}}}
 
 
|}}
 
|}}
 
|-
 
|-
 
{{#if:{{{footer|}}}|
 
{{#if:{{{footer|}}}|
{{!}} colspan=2 align=center style="background: hsl({{#if:{{{secondarycolor|}}}|{{{secondarycolor|}}}|{{{primarycolor|0 0}}}}}% {{#if:{{{overridesecondary|}}}|{{{overridesecondary}}}|90%}}); {{roundybottom|9px}}; padding:5px;" {{!}} {{{footer|}}}
+
{{!}} id="sub" colspan=2 style="text-align: center; {{roundybottom|9px}}; padding:5px;" {{!}} {{{footer|}}}
 
|}}
 
|}}
 
|}
 
|}
|}
+
</includeonly><noinclude>{{Documentation}}[[Category:Message templates]]</noinclude>
</div></includeonly><noinclude>{{Documentation}}[[Category:Message templates]]</noinclude>
 

Latest revision as of 10:51, May 18, 2024

Template documentation (view)


Usage

{{Message box
 | colorclass        =
 | title             =
 | image             =
 | message           =
 | sublabel          =
 | submessage        =
 | sublabel2         =
 | submessage2       = 
 | footer            =
}}

This template can be used to create a stylized message box, primarily for use on user talk pages.

Example

{{Message box
 | colorclass        = color-award
 | title             = [[File:Text - The Golden Leaf Award.png|280px|link=Nookipedia:Golden Leaf Award]]
 | image             = [[File:Golden Leaf Award.png|140px|right|link=Golden Leaf Award]]
 | message           = <big>{{colorshow|363636|'''Congratulations, you have been awarded the [[Nookipedia:Golden Leaf Award|{{colorshow|e5c100|Golden Leaf Award}}]]!'''}}</big><br /><br />{{{1|''You have received this award in recognition of your outstanding contributions to Nookipedia. Well done!''}}}
}}
Text - The Golden Leaf Award.png
Golden Leaf Award.png
Congratulations, you have been awarded the Golden Leaf Award!

You have received this award in recognition of your outstanding contributions to Nookipedia. Well done!