Есть ли аналог LESS'овского .classname& в SASS?

Question

[sanex3339]

В LESS я мог в миксине, который применяется к .timeline-item (у которого родитель - .timeline) написать

.timeline-item-variant(@top-offset, @arrow-width) {
  // other styles

  .timeline-single-column& > .timeline-event {
    .timeline-item-right-side-position(@arrow-width);
  }
}

это трансформировалось в

.timeline-single-column.timeline .timeline-item > .timeline-event {
  float: right !important;
}
.timeline-single-column.timeline .timeline-item > .timeline-event:before,
.timeline-single-column.timeline .timeline-item > .timeline-event:after {
  right: auto !important;
  border-left-width: 0 !important;
}
.timeline-single-column.timeline .timeline-item > .timeline-event:before {
  left: -15px !important;
  border-right-width: 15px !important;
}
.timeline-single-column.timeline .timeline-item > .timeline-event:after {
  left: -14px !important;
  border-right-width: 14px !important;
}

В SASS аналогичная запись не трансформируется, и амперсанд остается в итоговой css разметке

=timeline-item-variant($top-offset, $arrow-width)
  .timeline-single-column& > .timeline-event
    +timeline-item-right-side-position($arrow-width)

.timeline-single-column& > .timeline-event {
  float: right !important;
}

.timeline-single-column& > .timeline-event:before, .timeline-single-column& > .timeline-event:after {
  right: auto !important;
  border-left-width: 0 !important;
}

.timeline-single-column& > .timeline-event:before {
  left: -18px !important;
  border-right-width: 18px !important;
}

.timeline-single-column& > .timeline-event:after {
  left: -17px !important;
  border-right-width: 17px !important;
}

Как это пофиксить?

Answer 1

[sanex3339]

=timeline-item-variant($top-offset, $arrow-width)
  @at-root .timeline-single-column#{&} > .timeline-event
    +timeline-item-right-side-position($arrow-width)