- Notifications
You must be signed in to change notification settings - Fork 1.6k
Bootstrap 3 Styling
Josh edited this page May 23, 2014 · 1 revision
The following Sass/LESS rules will make jQuery Autocomplete suggestions resemble Bootstrap 3 dropdowns.
Sass
.autocomplete-selected background: $dropdown-link-hover-bg color: $dropdown-link-hover-color .autocomplete-suggestion cursor: pointer overflow: hidden // From the jQuery Autocomplete README. padding: 3px 20px // Same as .dropdown-menu links. white-space: nowrap // From the jQuery Autocomplete README. .autocomplete-suggestions background: $dropdown-bg border: 1px solid $dropdown-border border-radius: $border-radius-base // From the .dropdown-menu rule. +box-shadow(0 6px 12px rgba(0,0,0,.175)) // From the .dropdown-menu rule. overflow: auto // From the jQuery Autocomplete README. padding: 5px 0 // From the .dropdown-menu rule.LESS
.autocomplete-selected { background: @dropdown-link-hover-bg; color: @dropdown-link-hover-color; } .autocomplete-suggestion { cursor: pointer; overflow: hidden; // From the jQuery Autocomplete README. padding: 3px 20px; // Same as .dropdown-menu links. white-space: nowrap; // From the jQuery Autocomplete README. } .autocomplete-suggestions { background: @dropdown-bg; border: 1px solid @dropdown-border; border-radius: @border-radius-base; // From the .dropdown-menu rule. .box-shadow(0 6px 12px rgba(0,0,0,.175)); // From the .dropdown-menu rule. overflow: auto; // From the jQuery Autocomplete README. padding: 5px 0; // From the .dropdown-menu rule. }