Notice

Latest revision as of 11:03, 4 December 2023

Notice template

This is a template for creating a general notice banner on pages. Useful for communicating some extra information the reader should be aware of.

Use https://fontawesome.com/v6/icons for picking icons, or set an image as one.

See Category:Notice templates for other templates based on this one.

Example(s)

{{Notice
|title=Title of notice
|message=Message Body
|contentbackcolor=
|iconbackcolor=
|icon=
|customiconpadding=
|customcontentpadding=
}}

generates:

Title of notice: Message Body

Template data

A template for leaving a notice banner on articles.

Template parameters
Parameter		Description	Type	Status
Title	`title`	Title of the notice	String	suggested
Message	`message` `content`	The message body of the notice	String	required
Icon	`icon`	FontAwesome icon to display on the notice Example fas fa-edit Auto value `fas fa-edit`	String	optional
Icon color	`iconbackcolor`	Background color of the icon section of the notice	String	optional
Content background color	`contentbackcolor`	Background color of the body of the notice.	String	optional
Icon padding values	`customiconpadding`	Custom padding values for the icon section of the notice Example 10px 10px 10px 10px	String	optional
Content padding values	`customcontentpadding`	Custom padding values for the body of the notice Example 10px 10px 10px 10px	String	optional
Class	`class`	Optional extra CSS classes for the notice	String	optional
Image	`image`	Optional free-form image input in place of the icon, for use in license templates.	String	optional
Border color	`bordercolor`	no description Default #d9d6d3	String	optional
Icon color	`iconcolor`	no description Default white	String	optional
License information	`license`	Machine readable license information (hidden from viewer)	String	optional
clear	`clear`	no description Default left Example left, right, both	String	optional

@@ Line 1: / Line 1: @@
-<noinclude><pre>{{Notice
+<includeonly><div style="display:flex; margin:10px; float:left; border:1px solid {{{bordercolor|#d9d6d3}}}" class="notice phonefullscreen noexcerpt {{{class|}}}"><!--
+--><div style="display:flex; flex-direction:column; justify-content:center; padding:{{{customiconpadding|12px}}}; background-color:{{{iconbackcolor|#8b0024}}};"><!--
+      --->{{#if:{{{image|}}}|{{{image}}}|{{fa|{{{icon|edit}}}|{{{iconstyle|solid}}}|color={{{iconcolor|white}}}|style=font-size:160%;}} }}<!--
+--></div><!--
+--><div style="flex-grow:1; background-color:{{{contentbackcolor|#E9EDEF}}}; display:flex; flex-direction:column; justify-content:center;"><div style="padding:{{{customcontentpadding|12px 14px}}};"><!--
+      -->{{#if: {{{title|}}}|'''{{{title|}}}'''|}}{{#if: {{{message|}}}|<b>:</b>|}} {{{message|}}}{{{license|}}}<!--
+--></div></div></div><!--
+--><div style="clear:{{{clear|left}}};"></div></includeonly><noinclude>
+==Notice template==
+This is a template for creating a general notice banner on pages. Useful for communicating some extra information the reader should be aware of.
+Use [https://fontawesome.com/v6/icons https://fontawesome.com/v6/icons] for picking icons, or set an image as one.
+See [[:Category:Notice templates]] for other templates based on this one.
+===Example(s)===
+<pre>{{Notice
 |title=Title of notice
 |message=Message Body
 |contentbackcolor=
 |iconbackcolor=
-}}</pre>
+|icon=
+|customiconpadding=
-{{Notice
+|customcontentpadding=
+}}</pre> generates: {{Notice
 |title=Title of notice
 |message=Message Body
-|icon=fa-pencil-square-o
 }}
-</noinclude><includeonly>
+==Template data==
-<div style="display:auto; white-space: nowrap; float: left; padding: 10px 10px" class="phonefullscreen noexcerpt">
+<templatedata>
-<span style="background-color: {{{iconbackcolor|#8b0024}}}; display:inline-block; text-align:center; overflow:hidden; padding: {{{customiconpadding|14px 8px 6px 12px}}}">
+{
-<i class="fa {{{icon|fa-pencil-square-o}}}" style="color:white; font-size:160%"></i>
+	"params": {
-</span><span style="background-color: {{{contentbackcolor|#E9EDEF}}}; display:inline-block; padding: {{{customcontentpadding|12px 14px 12px 14px}}}; overflow:hidden; max-width:100%">
+		"iconbackcolor": {
-{{#if: {{{title|}}}|'''{{{title:  '''|}}}|}}{{{message|}}}</span>
+			"label": "Icon color",
-</div>
+			"description": "Background color of the icon section of the notice",
-</includeonly>
+			"type": "string"
+		},
+		"class": {
+			"label": "Class",
+			"description": "Optional extra CSS classes for the notice",
+			"type": "string"
+		},
+		"image": {
+			"label": "Image",
+			"description": "Optional free-form image input in place of the icon, for use in license templates.",
+			"type": "string"
+		},
+		"customiconpadding": {
+			"label": "Icon padding values",
+			"description": "Custom padding values for the icon section of the notice",
+			"example": "10px 10px 10px 10px",
+			"type": "string"
+		},
+		"icon": {
+			"label": "Icon",
+			"description": "FontAwesome icon to display on the notice",
+			"example": "fas fa-edit",
+			"type": "string",
+			"autovalue": "fas fa-edit"
+		},
+		"contentbackcolor": {
+			"label": "Content background color",
+			"description": "Background color of the body of the notice.",
+			"type": "string"
+		},
+		"customcontentpadding": {
+			"label": "Content padding values",
+			"description": "Custom padding values for the body of the notice",
+			"example": "10px 10px 10px 10px",
+			"type": "string"
+		},
+		"title": {
+			"label": "Title",
+			"description": "Title of the notice",
+			"type": "string",
+			"suggested": true
+		},
+		"message": {
+			"aliases": [
+				"content"
+			],
+			"label": "Message",
+			"description": "The message body of the notice",
+			"type": "string",
+			"required": true
+		},
+		"bordercolor": {
+			"label": "Border color",
+			"type": "string",
+			"default": "#d9d6d3"
+		},
+		"iconcolor": {
+			"label": "Icon color",
+			"type": "string",
+			"default": "white"
+		},
+		"license": {
+			"label": "License information",
+			"description": "Machine readable license information (hidden from viewer)",
+			"type": "string"
+		},
+		"clear": {
+			"label": "clear",
+			"example": "left, right, both",
+			"type": "string",
+			"default": "left"
+		}
+	},
+	"paramOrder": [
+		"title",
+		"message",
+		"icon",
+		"iconbackcolor",
+		"contentbackcolor",
+		"customiconpadding",
+		"customcontentpadding",
+		"class",
+		"image",
+		"bordercolor",
+		"iconcolor",
+		"license",
+		"clear"
+	],
+	"description": "A template for leaving a notice banner on articles."
+}
+</templatedata> [[Category:Notice templates]] {{Interface template}}
+</noinclude>