Dialog: positioning

[gretanausedaite]

Feature

Positions for Dialog:

• CSS created in https://github.com/iTwin/iTwinUI/pull/679/files#diff-68df02c08d0adce541e49bba164c2c72d0c346f659f79c8a76495a884769741aR56 but missing React implementation
• Is also needed for: Upload tracker component #667

Examples

An optional placement prop can be added to Dialog.

<Dialog placement='top-left'>

<Dialog placement='bottom-left'>

<Dialog placement='top-right'>

<Dialog placement='bottom-right'>

The prop will likely need to be stored in DialogContext (by Dialog) and then used inside DialogMain to set the data-iui-placement attribute.

[coderr01]

@gretanausedaite i would like to contribute on the issue

[mayank99]

Hey @coderr01, thanks for your interest, but this issue was actually created for @marashad001 (who also wrote the original CSS for it in #679).

If you are still interested in contributing to iTwinUI, may I recommend #924 or #129? Or we can find you a different task depending on your skills and interest.