Template:Colored box: Difference between revisions
(fork from https://www.wikidata.org/wiki/Template:Colored_box) |
No edit summary |
||
Line 8: | Line 8: | ||
{{{content}}}{{clr}}</div> | {{{content}}}{{clr}}</div> | ||
</div><noinclude> | </div><noinclude> | ||
{{ | DOCUMENTATION | ||
== Usage == | |||
Allow to insert a modern box. | |||
For the box to continue to the bottom you must use the argument « <code>| flex = 1 1 auto</code> » | |||
== Syntax == | |||
'''Reduced Syntax''' | |||
<pre>{{Colored box | |||
| title = | |||
| title-color = #000 | |||
| background-title-color = #eaecf0 | |||
| icon = | |||
| content = | |||
| background-content-color = #f8f9fa | |||
| link = | |||
}}</pre> | |||
'''Complete syntax''' | |||
<pre>{{Colored box | |||
| title = | |||
| title-color = #000 | |||
| background-title-color = #eaecf0 | |||
| icon = | |||
| content = | |||
| background-content-color = #f8f9fa | |||
| style = | |||
| link = | |||
}}</pre> | |||
== Parameters == | |||
<templatedata> | |||
{ | |||
"params": { | |||
"title": { | |||
"label": "Title", | |||
"description": "Title of the box.", | |||
"example": "Tag water", | |||
"type": "string", | |||
"required": true | |||
}, | |||
"content": { | |||
"label": "Content", | |||
"description": "Content of the box.", | |||
"example": "Content text", | |||
"type": "content", | |||
"required": true | |||
}, | |||
"link": { | |||
"label": "Link", | |||
"description": "Title of the wiki page to edit the content.", | |||
"example": "Map_Features", | |||
"type": "wiki-page-name", | |||
"suggested": true | |||
}, | |||
"icon": { | |||
"label": "Icon", | |||
"description": "Name of the file for icon.", | |||
"example": "Circle-icons-chat.svg", | |||
"type": "wiki-file-name" | |||
}, | |||
"title-color": { | |||
"label": "Title color", | |||
"description": "Hexadecimal color code of the title text.", | |||
"example": "#339966", | |||
"type": "string", | |||
"default": "#FFFFFF" | |||
}, | |||
"style": { | |||
"label": "Style", | |||
"description": "Additional CSS style for the container.", | |||
"example": "flex: 1 1 20em;", | |||
"type": "string" | |||
}, | |||
"link-color": { | |||
"label": "Link color", | |||
"description": "Hexadecimal color code of the Modify link.", | |||
"example": "#339966", | |||
"type": "string", | |||
"default": "#999999" | |||
}, | |||
"background-title-color": { | |||
"label": "Title background color", | |||
"description": "Hexadecimal color code of the title bar background.", | |||
"example": "#447FF5", | |||
"type": "string", | |||
"default": "#339966", | |||
"suggested": true | |||
}, | |||
"background-content-color": { | |||
"label": "Content background color", | |||
"description": "Hexadecimal color code of the box content background.", | |||
"example": "#339966", | |||
"type": "string", | |||
"default": "#F8F9FA" | |||
}, | |||
"view-text": { | |||
"description": "Default title: edit, can be changed", | |||
"default": "edit" | |||
}, | |||
"titre-couleur-fond-hover": { | |||
"label": "Title background color on hover", | |||
"description": "When hovering with the mouse, changes the background color of the title.", | |||
"default": "{{{titre-couleur-fond}}}" | |||
}, | |||
"flex": { | |||
"label": "Flex", | |||
"description": "Integration in the grid of the dynamic column/line. The first number indicates the proportion to which the box can expand, the second to which it can shrink, the third the minimum width in px/em of the box", | |||
"example": "1 1 25em", | |||
"type": "string", | |||
"default": "0 1 auto" | |||
}, | |||
"center": { | |||
"label": "Center the title", | |||
"description": "If filled, allows to center the title." | |||
} | |||
}, | |||
"description": "Colored box for content presentation.", | |||
"paramOrder": [ | |||
"title", | |||
"content", | |||
"link", | |||
"background-title-color", | |||
"icon", | |||
"title-color", | |||
"style", | |||
"link-color", | |||
"background-content-color", | |||
"view-text", | |||
"titre-couleur-fond-hover", | |||
"flex", | |||
"center" | |||
], | |||
"format": "block" | |||
} | |||
</templatedata> | |||
== Exemple == | |||
* <code><nowiki> | |||
{{Colored box | |||
| title = Wikidata Query Builder | |||
| title-color = #000 | |||
| background-title-color = #D33F00 | |||
| icon = | |||
| content = Lorem Ipsum | |||
| background-content-color = #f8f9fa | |||
| link = Wikidata:Query Builder | |||
}} | |||
</nowiki></code> | |||
{{Colored box | |||
| title = Wikidata Query Builder | |||
| title-color = #000 | |||
| background-title-color = #D33F00 | |||
| icon = | |||
| content = Lorem Ipsum | |||
| background-content-color = #f8f9fa | |||
| link = Wikidata:Query Builder | |||
}} | |||
* <code><nowiki> | |||
{{Colored box | |||
| title = Box name | |||
| title-color = #000 | |||
| background-title-color = #eaecf0 | |||
| icon = | |||
| content = | |||
| background-content-color = #f8f9fa | |||
| link = | |||
}} | |||
</nowiki></code> | |||
{{Colored box | |||
| title = Box name | |||
| title-color = #000 | |||
| background-title-color = #eaecf0 | |||
| icon = | |||
| content = | |||
| background-content-color = #f8f9fa | |||
| link = | |||
}} | |||
== See also == | |||
* [[Template:Colored bar]] | |||
* [[Template:Colorbar]] | |||
* [[Template:Begin colored insert]] | |||
* [[Template:End insert]] | |||
* [[Template:Clickable button]] | |||
* [[Template:Code rendered]] | |||
</noinclude> | </noinclude> |
Revision as of 15:18, 11 April 2024
DOCUMENTATION
Usage
Allow to insert a modern box.
For the box to continue to the bottom you must use the argument « | flex = 1 1 auto
»
Syntax
Reduced Syntax
{{Colored box | title = | title-color = #000 | background-title-color = #eaecf0 | icon = | content = | background-content-color = #f8f9fa | link = }}
Complete syntax
{{Colored box | title = | title-color = #000 | background-title-color = #eaecf0 | icon = | content = | background-content-color = #f8f9fa | style = | link = }}
Parameters
Colored box for content presentation.
Parameter | Description | Type | Status | |
---|---|---|---|---|
Title | title | Title of the box.
| String | required |
Content | content | Content of the box.
| Content | required |
Link | link | Title of the wiki page to edit the content.
| Page name | suggested |
Title background color | background-title-color | Hexadecimal color code of the title bar background.
| String | suggested |
Icon | icon | Name of the file for icon.
| File | optional |
Title color | title-color | Hexadecimal color code of the title text.
| String | optional |
Style | style | Additional CSS style for the container.
| String | optional |
Link color | link-color | Hexadecimal color code of the Modify link.
| String | optional |
Content background color | background-content-color | Hexadecimal color code of the box content background.
| String | optional |
view-text | view-text | Default title: edit, can be changed
| Unknown | optional |
Title background color on hover | titre-couleur-fond-hover | When hovering with the mouse, changes the background color of the title.
| Unknown | optional |
Flex | flex | Integration in the grid of the dynamic column/line. The first number indicates the proportion to which the box can expand, the second to which it can shrink, the third the minimum width in px/em of the box
| String | optional |
Center the title | center | If filled, allows to center the title. | Unknown | optional |
Exemple
{{Colored box | title = Wikidata Query Builder | title-color = #000 | background-title-color = #D33F00 | icon = | content = Lorem Ipsum | background-content-color = #f8f9fa | link = Wikidata:Query Builder }}
{{Colored box | title = Box name | title-color = #000 | background-title-color = #eaecf0 | icon = | content = | background-content-color = #f8f9fa | link = }}