feat: make drawer content take up full height

[pranshuteotia]

Description

Currently the drawer content does not expand to the full height of its container. Because of this if the drawer content has an embeded iFrame then it results in a broken experience. This PR fixes that.

Related links, issue #, if available: n/a

How has this been tested?

dry-run

Review checklist

The following items are to be evaluated by the author(s) and the reviewer(s).

Correctness

• Changes include appropriate documentation updates.
• Changes are backward-compatible if not indicated, see CONTRIBUTING.md.
• Changes do not include unsupported browser features, see CONTRIBUTING.md.
• Changes were manually tested for accessibility, see accessibility guidelines.

Security

• If the code handles URLs: all URLs are validated through the checkSafeUrl function.

Testing

• Changes are covered with new/existing unit tests?
• Changes are covered with new/existing integration tests?

---

By submitting this pull request, I confirm that you can use, modify, copy, and redistribute this contribution, under the terms of your choice.

[georgylobko]

The purpose of this class is to access the dom node by this selector, so no style rules should be used here

[pranshuteotia]

Ack. I'll move this into another class

[georgylobko]

btw, this style rule can only be applied when the parent element is also display: flex, which is not a case for the runtime drawers

[pranshuteotia]

I am not sure if I understand? I do have display flex added to the parent which is the drawer component itself

[georgylobko]

got it. then this behavior is specific for your use-case, not for this general component. in this case it's better to implement it on your parent level

[georgylobko]

What is the purpose of this additional flex styles? I tried to apply height: 100% without them on my local machine - works fine

[pranshuteotia]

We not only need the drawer to be full height. We also need the drawer content to take up the rest of the space left after the drawer header. So display flex allows use to add flex-grow: 1 to the content which will make the drawer content take up the rest of the space.

Now after adding the the flex styles the content is rendering properly.