scss prepend селектор к текущему селектору

Question

Есть ли способ добавить селектор непосредственно к текущему селектору в scss. Рассмотрим следующее:

.object-fit {
  object-fit: cover;
  height: 100%;
  width: 100%;
  overflow: hidden;
}

есть ли способ добавить img так, чтобы вывод был img.object-fit?

Единственный способ, который я видел для добавления, это добавить & после примерно так:

.object-fit {
  img & {
  }
}

но это превратит его в родительский дочерний селектор: img .object-fit

Обычным способом было бы просто добавить второй селектор с помощью &img, нотак как у него нет точки перед селектором, это заканчивается именем другого класса: .object-fitimg

Таким образом, в основном вопрос заключается в том, есть ли внутри класса подгонки объекта какой-либо символ, предшествующий селектору голых элементов?

Answer 1

Если вы используете @at-root и & с синтаксисом интерполяции:

 .object-fit {
      @at-root img#{&} {
        color: blue;
      }
    }

Ваш вывод будет:

img.object-fit{
  color: blue;
}