CSS - Class hierarchies???

Posted by ClarkeyBoy on Stack Overflow See other posts from Stack Overflow or by ClarkeyBoy
Published on 2010-04-30T17:03:40Z Indexed on 2010/04/30 17:07 UTC
Read the original article Hit count: 489

Filed under:
|

Hi,

I have a site with a customer front end, which has a catalogue, homepage, contact page, about us page and so on. There is also an administration front end. I would like to implement a kind of hierarchy where any elements within an element with class "admin" will inherit properties set in the admin stylesheet and anything else inherits from the customer stylesheet. The purpose of this is so that admin can login on the admin front end, where they have access to lots of advanced stuff, but they can also navigate to the customer front end where they can execute basic tasks (such as hiding catalogue items, running a debug script if a customer reports an issue and so on). I would like all the admin tools on the customer front end to have properties taken from the admin stylesheet instead of the customer one - this will change the background colour and stuff.

Is there any easy way to set up like namespaces to make things simpler, for example:

.admin {
    .list {
        .list-subtitle
        {
        }
        .list-item
        {
        }
    }
    a
    {
    }
}
.customer
{
    .list
    {
        .list-subtitle
        {
        }
        .list-item
        {
        }
    }
    a
    {
    }
}

I know it can be like:

.admin .list {}
.admin .list .list-item {}
.admin a

I just dont want to have to keep putting .admin all the time.

Does anyone have any suggestions on how I could do this? I suppose I could write a .net class which sets this up and writes a stylesheet according to whats put into it, but then I would not be able to read the styles so easily add there would be all sorts of like Classes.Add(blah) and so on.

Thanks in advance for any replies...

Regards,

Richard

© Stack Overflow or respective owner

Related posts about css

Related posts about css3