[UI] Account overview

[andersonjeccel]

Q	A
Bug fix? (use the a.b branch)	🔴
New feature/enhancement? (use the a.x branch)	🟢
Deprecations?	🔴
BC breaks? (use the c.x branch)	🔴
Automated tests included?	🔴
Related user documentation PR URL	mautic/user-documentation#...
Related developer documentation PR URL	mautic/developer-documentation-new#...
Issue(s) addressed	Fixes #...

Description

This PR is based on another PR, where I introduce tokens to replace most of the UI variables, aiming to improve consistency in all components. We need it to be merged before this one becomes available for code review.

This PR creates a user overview, where we can put toggles for dark theme and high contrast later.
It also indicates where to change profile picture (mautic is based on gravatar).

When someone has a profile pic in their Gravatar profile, it's shown here. The background is automatically created through a blur filter on top of an image copy, so colors combine and get harmonic etc.

Mobile:

---

📋 Steps to test this PR:

1. Open this PR on Gitpod or pull down for testing locally (see docs on testing PRs here)
2. Open top navbar > Account > See

[oltmanns-leuchtfeuer]

Neat little feature, I quite like it. The only thing that I would propose to change is that the links to Gravatar should open in a separate tab. All changed made to my preferences where gone when I clicked on that link before hitting "Save".

[andersonjeccel]

Makes sense, I’ll fix it soon!
Thanks for testing 🙏🏻

[LordRembo]

A similar remark I had on other PR's, but there's a lot of CSS changes in here that don't seem to fit with the goal/description of this 1 PR (eg. builder.css). If all you want to do is make changes to the background and a bit of groundwork (structure-wise) for later adding stuff, I think there's too much css changing.
These additions are also the same as in the other PR's, leading me to think they should be first done as part of one of the 'restructring' PR's or get the open PR's to do with colors, tokens, … merged first.

[andersonjeccel]

@LordRembo Most of my UI pull requests are based on the branch about tokens, that’s why it appears to have a lot happening

If we change something there, I can just do a rebase

the main goal here is to let people see the expected changes and opine

[LordRembo]

@andersonjeccel You shouldn't be making PR's that contain the content of another PR, until that one is merged. Especially one as big as the Tokens overhaul.
Working like this is extremely confusing, as people are asked to review a relatively small change while having to accept the major structural overhaul that is actually part of another PR.
I would advise to put all these PR's that depend on those changes, in Draft, and we can discuss what you are trying to achieve, to find a better way. Eg. at least these PR's should be marked as dependent or blocked on the Tokens PR