Look how easy this is to style!

Erik

Well-known member
Alright, so I don't have access to the AdminCP, but just digging through the source and using Firebug I can already tell this is going to be extremely easy to style, at least on a basic level.

Hopefully I'm not killing your guys' big reveal on the styling features, but I found this and I just couldn't resist posting.

All the colors are customizable with CSS!

This is something I've been dreaming of for a while now and with modern CSS and the death of IE 6, it is finally possible. Yes, gradients, borders, the Home > Forum > General Discussions navbar, everything! You can change the entire look of the forum without changing a single image.

For example, let's take a look at the code for the secondary navbar (the one that says 'Mark all forums read,' 'What's new?' etc with the gradient.

Firebug shows:

Code:
.navigationTabs .selected ul {
background:url("styles/default/foro/gradients/tab-unselected-25px-light.png") repeat-x center top #65A5D1;
...
}

See that? It's a transparent PNG that's colored by the hex value! :D So, if we want the navbar to be red?


Code:
.navigationTabs .selected ul {
background:url("...tab-unselected-25px-light.png") repeat-x center top #CC0000;
...
}

And...
9BcRB.png


Expand to everything else on the forum, and you get the idea.

dniLd.png

fDZvP.png


Again, I didn't manipulate these in Photoshop. All I did was change some CSS using Firebug.

This also means that if you wanted to tweak the gradient style (say, if you wanted the secondary navbar gradient to be more gradual) all you would have to do is upload a new transparent gradient!

Very, very nice guys. Really top notch! :D
 
Just realized that vB4 has this to some extent, but it's not implemented nearly as well as this is. Editing the style in the AdminCP will be extremely easy with this system. It would be trivial to use JavaScript to update the page live as changes are made, a la Firebug. :)

Not too groundbreaking...vB4 and IPB 3.1 do very similar stuff

Don't get me started on how poorly vB4's engine is architected though :confused:

Yeah, I just realized that. So not really as huge as I thought it was, but the fact that the whole navbar is styled with one CSS rule will make things extremely easy to edit. As you mentioned, the architecture is much better.
 
Just wait til you see it inside. Everything - the templates, css, etc, is laid out so neatly and clearly. Even I can understand it!

This is the important thing, and it's what I'm most interested in seeing regarding XF styling. It's what makes IPB's styling engine and what breaks vB4's styling engine.
 
Top Bottom