UI - token page: adjust the visual behavior of the token-detail component to look nice in every context used

[Viterbo]

No description provided.

[Viterbo]

The same component is used in two places its behavior is not adequate or can be imprived.

Following the screen shots shows 3 issues with the visual behavior:

1 - When listing tokens the token-display component shows even when it has nothing to show

2 - When there's a token selected it displays a huge card instead of a medium tall wide nice card.

3 - The creating a new token the component adjusts its width to the content. This generates a not desired visual effect moving the form to the left as the user writes.

[Viterbo]

This commit 55685db changes the token-detail component and also changes the way it is used.

1.1 - Here is showing the token details on the tokens' main page. It also has a mini animation of fading in and out.

1.2 - Here is the same situation but the token owner is logged, so the edit button is shown instead of just jumping into the edition form.

2.1 - Here we are editing the token. Now the token preview is on the top instead of being on the side. This generates a very large scrollable page which is not desirable, so I split the form interaction into two parts: This screenshot shows the first part.

2.2 - This screenshot shows the situation right after accepting the terms. There's a mini animation of fading in and out.

3 - Finally, the creation form shows a non-empty token-detail component showing a placeholder while the fields are still empty.

[Viterbo]

I close this issue because is fixed and merged.