Cacher is the code snippet organizer for pro developers

// & operator 
// The & always refers to the parent selector when nesting
// In the below example, & refers to .button class

.button {
  width:50px;
  height:50px;
  
  &:visited { }
  &:hover { }
  &:active { }
}


// & operator can also be used on the right side of selectors
// this can be useful in certain scenarios where you want the parent to be nested under a particular element
// say item appears in multiple sections and you want to apply styles to item which is under
// typography section
.item {
  
  #typography & {
    background: $green;
  }
  
}