I'm trying to extend the .card class from Bootstrap 4 by doing something like this on site.scss file:
@import "path/to/bootstrap4/bootstrap.scss";
.slider-card {
@extend .card;
//some CSS
}
When I compile this file everything from bootstrap gets copied to it. I understood that when @import is used the content that I'm importing gets copied, but I would like not to have this behavior.
Is there a way that I could compile both bootstrap and my file into two different output files?
If it makes any difference I'm trying using the command line and with a simple gulp task.
Thanks