 |
{{{ text}}} |
Happy-melon's sandbox for {{tmbox}}
Here Happy-melon is testing and showing new code versions. Please do not edit this page. If you want to experiment do so in {{tmbox/sandbox}} or create your own subpage under {{tmbox}} or in your own user space.
The box above is template code on this page, the boxes below are transclusions of this page and show how that code renders when the box is stacked. If you anyway have updated the code above then you have to purge this page to see the effect on the examples below.
 |
delete |
 |
content, lots of text lots of text lots of text lots of text lots of text lots of text lots of text lots of text lots of text |
 |
style, lots of text lots of text lots of text lots of text lots of text lots of text lots of text lots of text lots of text |
|
notice, lots of text lots of text lots of text lots of text lots of text lots of text lots of text lots of text lots of text |
 |
 |
move |
 |
protection |
Some text just to test bottom margin.
Special
Some other parameter combinations.
|
No type and no image given (default) |
|
No type and image=none – No image is used and the text uses the whole message box area. |
|
image = |
 |
Trying large left side image. - lots of text lots of text lots of text lots of text lots of text lots of text lots of text lots of text lots of text |
|
Trying large left and right side image. - lots of text lots of text lots of text lots of text lots of text lots of text lots of text lots of text lots of text |
Parameters
List of all parameters:
{{tmbox/test2
| type = speedy / delete / content / style / notice / move / protection
| image = none / [[Image:Some image.svg|40px]]
| imageright = [[Image:Some image.svg|40px]]
| style = CSS value
| textstyle = CSS value
| text = The message body text.
| small = yes
| smallimage = none / [[Image:Ssom image.svg|30px]]
| smallimageright = none / [[Image:Some image.svg|30px]]
| smalltext = A shorter message body text.
}}
Examples of varying width
These examples were copied from the ombox, so their images and texts might seem strange. But we are just testing image cell widths here.
 |
This page documents an English Wikipedia guideline. It is a generally accepted standard that editors should follow, though it should be treated with common sense and the occasional exception. When editing this page, please ensure that your revision reflects consensus. When in doubt, discuss on the talk page. |
 |
The following is a proposed Wikipedia policy, guideline, or process.
The proposal may still be in development, under discussion, or in the process of gathering consensus for adoption. Thus references or links to this page should not describe it as "policy". |
 |
This page is a how-to guide detailing a practice or process on the English Wikipedia. |
Small message boxes
 |
type = notice, small = yes, no image set. |
|
type = notice, small = yes, image = [[Image:Imbox notice.png|40x40px]] |
|
type = notice, small = yes, image = [[Image:Imbox notice.png|30x30px]], imageright = [[Image:Nuvola apps bookcase.png|30x30px]] |
 |
type = notice, small = yes, image = [[Image:Information icon4.svg|30x30px]], imageright = [[Image:Nuvola apps bookcase.png|30x30px]] |
 |
type = style, small = yes, no image set. |
|
type = style, small = yes, image = [[Image:Imbox style.png|40x40px]] |
| 30x30px |
type = style, small = yes, image = [[Image:Broom icon.svg|30x30px]] |
|
type = notice, small = yes, image = none |
The small talkpage message boxes to the right use different images. Some use the 40px png images with optimised background, which makes their background look right even in some older web browsers. When those png images get rescaled to 30px they loose their optimised background and get somewhat blurred. For comparison some of the boxes to the right use the svg versions instead which doesn't get as blurred when scaled to 30px. If we decide to use 30px images for the small boxes then we perhaps should make a set of 30px png images with optimised background or perhaps use the svg images. But the blurring is really only noticeable in low screen resolutions so most users will never see a difference, and the old browsers that need the optimised background are not used much anymore, so we can probably use the rescaled png images as is for the small boxes. Since that means the simplest code for the template.
Some text to test box flow:
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Curabitur pretium tincidunt lacus. Nulla gravida orci a odio. Nullam varius, turpis et commodo pharetra, est eros bibendum elit, nec luctus magna felis sollicitudin mauris. Integer in mauris eu nibh euismod gravida. Duis ac tellus et risus vulputate vehicula. Donec lobortis risus a elit. Etiam tempor. Ut ullamcorper, ligula eu tempor congue, eros est euismod turpis, id tincidunt sapien risus a quam. Maecenas fermentum consequat mi. Donec fermentum. Pellentesque malesuada nulla a mi. Duis sapien sem, aliquet nec, commodo eget, consequat quis, neque. Aliquam faucibus, elit ut dictum aliquet, felis nisl adipiscing sapien, sed malesuada diam lacus eget erat. Cras mollis scelerisque nunc. Nullam arcu. Aliquam consequat. Curabitur augue lorem, dapibus quis, laoreet et, pretium ac, nisi. Aenean magna nisl, mollis quis, molestie eu, feugiat in, orci. In hac habitasse platea dictumst.
Fusce convallis, mauris imperdiet gravida bibendum, nisl turpis suscipit mauris, sed placerat ipsum urna sed risus. In convallis tellus a mauris. Curabitur non elit ut libero tristique sodales. Mauris a lacus. Donec mattis semper leo. In hac habitasse platea dictumst. Vivamus facilisis diam at odio. Mauris dictum, nisi eget consequat elementum, lacus ligula molestie metus, non feugiat orci magna ac sem. Donec turpis. Donec vitae metus. Morbi tristique neque eu mauris. Quisque gravida ipsum non sapien. Proin turpis lacus, scelerisque vitae, elementum at, lobortis ac, quam. Aliquam dictum eleifend risus. In hac habitasse platea dictumst. Etiam sit amet diam. Suspendisse odio. Suspendisse nunc. In semper bibendum libero.
Testing box flow
|
Box 1: type = notice, no small set, no image set. |
|
Box 2: type = notice, small = yes, no image set. |
|
Box 3: type = style, small = yes, no image set. |
|
Box 4: type = notice, no small set, no image set. |
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Curabitur pretium tincidunt lacus. Nulla gravida orci a odio. Nullam varius, turpis et commodo pharetra, est eros bibendum elit, nec luctus magna felis sollicitudin mauris. Integer in mauris eu nibh euismod gravida. Duis ac tellus et risus vulputate vehicula. Donec lobortis risus a elit. Etiam tempor. Ut ullamcorper, ligula eu tempor congue, eros est euismod turpis, id tincidunt sapien risus a quam. Maecenas fermentum consequat mi. Donec fermentum. Pellentesque malesuada nulla a mi. Duis sapien sem, aliquet nec, commodo eget, consequat quis, neque. Aliquam faucibus, elit ut dictum aliquet, felis nisl adipiscing sapien, sed malesuada diam lacus eget erat. Cras mollis scelerisque nunc. Nullam arcu. Aliquam consequat. Curabitur augue lorem, dapibus quis, laoreet et, pretium ac, nisi. Aenean magna nisl, mollis quis, molestie eu, feugiat in, orci. In hac habitasse platea dictumst.
Testing smallimage, smallimageright and smalltext
|
Smalltext: no image set, small = yes, smalltext set. |
 |
image = [[Image:Nuvola apps bookcase.png|40px]] |
 |
image = none, smallimage = [[Image:Nuvola apps bookcase.png|30px]] |
|
smallimage = [[Image:Nuvola apps bookcase.png|30px]] |
|
imageright = none, smallimageright = [[Image:Nuvola apps bookcase.png|30px]] |
|
imageright = [[Image:Nuvola apps bookcase.png|40px]], smallimageright = none |
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Curabitur pretium tincidunt lacus. Nulla gravida orci a odio. Nullam varius, turpis et commodo pharetra, est eros bibendum elit, nec luctus magna felis sollicitudin mauris. Integer in mauris eu nibh euismod gravida. Duis ac tellus et risus vulputate vehicula. Donec lobortis risus a elit. Etiam tempor. Ut ullamcorper, ligula eu tempor congue, eros est euismod turpis, id tincidunt sapien risus a quam. Maecenas fermentum consequat mi. Donec fermentum. Pellentesque malesuada nulla a mi. Duis sapien sem, aliquet nec, commodo eget, consequat quis, neque. Aliquam faucibus, elit ut dictum aliquet, felis nisl adipiscing sapien, sed malesuada diam lacus eget erat. Cras mollis scelerisque nunc. Nullam arcu. Aliquam consequat. Curabitur augue lorem, dapibus quis, laoreet et, pretium ac, nisi. Aenean magna nisl, mollis quis, molestie eu, feugiat in, orci. In hac habitasse platea dictumst.
Fusce convallis, mauris imperdiet gravida bibendum, nisl turpis suscipit mauris, sed placerat ipsum urna sed risus. In convallis tellus a mauris. Curabitur non elit ut libero tristique sodales. Mauris a lacus. Donec mattis semper leo. In hac habitasse platea dictumst. Vivamus facilisis diam at odio. Mauris dictum, nisi eget consequat elementum, lacus ligula molestie metus, non feugiat orci magna ac sem. Donec turpis. Donec vitae metus. Morbi tristique neque eu mauris. Quisque gravida ipsum non sapien. Proin turpis lacus, scelerisque vitae, elementum at, lobortis ac, quam. Aliquam dictum eleifend risus. In hac habitasse platea dictumst. Etiam sit amet diam. Suspendisse odio. Suspendisse nunc. In semper bibendum libero.
