Re: CSS Classes Custom - by Leonardo Lima

Leonardo,
> :root{
>    %border{border-radius:10px;}
> }
the original syntax proposed in "CSS Extend Rule" does not take into accout
nesting rulesets.
That is, no {property} inside a {} block. Otherwise you'd end up looking
for where the placeholder has been defined and if it fits into
cascading/inheritance dynamics.
Instead, it would be better to simply define placeholders in "CSS global
scope" (the term is not precise but I hope it is comprehensible), so that
it is available in every rule block without having the need to nest it
inside :root (or anything else)
If you have
:root {
  %border{ /* properties */}
}
you can also have
main {
  %border{ /* other properties */}
}
But then consider
main div {
  @extend %border;
}
What %border block is to be considered?

IMHO it's better to just have global custom classes to be called where
necessary.
%border {
  /* properties */
}