Fixed z-index btn group hover/focus/active relative to reselect dropdown

[iamgollum]

There is a general misunderstanding of the z-index Stacking Context

<div class="Select ... etc...   is-open  ...."> // Relative Position
   ... etc....
   <div Select-outer-menu /> ... dynamic
</div>

The following div will always be above the Select, no matter how high you set the z-index on the outer menu ....

<div class="two-sides-toggle-button btn-group"> // Relative Position, Z-Index: 2
   <button type="button" class="btn btn-default"><i class="fonticon-table"></i> Table</button>
  <button type="button" class="active btn btn-default">Metadata</button>
  <button type="button" class="btn btn-default"><i class="fonticon-json"></i> JSON</button>
</div>

The fix is to adjust the Z-index on the button effects: hover,focus,active.
You can also make the Select not-relative and redesign that component.

See #998 in the thread with the dropdown on the reselect component going underneath the btn group on effect.

[Antonio-Maranhao]

Great fix! Just one suggestion.

[Antonio-Maranhao]

I think it'd be better to set the z-index at https://github.com/apache/couchdb-fauxton/blob/master/assets/less/formstyles.less#L350 instead.
This way it's obvious what we are overriding whenever we upgrade bootstrap.

[iamgollum]

@Antonio-Maranhao sounds good. I will start keeping that in mind. I will do this tonight! In addition, targeting specifically active as you suggested is definitely scoped to perfection for this bug.

[iamgollum]

@Antonio-Maranhao required a !important since bootstrap took hire precedence with more focused scope. Based on specificity: https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity ... its okay practice in this case to use it since Bootstrap is a "3rd party" stylesheet. My original fix, I didn't even realize it was in the Bootstrap folder ...now I know what you meant by Bootstrap...I wasn't thinking!

[popojargo]

Maybe it would be relevant to add a comment here to justify the !important

[iamgollum]

@popojargo let me know what you think. Added explanation.