Bootstrapping the DropdownWithAllComponent

[FutzMonitor]

Current Design

Currently the DropdownWithAllComponent is using the basic HTML select element. For information on the basics of this element, developers are welcomed to check out W3School page on the element [here]. An image is provided demonstrating what this looks like in the project.

The dropdown has the basic HTML look.

The dropdown appearance when opened

Potential Design

The project is making use of Bootstrap version 3.3.7 [doc] which has a dropdown component available for use. The revised BannerComponent is making use of the alert component available via Bootstrap. Would it be worthwhile to pursue the same bootstrapping of other components within the project? Bootstrapping the DropdownWithAllComponent should be a relatively straightforward process, and it should have practically the same functionality. The final product should look just like the example dropdown box available on the documentation page.

Dropdown component available via Bootstrap 3.3.7.

[FutzMonitor]

I can tackle this issue.

[FutzMonitor]

We're considering use a new technology called BootstrapVue [link] to resolve issue #451 by having a consistent calendar component throughout the project without having to rely on built-in browser elements that are inconsistent and causing us problem. On that note, this new technology supports its own version of dropdowns [here]. So, instead of simply bootstrapping the dropdown it might be worth simply waiting to see how experiments with this new technology goes and using it in the future to improve the DropdownWithAllComponent.

It also has support for a:

• table component [here].
• alert component [here]
• tooltips component [here]
• spinner component (may be nice to replace ours with theirs) [here]