Difference between revisions of "Template:RBX"
Jump to navigation
Jump to search
(tinkering) |
(Listing defaults in documentation) |
||
| (14 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
| − | border:1px {{{border|# | + | <includeonly>border:1px {{{border|#53565A}}} solid; background-color:{{{legacy|#D9D9D6}}}; background:{{{legacy|#D9D9D6}}}; background:-moz-linear-gradient(top,{{{topcolor|#D9D9D6}}} 6%, {{{botcolor|#FFFFFF}}} 88%); background:-webkit-gradient(linear,left top,left bottom,color-stop(6%,{{{topcolor|#D9D9D6}}}), color-stop(88%,{{{botcolor|#FFFFFF}}})); background: -webkit-linear-gradient(top, {{{topcolor|##D9D9D6}}} 6%, {{{botcolor|#FFFFFF}}} 88%); background:-o-linear-gradient(top, {{{topcolor|#DFDFDF}}} 6%, {{{botcolor|#FFFFFF}}} 88%); background:-ms-linear-gradient(top, {{{topcolor|#D9D9D6}}} 6%, {{{botcolor|#FFFFFF}}} 88%); background:linear-gradient(top, {{{topcolor|#D9D9D6}}} 6%, {{{botcolor|#FFFFFF}}} 88%); -moz-border-radius:{{{radius|1em}}}; -khtml-border-radius:{{{radius|1em}}}; -opera-border-radius:{{{radius|1em}}}; border-radius:{{{radius|1em}}}; -webkit-border-radius: {{{webkit|1em}}}; -webkit-box-shadow:0.5em 0.5em 1em #000000; -moz-box-shadow: 0.5em 0.5em 1em #000000; box-shadow: 0.5em 0.5em 1em #000000; </includeonly><noinclude> |
| − | background:{{{legacy|# | + | |
| − | background | + | CSS styling template. Place inside a style attribute. |
| − | background: -moz-linear-gradient(top, {{{topcolor|# | + | |
| − | 88%); | + | Draws a rounded box with a 1px border and a gradient with a shadow. |
| − | background: -webkit-gradient(linear, left top, left bottom, color-stop(6%,{{{topcolor|# | + | __NOTOC__ |
| − | background: -webkit-linear-gradient(top, {{{topcolor|# | + | ==Settings== |
| − | background: -o-linear-gradient(top, {{{topcolor|#DFDFDF}}} 6%, {{{botcolor|#FFFFFF}}} 88%); | + | *border: border color (Default: Cool Gray 11C) |
| − | background: linear-gradient(top, {{{topcolor|# | + | *legacy: solid background color for non-CSS3 browsers (Default: Cool Gray 1C) |
| − | -moz-border-radius: {{{radius|1em}}}; | + | *topcolor: color at the top of the background gradient (Default: Cool Gray 1C) |
| − | -khtml-border-radius: | + | *botcolor: color at the bottom of the background gradient (Default: white) |
| − | -opera-border-radius: | + | *radius: radius of corners (Default: 1 em) |
| − | border-radius: {{{radius|1em}}}; | + | *webkit: radius of corners for browsers that respond to -webkit-border-radius (Default: 1 em) |
| − | -webkit-border-radius: {{{ | + | |
| − | -webkit-box-shadow: 0.5em 0.5em 1em #000000; | + | Separate Webkit control is a bugfix for an early gradient and rounded corner bug that only affects transitional CSS3 Webkit browsers; try setting to zero or the same as the normal radius. |
| − | -moz-box-shadow: 0.5em 0.5em 1em #000000; | + | |
| − | box-shadow: 0.5em 0.5em 1em #000000; | + | |
| − | - | + | ==Examples== |
| − | < | + | ===Defaults=== |
| + | <DIV style="width: 25em; text-align:center; {{RBX}}"> | ||
| + | '''Taxation<BR/>is<BR/>Theft''' | ||
| + | </DIV> | ||
| + | |||
| + | <TT><PRE><DIV style="width: 25em; text-align:center; {{RBX}}"> | ||
| + | '''Taxation<BR/>is<BR/>Theft''' | ||
| + | </DIV></PRE></TT> | ||
| + | |||
| + | ===Customized=== | ||
| + | <DIV style="width: 25em; text-align:center; {{RBXNS | border=#FF007F | legacy=#DFDFDF | topcolor=#BF7F17 | botcolor=#177FBF | radius=2em | webkit=4em}}"> | ||
| + | '''Taxation<BR/>is<BR/>Theft''' | ||
| + | </DIV> | ||
| + | |||
| + | <TT><PRE><DIV style="width: 25em; text-align:center; {{RBXNS | border=#FF007F | legacy=#DFDFDF | topcolor=#BF7F17 | botcolor=#177FBF | radius=2em | webkit=0}}"> | ||
| + | '''Taxation<BR/>is<BR/>Theft''' | ||
| + | </DIV></PRE></TT> | ||
| + | |||
| + | [[Category:Text Templates]]</noinclude> | ||
Latest revision as of 23:08, 8 August 2017
CSS styling template. Place inside a style attribute.
Draws a rounded box with a 1px border and a gradient with a shadow.
Settings
- border: border color (Default: Cool Gray 11C)
- legacy: solid background color for non-CSS3 browsers (Default: Cool Gray 1C)
- topcolor: color at the top of the background gradient (Default: Cool Gray 1C)
- botcolor: color at the bottom of the background gradient (Default: white)
- radius: radius of corners (Default: 1 em)
- webkit: radius of corners for browsers that respond to -webkit-border-radius (Default: 1 em)
Separate Webkit control is a bugfix for an early gradient and rounded corner bug that only affects transitional CSS3 Webkit browsers; try setting to zero or the same as the normal radius.
Examples
Defaults
Taxation
is
Theft
<DIV style="width: 25em; text-align:center; {{RBX}}">
'''Taxation<BR/>is<BR/>Theft'''
</DIV>
Customized
Taxation
is
Theft
<DIV style="width: 25em; text-align:center; {{RBXNS | border=#FF007F | legacy=#DFDFDF | topcolor=#BF7F17 | botcolor=#177FBF | radius=2em | webkit=0}}">
'''Taxation<BR/>is<BR/>Theft'''
</DIV>