disable or change the nb-theme-default css property

[helxsz]

I want to use such html code in the page

                <div class="alert alert-warning alert-dismissible fade show" role="alert" *ngIf="!hide">
                  <strong>Holy guacamole!</strong> You should check in on some of those fields below.
                  <button type="button" class="close" data-dismiss="alert" aria-label="Close" (click)="hide=true;">
                    <span aria-hidden="true">&times;</span>
                  </button>
                </div>

The class 'alert alert-warming' is based on bootstrap, however the html is not able to show the bootstrap style because of the default theme style shown below

.nb-theme-default .alert-warning {
    background-color: #ebeff5;
    border: none;
    color: #ffaf26; 
}

.nb-theme-default .alert {
    border: none !important; 
}

I want to know how can i either disable the nb-theme-default alert-warning css property or change the nb-theme-default alert-warning css property to bootstrap style?

[yggg]

Hi @helxsz, to modify the theme you need to configure a custom theme based on the default theme. See the guide in the docs. Then you'll be able to modify alert theme variables. You can find a full list of variables here.

By the way, I can't see style declaration from your post. Which Nebular version do you use?