function list group definition for css

[mahks]

I would like to separate the functions, id's & classes in the function list

Does anyone have a group definition for css?

[Mofi]

You know that you can mix style definitions for elements, classes and id's on the same line like following definition demonstrates?

h2, p.red, #attention { color:red }

However, I took the regular expressions of Cascading Style Sheets (CSS) 1.0-2.1 (case-sensitive) and without much thinking about the expression splitted them up into 3 groups using following definitions:

/TGBegin "Elements"
/TGFindStr = "%[ ^t]++^(["*+,^-0-9:=>@^[^]_a-z|~][ ^t^p"*+,^-0-9:=>@^[^]_a-z|~]+^){"
/TGFindStr = "%[ ^t]++^(["*+,^-0-9:=>@^[^]_a-z|~][ ^t^p"*+,^-0-9:=>@^[^]_a-z|~]+^)/^*[~/{}]++^*/[ ^t^p]++{"
/TGEnd
/TGBegin "Classes"
/TGFindStr = "%[ ^t]++^([a-z]++.[ ^t^p"*+,^-.0-9:=>@^[^]_a-z|~]+^){"
/TGEnd
/TGBegin "Identifiers"
/TGFindStr = "%[ ^t]++^(#[ ^t^p"*+,^-0-9:=>@^[^]_a-z|~]+^){"
/TGEnd

This is definitely not perfect, but maybe enough for your requirements.

Please note that I needed to add %[ ^t]++ on every expression because otherwise it is impossible with the UltraEdit regular expression engine not supporting lookbehind to avoid a class definition like

.s5 { font-size:18pt }

to be listed in group Elements (finds only s5) and group Classes (finds .s5). So the expressions now find only style definitions in CSS files or style blocks.

Further note that a CSS definition like

table.black td { border-style:solid; border-width:1px; border-color:#000000 }

is listed in group Classes and not in Elements. I can't really decide on interpreting a CSS definition for a nested element as class definition or as element definition. I prefer classifying a definition for an element inside another element with special style as class definition.

[mahks]

Thanks Mofi that was what I needed, I'm not too good with regular expressions yet.

Is there any way to make the groups collapse?

[Mofi]

Collapse with the code folding engine? No, that is not possible. You can write a macro or script to collapse all CSS definitions on execute for the 3 groups of elements, elements of a definite class and for elements with identifiers. But that requires or better makes sense only when the CSS definitions in your files are always stored in these 3 blocks which is in general not the case from what I have seen in many, many CSS files. Folding a CSS definition spanning over multiple lines is already defined and possible.

Please note: It is possible with the posted expressions above that some CSS definitions are not listed at all in the function list view. The first example I posted above is such a CSS definition not present in the function list view.