Card layout

[joaquinkunkel]

For this team page card layout, I did the following:

1. Changed the body background color to rgb(250, 250, 250), so it is slightly different from the white cards.
2. Changed the header logo image to one with a transparent background.
3. Added a drop shadow to each team member which intensifies on hover. This interaction replaces the blue link text (the member's name remains black even on hover).
4. In the TeamMemberList component, wrapped member__name and member__job-title in a member__text div, to fix the cards' padding and margins.
5. Edited font size, margin and padding properties across the team page.

[emilgoldsmith]

@joaquinkunkel this is ready for review, yeah?

Also first of all as you can see CircleCI failed it's build (an agent that testes all pushes for us automatically for us) and as you can see if you go to the link it failed on the linting command, if you run npm run lint you can see it locally and it'll tell you where you need to fix your coding style :). Feel free to ask questions if you're confused about anything.

[joaquinkunkel]

Yes, ready for review! I think the error might have been that a line of code exceeded 100 characters (webpack did not like that). I split it into two lines and I get no webpack errors anymore so I'll try to do the request again.

[joaquinkunkel]

Okay, I think the line length was the issue because it now CircleCI passed 👍 (made two commits because I thought the issue was still there after the first one, my bad).

[emilgoldsmith]

No problem about the commits, we squash them all into one when we merge them into the master branch for a nicer commit history anyway :).

And yeah CircleCI takes a bit of time to run the tests, you should be able to go here under the pull request and under checks click details at CircleCI if you want to follow the progress of the build :).

[emilgoldsmith]

And yes it was exactly the max-len, we integrated our linter (the thing that checks coding style and ours is specifically called eslint and is the industry standard) into wepback so it automatically runs it as you build :).

[emilgoldsmith]

Things look okay on the surface for me, I'll leave the actual review of the CSS etc. to @zanemountcastle though :).

[zanemountcastle]

I really like how the cards work with the team members. It definitely feels more natural than what's live on the site now.

There are just a few minor changes mostly with regard to code style. We should be able to merge it in the next few days.

[zanemountcastle]

This image is going to have to be uploaded through the editor tools so we can load it in with our CDN. Right now the image isn't loading in.

[joaquinkunkel]

Could I e-mail you the image so you can upload it / can we do this together on Sunday? I still don't have it set up so I can upload things myself, I think.

[emilgoldsmith]

Yeah either load it with CDN (which is probably the best, yep) or add it to the static folder (but probably just as good doing it with S3 I agree).

[zanemountcastle]

I'd prefer to use hex here instead of rgb to keep coloring consistent across the code base.

[zanemountcastle]

Same thing with hex here. If possible use an already defined SCSS variable from ./src/styles/abstracts/_variables.scss like $light-grey

[emilgoldsmith]

Btw @zanemountcastle stylelint could also lint all these things if you were interested :)

[emilgoldsmith]

@zanemountcastle do we want to merge this in, he committed his changes to your comments right?

[zanemountcastle]

@emilgoldsmith No, not yet. @arantzardzm is working on the ILTs which will pair nicely with the card layout. We're working on rolling it out across all parts of the site now so I first want to merge in Arantza's branch into @joaquinkunkel's and then we'll merge them into master as a single branch.

[emilgoldsmith]

Okay sounds good :). Do whatever you deem right