Template:Box begin

From WisdomWiki
Jump to navigation Jump to search
Icons oxygen 48x48 actions view-pim-notes.png


Parameters[edit source]

  • type= error|information|warning|tag|tip|download
    Default is note.
    tip and note have a "tip|note" label in the first line; to replace it use label=foo. Use nolabel=true to disable it.
  • shadow= yes|no
    Default is no
  • border-style=
    CSS definition of border-style property.
    Default is solid
    To disable set it to none.
  • width= anything css understands (px, %, em)
    Default is nothing which sets width to 100% of the parent.
  • display=
    CSS definition of display property.
    Default is <not defined>.
  • margin=
    Default is margin-top: 1.5em.
  • nolabel= true|false
    Default is false

You also need Template:Box end.

Types and examples[edit source]

Default[edit source]

Default if no type was given is note but without a possibilty to set a label.

 {{Box begin}}Default{{Box end}}
Icons oxygen 48x48 actions view-pim-notes.png
Default


Warning[edit source]

 {{Box|type=warning|border-style=none|shadow=yes}}Warning{{Box end}}
Icons oxygen 48x48 status task-attention.png
Warning


Information[edit source]

 {{Box begin|type=information|display=inline-block}}Information{{Box end}}
Icons oxygen 48x48 status dialog-information.png
Information text foo


Error[edit source]

 {{Box begin|type=error|width=60%}}Here is really much. There is really much text here. There is really much text here. There is really much text here.
There is really much text here. There is really much text here. There is really much text here. There is really much text here. There is really much text here.
There is really much text here. <br />To show you that the this box contains of a left div for<br />the icon and a right div for the content.{{Box end}}
Icons oxygen 48x48 status task-reject.png
Here is really much. There is really much text here. There is really much text here. There is really much text here. There is really much text here. There is really much text here. There is really much text here. There is really much text here. There is really much text here. There is really much text here.
To show you that the this box contains of a left div for
the icon and a right div for the content.


Tag[edit source]

 {{Box begin|type=tag|shadow=yes|width=30%}}old colors: | error = #EF8B73 | information = #B1D0DE | warning = #FFD39F | tag = #DBDEDF | note = #FFF295 | tip = #FFF2B5 | download = #D6EFC2 | #FFF295 {{Box end}}
Icons oxygen 48x48 status mail-tagged.png
Tag


Note[edit source]

 {{Box begin|type=note|border-style=dotted}}Note{{Box end}}
Icons oxygen 48x48 actions view-pim-notes.png
Note:
Note text foo bar


Tip[edit source]

 {{Box begin|type=tip|width=20em}}Tip{{Box end}}
Icons oxygen 48x48 apps ktip.png
Tip:
Tip


 {{Box begin|type=tip|width=20em|label=TESTBAL}}Tip{{Box end}}
Icons oxygen 48x48 apps ktip.png
TESTBAL
Tip


 {{Box begin|type=tip|width=20em|nolabel=true}}Tip{{Box end}}
Icons oxygen 48x48 apps ktip.png
Tip


Download[edit source]

 {{Box begin|type=download}}Download{{Box end}}
Icons oxygen 48x48 devices drive-harddisk.png
Download


Side by side[edit source]

 {{Box begin|type=download|display=inline-block}}Download{{Box end}}
{{Box begin|type=error|border-style=dotted|display=inline-block|margin=0 5em 0 5em}}Error<br />''margin=0 5em 0 5em''{{Box end}}
{{Box begin|type=information|width=150px|display=inline-block}}Information{{Box end}}
Icons oxygen 48x48 devices drive-harddisk.png
Download
Icons oxygen 48x48 status task-reject.png
Error
margin=0 5em 0 5em
Icons oxygen 48x48 status dialog-information.png
Information


Minimal width[edit source]

To not have the width of 100% use also display:inline-block;.

Icons oxygen 48x48 devices drive-harddisk.png
Download text example foo