Difference between revisions of "Template:RBX"

From Dissent
Jump to navigation Jump to search
(tinkering)
(Listing defaults in documentation)
 
(17 intermediate revisions by the same user not shown)
Line 1: Line 1:
border:1px {{{border|#3F3F3F}}} solid;  
+
<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|#EFEFEF}}};  
+
 
background-color:{{{legacy|#EFEFEF}}};  
+
CSS styling template.  Place inside a style attribute.
/* background: -moz-linear-gradient(top, {{{topcolor|#DFDFDF}}} 6%, {{{botcolor|#FFFFFF}}}  
+
 
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|#DFDFDF}}}), color-stop(88%,{{{botcolor|#FFFFFF}}}));
+
__NOTOC__
background: -webkit-linear-gradient(top, {{{topcolor|#DFDFDF}}} 6%, {{{botcolor|#FFFFFF}}} 88%);
+
==Settings==
background: -o-linear-gradient(top, {{{topcolor|#DFDFDF}}} 6%, {{{botcolor|#FFFFFF}}} 88%);  
+
*border: border color (Default: Cool Gray 11C)
background: linear-gradient(top, {{{topcolor|#DFDFDF}}} 6%, {{{botcolor|#FFFFFF}}} 88%);  
+
*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: {{{radius|1em}}};  
+
*botcolor: color at the bottom of the background gradient (Default: white)
-opera-border-radius: {{{radius|1em}}};  
+
*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|1em}}};  
+
 
-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;  
+
 
-ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='{{{topcolor|#FFFFFF}}}', endColorstr= '{{{botcolor|#EFEFEF}}}', GradientType=0 )";  
+
==Examples==
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='{{{topcolor|#FFFFFF}}}', endColorstr= '{{{botcolor|#EFEFEF}}}', GradientType=0 ); */
+
===Defaults===
<noinclude>[[Category:Text Templates]]</noinclude>
+
<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>