Avatar Image Can be Uploaded

[dmtrjsg]

Context

Ensure less friction and better experience for all users, since avatar image via URL come with many problems. Atlas team is building a simple back end service to support this.

Scope

• Update the membership creation and editing flows in favour of uploaded avatars - Adding info about avatar size/ ratio #1366
• Check the Avatar component in Figma and make sure the component is up to date with the design

┆Issue is synchronized with this Asana task by Unito

[toiletgranny]

Alright, @kdembler, the updated designs are ready to be picked up! Here's everything that's changed:

• First and foremost, small updates to the Avatar component so that we can display overlays indicating that an image can be uploaded (or edited). Designs and a detailed changelog can be found here.
• Then there's the recently revised Sign in flow. These are the changes we all discussed and looked at yesterday during our Monday weekly. Designs and changelog can be found here.
• Finally, we also need to revisit the profile editing mode on the Membership profile page, so that we drop the Avatar URL field in the form, and use the updated Avatar component (in the Editable mode) to allow the user to select andupload an image. The design for this can be found here. Also, please note the Snackbar component I added at the bottom of that frame to handle errors during upload.