General UI bugs identified across all domains

[Ade-kola]

Expected behavior

Modals

• Update each modal to have a padding of 24px , heading text size for modals should be Gilroy bold 28px , sub text should be 16px and grey in color. The header text and the close icon should always be visible when we’re on a scroll for the modal.

• All modals should be centred on the desktop app.

Texts

• All page title on every domain should be Gilroy 28px.

Colors

• Headings should be the Lisk black color and all subtexts should be in grey (Light and dark mode).

Buttons

• All buttons should have a spinner when calling an API or if there's a response time needed after clicking the button/CTA.

Side bar

• All icons and text that are inactive should be in silver grey color, and disabled side menu should be blue grey.
• On expansion and collapsing, the main elements of the desktop app should have a 24px margin on all sides.

Layout

• 24 px margin to the left, top and right even when expanded.

Error fallback UI
When there’s an error loading the app anytime I open it, the error fallback UI should not take the whole desktop app, users should still be able to see their nav bars and top nav. As the error might be from a particular network and not necessarily all the app. So this way, users are able to change the network. Design

Input fields
All Input fields on desktop should be 48px.

Side menu

• All side menu icons and texts should have the Silver grey color when inactive.

Search/FIlter

• The border radius should be 40px for the filter filed on the stakers section in a validator's profile. Check here.

Error message

• All error message should show beneath the input field as a text and not as a banner.. Check here