Menú alternativo
Menú alternativo personal
No has accedido
Tu dirección IP será visible si haces alguna edición

Diferencia entre revisiones de «Plantilla:Mensaje/uso»

De Wikimedia Small Projects
Página creada con «{{T|MessageBox}} is a template for creating message boxes. It is highly customizable with classes, inline styles, and provided CSS selectors. Optional features such as an image, left border, right-side text (for e.g. shortcuts), and a dismiss function. It uses the Lua templating language, and more information can be found on the Global Lua Module page. This version is modified to produce a starter style, based on the…»
 
Sin resumen de edición
 
(No se muestran 2 ediciones intermedias del mismo usuario)
Línea 1: Línea 1:
{{T|MessageBox}} is a template for creating message boxes.
Esta plantilla es para crear avisos de mantenimiento. Es usada para crear una ''caja de mensaje''.


It is highly customizable with classes, inline styles, and provided CSS selectors. Optional features such as an image, left border, right-side text (for e.g. shortcuts), and a dismiss function.
Esta versión está basada en el [https://dev.fandom.com/wiki/mediawiki:Global_Lua_Modules/Mbox.css estilo básico del módulo en Fandom].
 
It uses the [[Help:Lua|Lua templating language]], and more information can be found [[w:c:dev:Global_Lua_Modules/Mbox|on the Global Lua Module page]]. This version is modified to produce a starter style, based on the [[w:c:dev:mediawiki:Global Lua Modules/Mbox.css|basic style from the module]]. To use the full capabilities of this module and remove the default styling, remove the indicated portions of [[Module:Mbox]].
 
'''For a traditional wikitext version of this template, see [[w:c:templates:Template:Ambox|Ambox on Templates Wiki]]'''.


==Parameters==
==Parameters==
Línea 85: Línea 81:
| —
| —
|}
|}
==Design==
Some communities may wish to customize the appearance of the mboxes. The most common styling options are provided illustrated in CSS.
<syntaxhighlight lang="css" class="mw-collapsible mw-collapsed">
.mbox {
    /* the background of the entire box */;
    background-color: ;
    /* the border color of the entire box */
    border-color: ;
    /* the border thickness of the entire box */
    border-width: ;
    /* the default thick left border color; note this can be changed from within the template implementations using the "color" parameter */
    border-left-color: ;
    /* the rounded-ness of the corners */;
    border-radius: ;
    /* the baseline font-size of the mbox */
    font-size: ;
}
.mbox__content {
    /* the padding inside the mbox */
    padding: ;
}
.mbox__content__image {
    /* the minimum width of the mbox's image (if bigger, use the "imagewidth" parameter in the template) */
    width: ;
    /* the spacing to the left of the text (i.e., the right of the image) */
    padding-right: ;
}
.mbox__content__text__comment {
    /* the size of the text in the "comment" parameter */
    font-size: ;
}
.mbox__content__aside {
    /* any particular modifications to the "aside" area can go here */
    /* the maximum width of the aside area */
    width: ;
}
.mbox__close {
    /* the appearance of the close symbol here */
}
.mbox__close:after {
    /* overwrite "content" here if you do not wish for the close symbol to be × */
    content: '';
}
.mw-collapsed + .mbox__close {
  /* modifications to the close symbol when the box is closed */
}
.mw-collapsed + .mbox__close:after {
  /* overwrite "content" here if you do not wish for the close symbol to be + when the box is closed */
  content: '';
}
</syntaxhighlight>
; Technical notes
* Additional inline styles to the root <code>.mbox</code> element can be achieved via the <code>style</code> parameter in the template.


== Examples ==
== Examples ==
=== Basic MessageBox ===
=== Basic Mensaje ===
<pre>
<pre>
{{MessageBox
{{Mensaje
|header      = Header text here
|header      = Header text here
|text        = Normal text here
|text        = Normal text here
Línea 187: Línea 112:


<pre>
<pre>
{{MessageBox
{{Mensaje
|header = Header text here
|header = Header text here
|type  = important
|type  = important
Línea 207: Línea 132:
=== With an image ===
=== With an image ===
<pre>
<pre>
{{MessageBox
{{Mensaje
|header    = Header text here
|header    = Header text here
|text      = Normal text here
|text      = Normal text here
|image      = Wiki.png
|image      = Wikisp-logo-icon.svg
|imagelink  = Global Lua Modules
|imagelink  = Global Lua Modules
|imagewidth = 50px
|imagewidth = 50px
Línea 221: Línea 146:
|header    = Header text here
|header    = Header text here
|text      = Normal text here
|text      = Normal text here
|image      = Wiki.png
|image      = Wikisp-logo-icon.svg
|imagelink  = Global Lua Modules
|imagelink  = Global Lua Modules
|imagewidth = 50px
|imagewidth = 50px
Línea 229: Línea 154:
=== With an aside ===
=== With an aside ===
<pre>
<pre>
{{MessageBox
{{Mensaje
|header = Header text here
|header = Header text here
|type  = important
|type  = important
Línea 249: Línea 174:
=== Standard/default style ===
=== Standard/default style ===
<pre>
<pre>
{{MessageBox
{{Mensaje
|header  = Header text here
|header  = Header text here
|text    = Normal text here
|text    = Normal text here
|comment = Comment text here
|comment = Comment text here
|image  = Wiki.png
|image  = Wikisp-logo-icon.svg
|aside  = Aside text here
|aside  = Aside text here
|id      = standard
|id      = standard
Línea 260: Línea 185:
Produces:
Produces:


{{#invoke:Mbox|main|header=Header text here |text=Normal text here |comment=Comment text here |image=Wiki.png |aside=Aside text here |id=standard}}
{{#invoke:Mbox|main|header=Header text here |text=Normal text here |comment=Comment text here |image=Wikisp-logo-icon.svg |aside=Aside text here |id=standard}}

Revisión actual - 01:52 2 nov 2023

Esta plantilla es para crear avisos de mantenimiento. Es usada para crear una caja de mensaje.

Esta versión está basada en el estilo básico del módulo en Fandom.

Parameters

For examples of how to use these parameters, see #Examples.

Parameter name Description Required? Default
class Additional classes to the root .mbox element. No
bordercolor The color of the thick left-most border. No Stylesheet default
type Type of mbox as declared as in CSS with variables. Affects color of the thick left-most border. See #Using types. No
bgcolor The color of the mbox's background. No Stylesheet default
style Additional inline styles to the root .mbox element. No
image An image to be added to the left of all text content. No
imagewidth The width of the image (height automatically adjusts). No 60px
imagelink The link to which the image points (could link to the relevant maintenance category, per example). If not included, the image will be un-clickable. No
header The header (bold text placed at the top). This is typically used to very briefly explain the subject of the mbox itself, as when the mbox is closed, only the header will show. No
text Non-bold text placed below the header, typically used to explain the subject of the mbox in further or additional detail. When the mbox is closed, this text will be hidden. No
comment Smaller non-bold text placed below the main text, typically used to add additional links or context about the notice. When the mbox is closed, this text will be hidden. No
aside Text placed within a small allocation on the right side separated by a light gray border. Most commonly used to show shortcuts to the page in question (such as on policy pages). When the mbox is closed, this text will be hidden. No
id By default, one close button will close all mboxes on the page. However, to change this, this parameter may be used, given as the name of the mbox implementation (e.g., "Template:Cleanup" would have |id=cleanup). No
collapsed By default, the mbox will be uncollapsed, and the full contents will be shown. However, to change this, this parameter may be used to set an mbox as collapsed by default (e.g., |collapsed=true would set the mbox to be collapsed by default). No

Examples

Basic Mensaje

{{Mensaje
|header      = Header text here
|text        = Normal text here
|id          = test1
}}

Produces:

Header text here
Normal text here

Using types

To use types, CSS variables must be added, such as:

:root {
    --type-important: rgba(200, 0, 0, 0.8);
    --type-moderate: rgba(233, 124, 47, 0.8);
    --type-minor: rgba(241, 197, 37, 0.8);
}

If added:

{{Mensaje
|header = Header text here
|type   = important
|text   = Normal text here
|id     = test2
}}

Produces:

Header text here
Normal text here

Depending on your styling, there may not be a visual difference in the above example.

With an image

{{Mensaje
|header     = Header text here
|text       = Normal text here
|image      = Wikisp-logo-icon.svg
|imagelink  = Global Lua Modules
|imagewidth = 50px
|id         = test3
}}

Produces:

Header text here
Normal text here

With an aside

{{Mensaje
|header = Header text here
|type   = important
|text   = Normal text here
|aside  = Aside text here
|id     = test4
}}

Produces:

Header text here
Normal text here
Aside text here

Standard/default style

{{Mensaje
|header  = Header text here
|text    = Normal text here
|comment = Comment text here
|image   = Wikisp-logo-icon.svg
|aside   = Aside text here
|id      = standard
}}

Produces:

Header text here
Normal text here
Comment text here
Aside text here