Inherit bootstrap properties to a custom class

Question

I want my custom class pm_btn to get all the properties that bootstrap's btn class has. One way is to use the actual source code of the btn class. But I believe that there has to be a better way. Therefore, I tried a bit of scss, where inheriting properties is quite easy and trivial using @extend as follows:

.pm_btn{
    @extends .btn;
}

But this throws error :

Error: The target selector was not found.
Use "@extend .btn !optional" to avoid this error.

I am trying to achieve: apply bootstrap like classes to django-postman classes. Please suggest me how can I achieve this, if I am on the right track by choosing SCSS or should I think in some other directions. Thank you for your valuable time.

Answer 1

Not sure what your tooling setup is, but if it will allow it, Bootstrap has a Sass version you can use. This will allow you to extend bootstrap's functionality with your own custom classes.

Answer 2

You can use bootstrap sass files and @extends keyword to extend .btn class to your needs or more easily you can write a separate class along and modify its properties to suit your needs and you can call that style for reusability , For eg

.button--custom {
  /* required properties here */
}

<button class="btn btn-primary text-light button--custom">my button</button>

You need to call in the given class order or it wont work