Common prefix for all CSS classess for an app using sass variable

AppPrefixing.scss

// prefix that needs to be attached to all the css classes
$prefix: app-;

// that variable can be used as #{$prefix} to attach that prefix to every class
.#{$prefix}header {
  background: red;
}

.#{$prefix}content {
  background: yellow;
}

/*
// The output css would be ::

.app-header {
  background: red;
}

.app-content {
  background: yellow;
}
*/