🥇 Usando @ at-root Sass mixin

Menu com comportamento de item ativo:

<body class="item1">
  <ul>
    <li class="item1">Item 1</li>
    <li class="item2">Item 2</li>
  </ul>
</body>

Sass Mixin:

=in($name)
 @at-root #{$name} &
   @content

Uso de Sass:

ul li
  &.item1
    color: purple
    +in('body.item1')
      font-weight: bold
  &.item2
    color: green
    +in('body.item2')
      font-weight: bold

Aproveitar!

Related Posts