List of Stylevar Data Types

[arvid]

https://vborg.vbsupport.ru/attachment.php?attachmentid=113470&d=1267609800
I was searching for a list of the different Stylevar Data Types in vBulletin 4, what they can contain and how they are implemented in css templates. This is only really relevant if you add your own Stylevars, but then it's really relevant. Below you'll find a list of the different Data Types and a short description and an image. All from vB 4.0.2.

Simple Types
String
https://vborg.vbsupport.ru/external/2010/03/103.jpg (https://vborg.vbsupport.ru/attachment.php?attachmentid=113453&d=1267608942)
Any textstring can be entered. Useful together with the Validation field, or maybe a phrase would be more fitting for your application?

Numeric

https://vborg.vbsupport.ru/external/2010/03/104.jpg (https://vborg.vbsupport.ru/attachment.php?attachmentid=113454&d=1267608942)
Any textstring can be entered. No validation is build into the type. The only real benifit compared to the String type is that the title of the input box is Numeric instead of String, hinting to the user what should be entered. If you are going to use the value for a size I would use either the Dimension type or the Size type instead. Or use the Validation field if the numeric part is important.

URL

https://vborg.vbsupport.ru/external/2010/03/105.jpg (https://vborg.vbsupport.ru/attachment.php?attachmentid=113455&d=1267608942)
Any textstring can be entered. No validation built into the type this time either. As with Numeric, the only real benifit compared to the String type is the title ("URL").

Path

https://vborg.vbsupport.ru/external/2010/03/106.jpg (https://vborg.vbsupport.ru/attachment.php?attachmentid=113456&d=1267608942)
Again, any textstring can be entered, so the title is the only benifit compared to the String type.

Color

https://vborg.vbsupport.ru/external/2010/03/107.jpg (https://vborg.vbsupport.ru/attachment.php?attachmentid=113457&d=1267608942)
This time, the type actually gives us something compared to the String type. This gives us a textfield and the little color-square you surely know by now. Either you enter the color in the textfield, or you click on the square and use the popup. Again there is no validation check that what you entered is a correct css color if you don't use the Validation field.

Image Path

https://vborg.vbsupport.ru/external/2010/03/108.jpg (https://vborg.vbsupport.ru/attachment.php?attachmentid=113458&d=1267608997)
As most of the other simple types, this only gives you a title.

Image

https://vborg.vbsupport.ru/external/2010/03/109.jpg (https://vborg.vbsupport.ru/attachment.php?attachmentid=113459&d=1267608997)
This doesn't even give you its own title, this just gave me a regular textfield labeled "String".

Font List

https://vborg.vbsupport.ru/external/2010/03/110.jpg (https://vborg.vbsupport.ru/attachment.php?attachmentid=113460&d=1267608997)
This gives you a textarea input box instead of the textfield, and its own title.

Size

https://vborg.vbsupport.ru/external/2010/03/111.jpg (https://vborg.vbsupport.ru/attachment.php?attachmentid=113461&d=1267608997)
This gives you a select box labeled units containing different css units (px, em, % etc) and a textbox labeled Size. As usual, the texbox isn't validated.

[arvid]

Complex Types

Background

https://vborg.vbsupport.ru/external/2010/03/96.jpg (https://vborg.vbsupport.ru/attachment.php?attachmentid=113463&d=1267609129)
Gives you the options availible to the css entity background. It seems no validation this time either. And writing a validation script would be tricky or maybe impossible (?)
background:{vb:styelvar your_background};

Font

https://vborg.vbsupport.ru/external/2010/03/97.jpg (https://vborg.vbsupport.ru/attachment.php?attachmentid=113464&d=1267609129)
Suitable for the font css entity. No validation.
font:{vb:stylevar your_font};

Text Decoration

https://vborg.vbsupport.ru/external/2010/03/98.jpg (https://vborg.vbsupport.ru/attachment.php?attachmentid=113465&d=1267609129)
For the text-decoration entity. Uses a collection of Yes/No radio buttons for each of the availible options. One a bit strange thing is that you can select None at the same time as all the other options, but if you do the none overrides the other so all is well :)
text-decoration:{vb:stylevar your_textdecoration};

Dimension

https://vborg.vbsupport.ru/external/2010/03/99.jpg (https://vborg.vbsupport.ru/attachment.php?attachmentid=113466&d=1267609129)
Obviously used for things with a width and a height. Two textfields and one Popup for units.
width:{vb:stylevar your_dimension.width};
height:{vb:stylevar your_dimension.height};

Border

https://vborg.vbsupport.ru/external/2010/03/100.jpg (https://vborg.vbsupport.ru/attachment.php?attachmentid=113467&d=1267609129)
For the border entity.
border:{vb:stylevar your_border};

Padding

https://vborg.vbsupport.ru/external/2010/03/101.jpg (https://vborg.vbsupport.ru/attachment.php?attachmentid=113468&d=1267609147)
For the padding entity. The "Use the 'top' value for all sides" option is useful.
padding:{vb:stylevar your_padding};

Margin

https://vborg.vbsupport.ru/external/2010/03/102.jpg (https://vborg.vbsupport.ru/attachment.php?attachmentid=113469&d=1267609147)
Really the same as the Padding type. Css-wise they are the same, so the only reason would be for the user to know what they are entering info for, but since there is no label in this version of vBulletin it is redundant this far. (but since it is set in the database it might show up in future versions of vBulletin, so you better stick to the right type)
margin:{vb:stylevar your_margin};