Colorpicker in bootstrap modal

[djabor]

using the color-picker on modal view causes the widget to misbehave. It basically renders on the wrong z-index and relative to the wrong element.

[buberdds]

We can increase the z-index property. I'll check positioning of the color picker in a fixed element.

[clouddueling]

I think bootstrap appends the div to the element that was clicked so it's relative position is the same as the element clicked.

[djabor]

if i recall correctly, the relative position depends on a setting. when not used, the element is created as a child of the body element.

When using fixed position and some hacking on the code, i can get the element to pop up in the right place and calculate the color area cross-hair correctly, but scrolling won't work since it's relative to the wrong element (body).

When using relative position, the element breaks in a different way. I can't remember exactly what it was, but from memory i think it was the crosshair calculations and the onscreen position calculation.

[buberdds]

Thanks for hints. I'll push a new branch with a workaround today. My current fix is not working in IE of course, but I hope we will be able to close this issue soon.

[clouddueling]

I have this popover directive that loads a template and is able to scroll with the color picker just fine, but not in the modal. So weird.

[buberdds]

Yeah it's a weird combo of fixed and relative elements and they have it's own scroll bars because bs modal hides body scroll bar (.modal-open) and show a scroll bar of the main modal container (.modal). So you scroll in both containers (body and .modal).

Anyway, can you please check a new branch "bs-modal" https://github.com/buberdds/angular-bootstrap-colorpicker/tree/bs-modal ?

btw please add a colorpicker-parent="true" attribute to a color picker, it should place an element inside a modal window.

[clouddueling]

Heads up I'm using BS2 but the latest repo works fine for me everywhere else.

Edit: I'm wondering if it would be easier if I could just put an inline color picker in the modals and use the dropdown version everywhere else.

[buberdds]

What about this example http://web.hostdmk.net/github/branch/? I think it's working just fine.

[clouddueling]

Could you format the modal into a form and try it? You see how the colorpicker is ever so slightly outside the text input.

[buberdds]

thanks @clouddueling :+1:

http://web.hostdmk.net/github/branch_v2/

[buberdds]

fix merged