make more info UI clearer in plants view

[GILREICH1]

Some extra UI needed to make it clear more info is available.
Suggestions:

Also possible:
remove latin name and place button here

[willdelorm]

Hey there, I'd be happy to help with this! Are you looking to make things "clearer" for mobile or desktop or both? I could add an on hover change for desktop users.

For mobile, most folks would intuitively think to press the tile for more info. That's pretty standard on sites like this one. I could add a chevron/arrow like you drew or provide a more obvious link to each tile. What do you think?

[GILREICH1]

Thanks @willdelorm. There's already an on hover change for desktop, it's mobile that I think is unclear at the moment. Chevron is not mandatory, but some UI for mobile that indicates more information is available on click would be useful. Could be solely for mobile. Glad to have your help with this.

[willdelorm]

Could you direct me on setting up Auth0 for your app?

[GILREICH1]

Sure! The application uses this flow. The first step is signing up for a free Auth0 account .

For the client side
Within your Auth0 account, create a new Single Page Application that uses React. You then will have access to the environment variables that you need to add to the .env file in the frontend as listed in the .env.example. You will then have to configure logout and callback URLs, which means adding the value 'http://localhost:3000' into these textboxes within your application settings. You can refer to Step 1 of this guide for info.

For the Server side
Certain endpoints (those that allow database interaction) require the user to be authorized. Therefore Auth0 is used server side as well. To set this up, follow this video tutorial. Note that the identifier you choose in setting up the API is the value you need to input as the 'Audience' in both the client and server side .env files.

Let me know if you have any problems along the way!