List of Stylevar Data Types

[arvid]

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

Any textstring can be entered. Useful together with the Validation field, or maybe a phrase would be more fitting for your application?

Numeric


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


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


Again, any textstring can be entered, so the title is the only benifit compared to the String type.

Color


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


As most of the other simple types, this only gives you a title.

Image


This doesn't even give you its own title, this just gave me a regular textfield labeled "String".

Font List


This gives you a textarea input box instead of the textfield, and its own title.

Size


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


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


Suitable for the font css entity. No validation.
font:{vb:stylevar your_font};

Text Decoration


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


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


For the border entity.
border:{vb:stylevar your_border};

Padding


For the padding entity. The "Use the 'top' value for all sides" option is useful.
padding:{vb:stylevar your_padding};

Margin


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};