In production, when an action is in the completed state, the avatars of members, tokens & colony logos are no longer aligned correctly. However, during the creation state, the avatars are aligned to the design correctly.
For the simple payment example below, the impacted fields are: Recipient and Amount.
A closer comparison (left side completed actions state, right side Figma)
Steps to reproduce
Create a new action in production, ensuring it has a field where a circle avatar is used. Edit Colony details, any Payment type, Mint tokens etc.
After completing the fields, take a screenshot before submitting the CTA.
Select the CTA, and sign the transaction to complete the action.
Take another screenshot of the completed state.
Compare the location and positioning of the user/ token/ colony avatar.
Expected behaviour
The completed state should keep the same UI placement for all elements, including any avatars, and align with
Actual behaviour
The UI and positioning of elements within the action change from the created to the completed state.
Description
In production, when an action is in the completed state, the avatars of members, tokens & colony logos are no longer aligned correctly. However, during the creation state, the avatars are aligned to the design correctly.
For the simple payment example below, the impacted fields are: Recipient and Amount.
A closer comparison (left side completed actions state, right side Figma)
Steps to reproduce
Expected behaviour
The completed state should keep the same UI placement for all elements, including any avatars, and align with
Actual behaviour
The UI and positioning of elements within the action change from the created to the completed state.