$trans-opacity__time: 0.3s;
$trans-opacity__function: ease-in;
/// @example
///   transition: opacity $trans-opacity;
$trans-opacity: $trans-opacity__time $trans-opacity__function; // convenience variable for using both

$trans-move__time: 0.3s;
$trans-move__function: ease-in;
/// @example
///   transition: left $trans-move;
$trans-move: $trans-opacity__time $trans-move__function; // convenience variable for using both

.demo-transition {
  &.transition-opacity {
    transition: opacity $trans-opacity;
  }
  &.transition-move:after {
    transition: left $trans-move;
  }
}