Bootstrap 3 - Disabled dropdown links

bootstrap3-disabled-dropdown-links.css

/**
Bootstrap 3 - Disabled dropdown links

Bootstrap 3 has built-in visual support for disabled dropdown menu items, however these are simply 
visual changes and don't actually impact the interactivity of the element itself.

Once this is added to your styles, you can easily disable any dropdown item by applying a [disabled] attribute 
to the <a/> element itself, and adding the usual .disabled class to the parent <li>.

More information here: http://blog.craigsworks.com/bootstrap-3-disabled-dropdown-links/
**/

/*
Mimic cursor style from native .dropdown-menu > .disabled > a{} styles,
since `pointer-events: none` kills the cursor state, too. 
*/
.dropdown-menu > .disabled{
 cursor: not-allowed; 
}

/* The real magic ;) */
.dropdown-menu > .disabled > a{
 pointer-events: none;
}

bootstrap3-dropdown-menu.html

<ul class="dropdown-menu">  
 <li class="disbled"> <!-- Disabled class here -->
  <a disabled>Item 1</a> <!-- Disabled attribute here -->
 </li>
</ul>

bootstrap3-dropdowns.less

.dropdown-menu > .disabled > a {
  &,
  &:hover,
  &:focus {
    color: @dropdown-link-disabled-color;
  }
}
// Nuke hover/focus effects
.dropdown-menu > .disabled > a {
  &:hover,
  &:focus {
    text-decoration: none;
    background-color: transparent;
    background-image: none; // Remove CSS gradient
    .reset-filter();
    cursor: not-allowed;
  }
}

More information here: http://blog.craigsworks.com/bootstrap-3-disabled-dropdown-links/