Messagebox – Template
Jump to navigation
Jump to search
Lou Montana (talk | contribs) m (Add min-width and text-align for icon) |
Lou Montana (talk | contribs) m (Fix R3vo's OCD :D) |
||
| Line 1: | Line 1: | ||
<includeonly><div style="background-color: {{{3|#025D00}}}; color: #FFF; display: flex; align-items: center; margin: 0.5em"> | <includeonly><div style="background-color: {{{3|#025D00}}}; color: #FFF; display: flex; align-items: center; margin: 0.5em 0"> | ||
<div style="min-width: 28px; font-size: 28px; height: 100%; margin: -2px 8px; text-align: center;">{{{2|-}}}</div> | <div style="min-width: 28px; font-size: 28px; height: 100%; margin: -2px 8px; text-align: center;">{{{2|-}}}</div> | ||
<div style="background-color: #FFF; color: #333; flex-grow: 1; height: 100%; margin: 0.25em; padding: 0.5em;">{{{1|-Text not defined-}}}</div> | <div style="background-color: #FFF; color: #333; flex-grow: 1; height: 100%; margin: 0.25em; padding: 0.5em;">{{{1|-Text not defined-}}}</div> | ||
| Line 39: | Line 39: | ||
== Source == | == Source == | ||
<syntaxhighlight lang="html"> | <syntaxhighlight lang="html"> | ||
<div style="background-color: COLOUR; color: #FFF; display: flex; align-items: center; margin: 0.5em"> | <div style="background-color: COLOUR; color: #FFF; display: flex; align-items: center; margin: 0.5em 0"> | ||
<div style="min-width: 28px; font-size: 28px; height: 100%; margin: -2px 8px;">ICON</div> | <div style="min-width: 28px; font-size: 28px; height: 100%; margin: -2px 8px;">ICON</div> | ||
<div style="background-color: #FFF; color: #333; flex-grow: 1; height: 100%; margin: 0.25em; padding: 0.5em;">MESSAGE</div> | <div style="background-color: #FFF; color: #333; flex-grow: 1; height: 100%; margin: 0.25em; padding: 0.5em;">MESSAGE</div> | ||
Revision as of 17:32, 8 September 2019
Displays a standardised message box.
Usage
{{Messagebox|message|icon|colour}}
- message: the message to display
- icon: (Optional, default "M") symbol to the left, a letter (written in white) or an image (format [[File]])
- colour: (Optional, default #025D00) box HTML colour, can be one of:
- HTML colour name - red, darkgrey, etc.
- HTML colour format - #RGB or #RRGGBB
- rgb format - rgb(255, 0, 0)
- rgba format - rgba(255, 0, 0, 0.5)
- hsl format - hsl(120, 100%, 50%)
- hsla format - hsla(120, 60%, 70%, 0.3)
| Code | Result |
|---|---|
| {{Messagebox}} | -
-Text not defined-
|
| {{Messagebox|Hello there!}} | -
Hello there!
|
| {{Messagebox|Hello there!|✔}} | ✔
Hello there!
|
| {{Messagebox|Hello there!|✔|orange}} | ✔
Hello there!
|
| {{Messagebox|Hello there!|✔|#CDF}} | ✔
Hello there!
|
Source
<div style="background-color: COLOUR; color: #FFF; display: flex; align-items: center; margin: 0.5em 0">
<div style="min-width: 28px; font-size: 28px; height: 100%; margin: -2px 8px;">ICON</div>
<div style="background-color: #FFF; color: #333; flex-grow: 1; height: 100%; margin: 0.25em; padding: 0.5em;">MESSAGE</div>
</div>