fk
commented
8 years ago Hello @jophj!
Back when I hacked together the first version of select2-bootstrap-theme for Bootstrap 3 and Select2 v3 based on the work by @t0m for Bootstrap 2, I wondered if connecting the Select2 dropdown to the input/container made sense in terms of the Bootstrap form-focus box-shadow (the blue glow around the Select2 input/container) as well as the dropdowns box-shadow: Should we extend the form-focus box-shadow of the container to the dropdown? Meh, probably too invasive. How do we deal with the "dropdown above" scenario in terms of the shadow? How far do we get with just CSS – box-shadows spread, multiple box shadows, z-index?
I did not have much time to worry or try back then, and was surprised how relatively well not changing anything ;) worked out and felt when using … and so it stayed this way.
While your changes improve the "dropdown shadow overlaps container" situation, it also interferes with the light source for all other box-shadows – IMO since there is no well-rounded solution here.
Seperating the dropdown from the container like e. g. selectize.js does it in their Bootstrap 3 theme:
would solve all those questions …
Well, well … ;) – for now, the new 0.1.0-beta.9 contains your suggested changes!
Hi everybody!
A pic is better than any words:
As you can see the dropdown shadow is shifted down 6px so overlaps the select2 element. Also, probably the shadow should be above the dropdown, not below. I don't know if this is intended behaviour.
I fixed it by simply duplicate line 24:
and using the style accordingly.
Thanks!