Web > Update edit avatar component

[americanrefugee]

Description of the issue

When reviewing the work being done on Start of Chat for web, I noticed the following issues with the Avatar component:

• Avatar fallback > The "T" in the avatar looks gray, whereas it should be color/text/decorative
• Edit button > There is no rollover state or any other indication or interactivity

Changes requested

• Ensure that the colors for the Avatar fallback, including the Initial, correspond to the colors specified in Compound (Link to Avatar source component)
• Ensure that the Edit button has a rollover state with tooltip and focus state (Link to Edit button component)
• Ensure that the final outcome matches the design in Compound (Link to Edit avatar component)

[americanrefugee]

Notes from @florianduros ...

The fun thing is that we are using two different avatar components in web
We are using a new one in the settings following figma/compoud rules
But it wasn't done to be used in another case 😕
Where we want basically the Avatar from compound web + an icon on the bottom right
imo it should be added in compound web
We already use https://compound.element.io/?path=/docs/compound-web_avatar--docs