Difference between revisions of "Template:RBX"

From Dissent
Jump to navigation Jump to search
(Documentation tweak)
(Listing defaults in documentation)
 
Line 2: Line 2:
  
 
CSS styling template.  Place inside a style attribute.
 
CSS styling template.  Place inside a style attribute.
 +
 +
Draws a rounded box with a 1px border and a gradient with a shadow.
 
__NOTOC__
 
__NOTOC__
 
==Settings==
 
==Settings==
*border: border color
+
*border: border color (Default: Cool Gray 11C)
*legacy: background color for non-CSS3 browsers
+
*legacy: solid background color for non-CSS3 browsers (Default: Cool Gray 1C)
*topcolor: color at the top of the background gradient
+
*topcolor: color at the top of the background gradient (Default: Cool Gray 1C)
*botcolor: color at the bottom of the background gradient
+
*botcolor: color at the bottom of the background gradient (Default: white)
*radius: radius of corners
+
*radius: radius of corners (Default: 1 em)
*webkit: radius of corners for browsers that respond to -webkit-border-radius
+
*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.  
 
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.  

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>