Need advice for refactoring a big non OOCSS site

[Martin Petrov]

Hi,

I'm asked to rewrite the whole css and html for a big project, because it depends too much on location dependent selectors. I would be happy if you could share any advise on how to approach this task . It's a big social site with a messy stylesheet. They've been using SASS which results in kilometer-long selectors.

Maybe I should go through all selectors in the stylesheet and locate them in the html views and then I should turn them into css objects.

Martin P.

[Ytterström Anders (Adeprimo)]

Before anything else, make it clear if you are allowed to change the HTML or not. (Seems you are?)

My first advice is to analyze the design to find the core objects which have several skins attached. If possible, get in touch with the designer who first came up with the design and let him help you. If not, maybe some developer responsible for the css can help you to map the objects.

After that, start packaging the core objects as OOCSS plugins (as in xxx.css, xxx_skin.css, xxx_debug.css and xxx_doc.html) and then skin them.

If you are comfortable with SASS, use of @extend could make your code easier to read and maintain, but the rest of SASS feature set is overkill if you are allowed to alter the HTML for your needs.

/ay

--
You received this message because you are subscribed to the Google Groups "Object Oriented CSS" group.
To view this discussion on the web visit https://groups.google.com/d/msg/object-oriented-css/-/mLdJuzOyAbYJ.
To post to this group, send email to object-or...@googlegroups.com.
To unsubscribe from this group, send email to object-oriented...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/object-oriented-css?hl=en.

[Nicole Sullivan]

Yeah, SASS without any architecture can lead to a mess of tangled selectors & property value pairs.

Treat your site as if it were a new design, look at each page starting with the simplest pages and the most ordinary content areas and find all the objects... headings, lists, links, boxes, etc. 

When you have identified all the objects consider posting that here for a critique before you get started building them.

Nicole

--

[Chris Eppstein]

CSS without any architecture can lead to a mess of tangled selectors &
property value pairs.

FTFY :)

On Oct 17, 2:45 pm, Nicole Sullivan <nic...@stubbornella.org> wrote:
> Yeah, SASS without any architecture can lead to a mess of tangled selectors
> & property value pairs.
>
> Treat your site as if it were a new design, look at each page starting with
> the simplest pages and the most ordinary content areas and find all the
> objects... headings, lists, links, boxes, etc.
>
> When you have identified all the objects consider posting that here for a
> critique before you get started building them.
>
> Nicole
>