Generally looks good, but confused about some of the changes to existing modals...

Can you explain what the impact is there, ideally with some screenshots?

In D7866#233348, @ashoat wrote:

Generally looks good, but confused about some of the changes to existing modals...

Can you explain what the impact is there, ideally with some screenshots?

Basically there are three "modal sizes": small, large, and fit-content. Using small and large makes sense because we're setting the dimensions of the "container"/parent and having the elements arranged within via flexbox. fit-content is weird because it "flips things." The size of the container/parent (modal) is dependent on the contents.

On the surface that seems fine, but it means eg that because AddMembersModalContent has a hard-coded width, it isn't "flexible" and can't be used in modals of different size. For example if we try to consume AddMembersModalContent within CommunityCreationMembersModal, we get something like this:

By removing the hard-coded width, we get something like:

which is what we want.

The problem then is in MembersModal where AddMembersModalContent is also consumed. Because we had fit-content there, and we aren't hard-coding a width, the modal looks very skinny:

so I "rounded up" to large (instead of moving the hardcoded width somewhere else), and got:

If we really want to preserve the previous width we could possibly introduce a medium size modal, but I think the sizing here is reasonable. This approach ("named" modal sizes) is imo way easier to work with/adjust than hard-coding widths in CSS.