Implement user friendly element ID's in the nym-wallet

[tommyv1987]

Description

In the nym_wallet some elements have easily identifiable ID's, yet the majority of the wallet have long path selectors:

Can we update the elements in the project to resemble:

get sphinxKey() {
    return $("#sphinxKey");
  }

Quite a lot of the elements in the project have long hard to distinguish selectors, like below:

  get advancedOptions() {
    return $("#root > div > div:nth-child(2) > div:nth-child(2) > div > div > div > div.MuiCardContent-root > div.MuiFormControl-root.MuiFormControl-fullWidth > div:nth-child(1) > div > div:nth-child(8) > label > span.MuiButtonBase-root.MuiIconButton-root.PrivateSwitchBase-root-13.MuiCheckbox-root.MuiCheckbox-colorSecondary.MuiIconButton-colorSecondary > span.MuiIconButton-label > input");
  }

  get selectAdvancedOptions() {
    return $("#root > div > div:nth-child(2) > div:nth-child(2) > div > div > div > div.MuiCardContent-root > div.MuiFormControl-root.MuiFormControl-fullWidth > div:nth-child(1) > div > div:nth-child(8) > label > span.MuiButtonBase-root.MuiIconButton-root.PrivateSwitchBase-root-7.MuiCheckbox-root.MuiCheckbox-colorSecondary.MuiIconButton-colorSecondary");

  }

Therefore, if we continue to automate the GUI on the wallet, updating elements and attributes will be a quick task.

[tommyv1987]

PR - raised - #836