Import NFT token form needs redesign

[DarksightKellar]

The positioning of the helper text and the potential for error text conflict each other:

[xanaramoss]

@DarksightKellar
I would suggest shifting the grey text down by 4–8 pixels when the alert mode is active.

[DarksightKellar]

Oh. I lost track of this issue. 2 weeks. Yikes.

@xanaramoss I dunno about shifting the hint down on error. It'll cause distracting visual jank as the input goes from valid->error->valid states and the grey text gets pushed down to accommodate for the red text. Plus doing this feels like just deferring the problem to the next guy -- whatever happens to be below the red and grey text. Might also mess up spacing on elements below.

As I'm writing this a crazy-ish thought occurred to me: we could hide the hint text whenever this error shows up. Cz it's like they kinda have to occupy the same visual space.

That or a redesign are only things I'll be happy with lol 😅

EDIT: Another place this design doesn't work out, and actually a good example of why shifting down might not work (notice text button right below the input)

EDIT EDIT: I have to ask, is there nowhere else this input layout style is used? Can't find anywhere else after a quick search. If so I don't see any reason keeping it around, since it then sticks out against all other form inputs and is inconsistent.

[xanaramoss]

@DarksightKellar I understand your point.
Hiding the helper text could be a good solution, but at the same time, it feels a bit off because the text can actually be helpful for this situation.
I’ll bring this up in the design sync in 30 min to explore redesign possibilities, as no immediate solutions come to mind.