ISSUE:
CSS pseudo-class selectors use a single colon to identify themselves. They can appear after an element definition, or without an element, meaning they apply to all elements. When they apply without any element definition, ClientDependency removes the space before them, which changes the meaning of the selector.
EXAMPLE:
Take the following CSS, and pass it through the ClientDependency's CssMinifier class.
.-content :not(.with-unpublished)-unpublished {
opacity: 0.4;
}
EXPECTED BEHAVIOR:
The output CSS should be as follows:
.-content :not(.with-unpublished)-unpublished{opacity:0.4}
ACTUAL BEHAVIOR:
The CSS is being output as follows, which causes the :not pseudo-class to apply to the .-content element, rather than applying to children of that element, meaning unpublished nodes are not properly grayed out.
.-content:not(.with-unpublished)-unpublished{opacity:0.4}
Shazwazza
commented
5 years ago
ISSUE: CSS pseudo-class selectors use a single colon to identify themselves. They can appear after an element definition, or without an element, meaning they apply to all elements. When they apply without any element definition, ClientDependency removes the space before them, which changes the meaning of the selector.
EXAMPLE: Take the following CSS, and pass it through the ClientDependency's CssMinifier class. .-content :not(.with-unpublished)-unpublished { opacity: 0.4; }
EXPECTED BEHAVIOR: The output CSS should be as follows: .-content :not(.with-unpublished)-unpublished{opacity:0.4}
ACTUAL BEHAVIOR: The CSS is being output as follows, which causes the :not pseudo-class to apply to the .-content element, rather than applying to children of that element, meaning unpublished nodes are not properly grayed out. .-content:not(.with-unpublished)-unpublished{opacity:0.4}