Join page looks like the mockups

[utunga]

On desktop: https://www.figma.com/proto/sq4aGgw7IQAbuRkXcFTaap/Cashless?node-id=1166%3A21710&scaling=min-zoom

On mobile: https://www.figma.com/proto/sq4aGgw7IQAbuRkXcFTaap/Cashless?node-id=1166%3A21772&scaling=min-zoom

Acceptance criteria from the parent epic - #7

-[ ] as anon i can signup choose a name and profile and post things to my feed immediately

[sarah-arrrgh]

Brain thoughts 🧠

• why does body content spill over footer?
• what was .wrapper being used for in SignupPage.js? (I removed it and replaced it with .page-header...)
• why does .page-header stop the body content from hiding behind the topnav, but not from spilling over the footer?

[sarah-arrrgh]

This is ready for @karenkun to come and make it look good!

Branch 51/join-page

I have used the creativetim ImageUpload component for the profile image upload - @karenkun to confirm this is fine (and maybe update figma??)

Recommend commenting out the <FooterSocial /> line while working on main content!

There's some funky css stuff going on here, I got some of the way to figuring it out. Here's a maybe helpful summary:

• the .wrapper div seemed to not keep the content from disappearing behind the navbar. the .page-header seemed to do the trick, but then all the text was rendered white and the bg grey
• .page-header:before seems to be responsible for making the bg grey
• .page-header + .containerseems to be responsible for making the text white

[utunga]

It's looking great now. Not sure all the people involved but good enough for this issue. Couple styling issues once you are actually logged in but we can addres those later.