Difference between revisions of "Minecraft Wiki:Sandbox"

From Minecraft Wiki
Jump to: navigation, search
(Undo revision 1856576 by BDJP007301 (talk) Restored)
Tag: Undo
m (Undo revision 1856617 by Android 1123581321 (talk) read the header first)
Tags: Replaced, Undo
Line 6: Line 6:
 
* Feel free to try your editing skills below *
 
* Feel free to try your editing skills below *
 
-->
 
-->
 
=CSS=
 
== Gradients ==
 
=== Linear gradients ===
 
{|
 
| <div style=" border:1px black solid; border-radius: 10px; color: white; background-image: linear-gradient(red, yellow); margin: 5px; height: 100px; width: 100px">
 
From red at top to yellow at bottom
 
</div>
 
| <div style=" border:1px black solid; border-radius: 10px; color: black; background-image: linear-gradient(to right, yellow, cyan); margin: 5px; height: 100px; width: 100px">
 
From yellow at left to cyan at right
 
</div>
 
| <div style=" border:1px black solid; border-radius: 10px; color: white; background-image: linear-gradient(to bottom left, blue, lime); margin: 5px; height: 100px; width: 100px">
 
From blue at top right to green at bottom left
 
</div>
 
| <div style=" border:1px black solid; border-radius: 10px; color: white; background-image: linear-gradient(112deg, red, cyan); margin: 5px; height: 100px; width: 100px">
 
From red at top left to cyan at bottom right, at 112<sup>o</sup>
 
</div>
 
| <div style=" border:1px black solid; border-radius: 10px; color: black; background-image: linear-gradient(yellow, cyan, magenta); margin: 5px; height: 100px; width: 100px">
 
From yellow at top to cyan at middle to magenta at bottom
 
</div>
 
| <div style=" border:1px black solid; border-radius: 10px; color: black; background-image: linear-gradient(to right, yellow 0%, lime 60%, pink 100%); margin: 5px; height: 100px; width: 100px">
 
From yellow at left to green at middle (60%) to pink at right
 
</div>
 
| <div style=" border:1px black solid; border-radius: 10px; color: black; background-image: repeating-linear-gradient(yellow 0%, magenta 25%); margin: 5px; height: 100px; width: 100px">
 
From yellow at top and magenta at bottom, repeated 4 times
 
</div>
 
|}
 
 
=== Radial gradients ===
 
 
{|
 
| <div style=" border:1px black solid; border-radius: 10px; color: white; background-image: radial-gradient(red, yellow); margin: 5px; height: 81px; width: 144px">
 
From red at centre to yellow at edges
 
</div>
 
| <div style=" border:1px black solid; border-radius: 10px; color: white; background-image: radial-gradient(blue, magenta, red); margin: 5px; height: 81px; width: 144px">
 
From blue at centre to magenta to red at edges
 
</div>
 
| <div style=" border:1px black solid; border-radius: 10px; color: black; background-image: radial-gradient(gold 0%, magenta 35%, cyan 100%); margin: 5px; height: 81px; width: 144px">
 
From gold at centre to magenta (35%) to cyan at edges
 
</div>
 
| <div style=" border:1px black solid; border-radius: 10px; color: black; background-image: radial-gradient(circle, red, cyan, lime); margin: 5px; height: 81px; width: 144px">
 
From red at centre to cyan to lime at edges, in a circle.
 
</div>
 
| <div style=" border:1px black solid; border-radius: 10px; color: black; background-image: radial-gradient(closest-side at 65% 75%, red, cyan, lime); margin: 5px; height: 81px; width: 144px">
 
From red at centre to cyan to lime at edges, to the closest side at 65% and 75%.
 
</div>
 
|-
 
| <div style=" border:1px black solid; border-radius: 10px; color: black; background-image: radial-gradient(farthest-side at 65% 75%, red, cyan, lime); margin: 5px; height: 81px; width: 144px">
 
From red at centre to cyan to lime at edges, to the farthest side at 65% and 75%.
 
</div>
 
| <div style=" border:1px black solid; border-radius: 10px; color: black; background-image: radial-gradient(closest-corner at 65% 75%, red, cyan, lime); margin: 5px; height: 81px; width: 144px">
 
From red at centre to cyan to lime at edges, to the closest corner at 65% and 75%.
 
</div>
 
| <div style=" border:1px black solid; border-radius: 10px; color: black; background-image: radial-gradient(farthest-corner at 65% 75%, red, cyan, lime); margin: 5px; height: 81px; width: 144px">
 
From red at centre to cyan to lime at edges, to the farthest corner at 65% and 75%.
 
</div>
 
|}
 
 
== Borders ==
 
Borders are made using <code>border{-Position (optional)}: {Weight} {Color} {Type};</code>
 
=== Weights ===
 
{| class="wikitable"
 
|+Borders
 
! Weight
 
! Example
 
|-
 
| {{frac|1|4}}px
 
| <div style=" border:0.25px black solid; border-radius: 10px; background: white; margin: 5px; height: 100px; width: 100px"></div>
 
|-
 
| {{frac|1|2}}px
 
| <div style=" border:0.5px black solid; border-radius: 10px; background: white; margin: 5px; height: 100px; width: 100px"></div>
 
|-
 
| {{frac|3|4}}px
 
| <div style=" border:0.75px black solid; border-radius: 10px; background: white; margin: 5px; height: 100px; width: 100px"></div>
 
|-
 
| 1px
 
| <div style=" border:1px black solid; border-radius: 10px; background: white; margin: 5px; height: 100px; width: 100px"></div>
 
|-
 
| 1{{frac|1|2}}px
 
| <div style=" border:1.5px black solid; border-radius: 10px; background: white; margin: 4px; height: 100px; width: 100px"></div>
 
|-
 
| 2px
 
| <div style=" border:2px black solid; border-radius: 10px; background: white; margin: 4px; height: 100px; width: 100px"></div>
 
|-
 
| 3px
 
| <div style=" border:3px black solid; border-radius: 10px; background: white; margin: 4px; height: 100px; width: 100px"></div>
 
|-
 
| 4px
 
| <div style=" border:4px black solid; border-radius: 10px; background: white; margin: 3px; height: 100px; width: 100px"></div>
 
|-
 
| 5px
 
| <div style=" border:5px black solid; border-radius: 10px; background: white; margin: 3px; height: 100px; width: 100px"></div>
 
|-
 
| 6px
 
| <div style=" border:6px black solid; border-radius: 10px; background: white; margin: 3px; height: 100px; width: 100px"></div>
 
|-
 
| 8px
 
| <div style=" border:8px black solid; border-radius: 10px; background: white; margin: 2px; height: 100px; width: 100px"></div>
 
|-
 
| 10px
 
| <div style=" border:10px black solid; border-radius: 10px; background: white; margin: 2px; height: 100px; width: 100px"></div>
 
|-
 
| 12px
 
| <div style=" border:12px black solid; border-radius: 10px; background: white; margin: 2px; height: 100px; width: 100px"></div>
 
|-
 
| 16px
 
| <div style=" border:16px black solid; border-radius: 10px; background: white; margin: 1px; height: 100px; width: 100px"></div>
 
|-
 
| 24px
 
| <div style=" border:24px black solid; border-radius: 10px; background: white; margin: 1px; height: 100px; width: 100px"></div>
 
|-
 
| 32px
 
| <div style=" border:32px black solid; border-radius: 10px; background: white; margin: 0px; height: 100px; width: 100px"></div>
 
|-
 
| 48px
 
| <div style=" border:48px black solid; border-radius: 10px; background: white; margin: 0px; height: 100px; width: 100px"></div>
 
|}
 
 
=== Types ===
 
Based on 3 px, grey
 
{| class="wikitable"
 
|+Borders
 
! Type
 
! Example
 
|-
 
| dotted
 
| <div style=" border:3px gray dotted; border-radius: 10px; background: white; margin: 5px; height: 100px; width: 100px"></div>
 
|-
 
| dashed
 
| <div style=" border:3px gray dashed; border-radius: 10px; background: white; margin: 5px; height: 100px; width: 100px"></div>
 
|-
 
| solid
 
| <div style=" border:3px gray solid; border-radius: 10px; background: white; margin: 5px; height: 100px; width: 100px"></div>
 
|-
 
| double
 
| <div style=" border:3px gray double; border-radius: 10px; background: white; margin: 5px; height: 100px; width: 100px"></div>
 
|-
 
| groove
 
| <div style=" border:3px gray groove; border-radius: 10px; background: white; margin: 5px; height: 100px; width: 100px"></div>
 
|-
 
| ridge
 
| <div style=" border:3px gray ridge; border-radius: 10px; background: white; margin: 5px; height: 100px; width: 100px"></div>
 
|-
 
| inset
 
| <div style=" border:3px gray inset; border-radius: 10px; background: white; margin: 5px; height: 100px; width: 100px"></div>
 
|-
 
| outset
 
| <div style=" border:3px gray outset; border-radius: 10px; background: white; margin: 5px; height: 100px; width: 100px"></div>
 
|}
 
 
=== Position ===
 
Based on 1 px, black
 
{| class="wikitable"
 
|+Borders
 
! Position
 
! Example
 
|-
 
| Top
 
| <div style=" border-top:1px black solid; background: white; margin: 5px; height: 100px; width: 100px"></div>
 
|-
 
| Bottom
 
| <div style=" border-bottom:1px black solid; background: white; margin: 5px; height: 100px; width: 100px"></div>
 
|-
 
| Left
 
| <div style=" border-left:1px black solid; background: white; margin: 5px; height: 100px; width: 100px"></div>
 
|-
 
| Right
 
| <div style=" border-right:1px black solid; background: white; margin: 5px; height: 100px; width: 100px"></div>
 
|}
 
 
== Sizes ==
 
{| class="wikitable"
 
|+Size
 
! Size
 
! Horzional
 
! Vertical
 
|-
 
| 10x5px
 
| <div style=" border:1px black solid; border-radius: 1px; background: white; margin: 5px; height: 5px; width: 10px"></div>
 
| <div style=" border:1px black solid; border-radius: 1px; background: white; margin: 5px; height: 10px; width: 5px"></div>
 
|-
 
| 20x15px
 
| <div style=" border:1px black solid; border-radius: 3px; background: white; margin: 5px; height: 15px; width: 20px"></div>
 
| <div style=" border:1px black solid; border-radius: 3px; background: white; margin: 5px; height: 20px; width: 15px"></div>
 
|-
 
| 40x30px
 
| <div style=" border:1px black solid; border-radius: 5px; background: white; margin: 5px; height: 30px; width: 40px"></div>
 
| <div style=" border:1px black solid; border-radius: 5px; background: white; margin: 5px; height: 40px; width: 30px"></div>
 
|-
 
| 100x60px
 
| <div style=" border:1px black solid; border-radius: 10px; background: white; margin: 5px; height: 60px; width: 100px"></div>
 
| <div style=" border:1px black solid; border-radius: 10px; background: white; margin: 5px; height: 100px; width: 60px"></div>
 
|-
 
| 160x90px
 
| <div style=" border:1px black solid; border-radius: 10px; background: white; margin: 5px; height: 90px; width: 160px"></div>
 
| <div style=" border:1px black solid; border-radius: 10px; background: white; margin: 5px; height: 160px; width: 90px"></div>
 
|-
 
| 240x150px
 
| <div style=" border:1px black solid; border-radius: 10px; background: white; margin: 5px; height: 150px; width: 240px"></div>
 
| <div style=" border:1px black solid; border-radius: 10px; background: white; margin: 5px; height: 240px; width: 150px"></div>
 
|-
 
| 320x200px
 
| <div style=" border:1px black solid; border-radius: 10px; background: white; margin: 5px; height: 200px; width: 320px"></div>
 
| <div style=" border:1px black solid; border-radius: 10px; background: white; margin: 5px; height: 320px; width: 200px"></div>
 
|-
 
| 512x320px
 
| <div style=" border:1px black solid; border-radius: 10px; background: white; margin: 5px; height: 320px; width: 512px"></div>
 
| <div style=" border:1px black solid; border-radius: 10px; background: white; margin: 5px; height: 512px; width: 320px"></div>
 
|}
 
 
{{DISPLAYTITLE:Sandbox}}
 

Revision as of 12:28, 24 February 2021

Minecraft Wiki Sandbox
[Expand/Collapse]
[Purge]
Minecraft Wiki:SandboxTemplate:SandboxModule:Sandbox
Shortcut

This is the Minecraft Wiki sandbox. You can experiment with making edits on this page. To edit this page, click the "Edit" tab (or the pencil button in mobile view) at the top of the page, or click here. After making your changes, you can preview them by clicking the "Show preview" button below the edit box, and save them by clicking the "Save page" button in the same place.

Note that changes made here are not kept, since this page is only meant for testing. If you have an account and are logged in, you can create subpages of this page (e.g. Minecraft Wiki:Sandbox/Temporary testing page) for longer-term projects, though these may still be deleted after a period of inactivity. Additionally, if you're registered, you can create a personal sandbox in your userspace where you can experiment without worrying that your changes will be wiped.