Positions "Content Type selection" modal by CSS, not JS (fixes issue 120)

[SayTen]

• Removes code to position overlay menu through javascript.
• Adds CSS to position overlay menu in middle of window.

[leekelleher]

@SayTen Thank you for this fix. Just tested it out, it works well for me.

@mattbrailsford Do you have any concerns with the JS position calculations being removed?

[mattbrailsford]

@leekelleher as long as it's been tested as a regular NC instance as well as inside DTGE and it works fine, I'm happy with the changes

[leekelleher]

@mattbrailsford 👍 I'll give it some more testing. (I've currently only tested within DTGE)

[leekelleher]

It works fine with a regular NC.

However I have been playing around with the CSS and tweaked the rules so that the modal opens nearer in relation to the NC.

.usky-grid.nested-content__node-type-picker .cell-tools-menu {
    position: relative;
    transform: translate(-50%, -25%);
}

Note, adding the .usky-grid class selector removes the need to have !important suffix.

@SayTen - what are your thoughts on the positioning of this?

[mattbrailsford]

@leekelleher surely that's only true while "hide label" is false. Might need 2 rules, and then what does one do about DTGE, where the NC is far to the right.

[mattbrailsford]

We could of course, increase our minimum version number and use the new ad directive that doesn't have this issue :D

[leekelleher]

@mattbrailsford Do you know which Umbraco version introduces it? (not that I've heard of the "ad" directive)

[leekelleher]

@mattbrailsford re: "hide label" ... tried it, works the same.

[mattbrailsford]

@leekelleher well, it might not be the "ad" directive, but it's the directive for this dialog :)

Not sure, would have to look back. A lot got added in 7.4.3 I think.

[mattbrailsford]

@leekelleher how about with the tree nav hidden?

[leekelleher]

@mattbrailsford 😩 😃 I've tried with reducing the width, so the content-tree hides... still displays fine (for both with/without label). The modal is always positioned in the centre of the editor control.