Standardize buttons and error messages

[renan601]

Issue Description

In the acceptance test we discover that some visual aspects of the product are off pattern, this specific issue focus in refactoring two of those aspects and one minor visual problem.

The first aspect is the buttons, right now in the application we have buttons represented by icons, by text and by icon+text. The idea is to eliminate the only text buttons and turn them into icon+text buttons (with the exception of buttons in modal components to show some kind of warning or error, they must continue as buttons represented by text). The buttons size are also off pattern, in some screens buttons with the same message are in a completely different size, all icon+text buttons must use the same font-style, font-size, width and icon-size, the button length must be proportional to the message inside the button, using equal padding across the entire application.

The second aspect refers to the error messages, they don't use our alert component and differ from our visual identity. Modify the alert component in these error messages (all screens that receive user input as text or that he interact with dropdowns have error validation and alert components). The alert component must be showed on the center of the screen and have fixed width, the length must be proportional to the message inside. The button inside the alert contains only text and should follow the size rules described before to prevent buttons with the same text from appearing in different sizes.

Try to move the centralize location button available in the map component that the application uses. Communicate with the team if this its possible.

Acceptance Criteria

• All text buttons refactored to icon+text buttons on the application screens
• Buttons standardized in terms of size, style, padding and the other criteria described above
• Alert messages displayed in proper modal component with Stay Safe visual identity
• Alert messages and buttons respecting size rules described above