Help me understand CSS in xenForo.

[Aarmin]

I custom themed my board (using MyBB) and it still validates with no errors and displays properly in all browser types, so I must say I'm not completely lost.

Briefly browsing xenForo I noticed: @primaryLighterStill At first I was lost, but I noticed it points to the "color palette". Well, ok I am still a bit stunned.

Is this a new form of CSS? Is there anything else I should be aware of?

I also noticed: xen: being used in the templates. What does it say?

Looks like it will take me a year to theme..

 

[Paul B]

The @primaryLighterStill is a label applied to a particular colour from the palette; think of it as a variable, e.g. x=1.

It allows you to change that colour in the ACP Style Properties system and it is then applied throughout the css wherever that label is used.
You can still use standard annotation if you wish, replacing @primaryLighterStill with, for example, #C0C0C0.

There is a comprehensive syntax system used within XenForo.
Here is just a small sample:
<xen:comment></xen:comment> - Has the same effect as removing content; i.e. commenting it out
<xen:include template="" /> - This pulls from a template in the database
<xen:require css="" /> - This pulls from a css template in the database
<xen:require js="" /> - This pulls from a javascript file on the server
<xen:sidebar></xen:sidebar> - Adds a standard Sidebar with the user block to a template

As for taking a year, it took me a few hours a day over 2-3 days to fully style my site, including template and css edits.

Having done my fair share of styling on other software, I have to say this is infinitely easier due to the conventions which have been put in place.
The content class of the page being the template name for example.
Classes with an initial capital letter are javascript.
Classes with an initial small case letter are CSS.

Not to mention the aforementioned Style Properties system, which, when coupled with the template manager, makes styling XenForo extremely easy.

 

[Elizabeth]

I custom themed my board (using MyBB) and it still validates with no errors and displays properly in all browser types, so I must say I'm not completely lost.

Briefly browsing xenForo I noticed: @primaryLighterStill At first I was lost, but I noticed it points to the "color palette". Well, ok I am still a bit stunned.

Is this a new form of CSS? Is there anything else I should be aware of?

I also noticed: xen: being used in the templates. What does it say?

Looks like it will take me a year to theme..

Along with what Brogan said, something that may help is to look thru these tutorials: http://xenforo.com/community/threads/links-to-html5-css3.3782/