ODK-X Survey: Update the button, Icons and list view of the home screen.

[teelda]

The home screen of the ODK-X Survey for returning users doesn't have a clear hierarchy of information and doesn't meet the ODK-X Design Guidelines.

Objectives:

• Update the button with the right colour and styles as shown in the ODK-X Guidelines.
• Use appropriate Icons to clearly represent what the icons stand for; e.g "Delete Icon" instead of a "Close Icon"
• Improve the overall interface of the screen.

[Cveman1]

What you have is fine @teelda

I think you should use the cards of the second one for the first one. But retain the position of the button on the first one.

Also, like we discussed on the call, you probably want to use colours to signify the different 'incomplete', and 'finalized' status.

[teelda]

@Cveman1 I updated this screen based on your feedback and I used the status chip style used in material design here.

The list view style was also updated with the following values as shown here

• Padding top and bottom 12px.
• Padding left and right 16px.

[Hasoye]

hello, i am hassanat, a ui desiger, glad to be a part of cotributors of this project. i am interested to work on this issue

[syedbarimanjan]

I want to develop this as the designing has been completed could you assign it to me!

[maprehensive]

PR for save point instances and add new instance: https://github.com/odk-x/app-designer/pull/210

Work continuing on the Save and Delete buttons. Will be a separate PR