Add footer and privacy note to the start dm dialog

[t3chguy]

Fixes element-hq/element-web#17365
Fixes element-hq/element-web#17359

[niquewoodhouse]

Great, thanks. As we've added something to the bottom of the dialog, but it's stayed the same height, the vertical space is a bit more precious, these tweaks helped me:

• mx_InviteDialog_helpText have margin-top 0
• I gave too little margin to the mx_InviteDialog_footer h3 (12 instead of 8)
• .mx_InviteDialog_userSections margin-top 4
• .mx_InviteDialog_userSections padding-bottom 4
• Introduce a userSections class specific for the Some results may be hidden for privacy section with padding-top 8 and padding-bottom 16, margin-left 18 (so it lines up with 'show more')
• .mx_InviteDialog_userSections height (calc(100% - 175px)
• mx_light-fg-color border for the link field instead of input-border-color (in practice, it standing out a bit is good)

These changes seem to give us back almost all of the people/results:

I didn't realise the Some results may be hidden for privacy section would appear if you're not searching. Results doesn't make sense if it's not a search, but we can just change the copy to say suggestions and it works fine.

Thanks

---

@nadonomy there's some specific paddings on the invite dialog to pad the content on the left and the right, so the list of people is less wide

Do you mind if it changes to have no bespoke padding, would just line up a bit neater as there's a full width thing at the bottom of the dialog now.

[niquewoodhouse]

Review

• The 'copied' tooltip/feedback seems to stay visible after you close the dialog
• This change appears to impact the size of the non-DM invite dialog (eg invite to this room)
  

Can that be undone easily enough as it wasn't intended as part of this papercut?

[turt2live]

@t3chguy can we get screenshots of what it looks like in code to the PR description please?

[niquewoodhouse]

lgtm, thanks

[turt2live]

screenshots in the PR description please to make CSS review easier :)