mehdibo / paseto-debugger

A tool to debug Paseto tokens online
https://paseto-debugger.herokuapp.com/
MIT License
1 stars 1 forks source link

Better styling #1

Open mehdibo opened 4 years ago

mehdibo commented 4 years ago

Provide a better design

matthewbub commented 4 years ago

Can I hop on this?

mehdibo commented 4 years ago

@hi-matbub Of course! Thank you

matthewbub commented 4 years ago

@mehdibo I'm trying to learn Paseto.js on the fly to see an output but am having trouble with the hex key. Anyway I could get some sample data to run through the form?

mehdibo commented 4 years ago

You can have this one:

v2.local.b1-e8XH4OGbIa7YOflT8Fy9ukWQuwiJ20imvQDyotK8YaSQxDxPPabSvd8fqCpUVmN26togRUynK_CFlXj-oswzDWi79vzwVf1rfKwB23xjCBQRblDnp1G_xhUx19g6qQ-nD2bBIiwAJffDp-mbZX_xdqN_-_UVl0Bx3DaQA3MYIVIVM6HMgPbl7Xg

and the secret is:

d81dd3a8495015d5cf5550ffa9485c0ba1adfbe85cd1ce1b66fba15294612152
matthewbub commented 4 years ago

Mind if I switch the order of the output and button like so?

<button type={"submit"}>Decode</button>
  <br />
<ReactJsonSyntaxHighlighter obj={payload} />

Imo It feels more natural to see the response render below the button

mehdibo commented 4 years ago

Yeah, go ahead. The main purpose of this issue is to turn the UI into an organised one, this is my first usage of Next js, I'm more of a backend guy.

Do whatever you think will make the ui look better.