I'm using the following external files in my website:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootbox.js/4.4.0/bootbox.min.js"></script>
<button disabled>Disabled</button><br>
<button>Not Disabled</button>
Before adding bootstrap+bootbox, my buttons worked as intended, being grayed out when disabled. But now all of my buttons always look the same, whether enabled or disabled.
I've noticed that my button visuals work again, if I don't include the bootstrap3.3.7.min.css. But that also completely breaks any custom popups that are based on bootstrap.
According to the bootbox website I'm using compatible library versions, so I don't know what could cause this behavior.
You are going to want to use class btn
if you are using bootstrap so buttons can be visually disabled when disabled.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootbox.js/4.4.0/bootbox.min.js"></script>
<button class="btn" disabled>Disabled</button><br>
<button class="btn">Not Disabled</button>