Object-oriented inspired composable LESS mixins. View the article on the blog: http://blog.lvl99.com

08-Composable-mixin-piece-nested-mixins-defining-classes-and-states.less

// Class mixin which contain style definitions for `show` state
.-toggleable-class-show(@rules: {}) {
  display: @-toggleable-display;
  @rules();
}

// Class mixin which contains style definitions for `hide` state
.-toggleable-class-hide(@rules: {}) {
  display: none;
  @rules();
}

// State mixin to import and assign the `show` class definition
// to the component’s `show` state
.-toggleable-state-show(@rules: {}) {
  &@{-toggleable-ns-class-show} {
    .-toggleable-class-show(@rules);
  }
}

// State mixin to import and assign the `hide` class definition
// to the component’s `hide` state
.-toggleable-state-hide(@rules: {}) {
  &@{-toggleable-ns-class-hide} {
    .-toggleable-class-hide(@rules);
  }
}