5

I am using multiple class selector for certain elements in my angular js app like the following:

<p class="first second">som text</p>

in my CSS file I have .first and additional more specific properties for .first.second:

.first{
   ...
}

.first.second{
   ...
}

My problem is when I run grunt uncss, the generated file read .first and .second class, but not the both together like .first.second the issue is that I've been using this approach and I have thousands of selectors like these in my app.

How I can configure uncss to ignore all selectors defined with multiple classes without to write one by one combined in uncss ignore options?

Is there any convention over configuration that Im not aware?

Thanks!

xzegga
  • 3,051
  • 3
  • 25
  • 45

1 Answers1

0

First, you can't write classes in one go. There is a rule to obey, so writing .first.second exactly won't work because there has to be a space in between class notations -> .first .second

That would mean, you need a markup like this:

<div class = "first">
    <div class = "second"></div>
</div>

IDs and elements don't have to have a space -> #myDiv.first, div.second

Second, with that given markup, the way you notated the CSS don't make sense because you handling the same element.

So, for a markup like this:

<p class="first second">som text</p>

you have to write it, for example, like so:

.first
    {
        color: #333333;
    }

.second
    {
        text-decoration: underline;
    }

This way you can interchange the classes and also build up for more styling.

Hans Meiser
  • 110
  • 7
  • 1
    I'm using .first and .second class names as example and .second isn't child of .first. My case stands for multiple classes in the same element. http://maxdesign.com.au/news/multiple-classes/ – xzegga Mar 05 '15 at 02:28
  • OK, I see now that my above statement seems to be outdated. So maybe uncss simply does not support this notation. Your best bet would be an regular expression that finds those multiple classes. – Hans Meiser Mar 05 '15 at 08:51