rubyforgood / rubyforgood.org

Website for Ruby for Good
https://rubyforgood.org
9 stars 13 forks source link

Team member picture too small and broken social links in team member page #20

Open arielj opened 3 years ago

arielj commented 3 years ago

The image looks too small, and the icons and handles for the different social links break into the next line (see the github or twitch icons are in one line and the handles are on the next

rubyforgood org_our-team_sean-marcia(iPhone X)

FionaDL commented 3 years ago

@meg-gutshall I have played around with this a bit. A few questions: For the photo would you prefer it to just be a bit larger, or to be full width?

127 0 0 1_4000_our-team_sean-marcia(iPhone X) (1) 127 0 0 1_4000_our-team_sean-marcia(iPhone X) (2)

For the icons what would you prefer? We could have them overflow the next lines, but then the "|" looks a little weird. We could take out the "|" all together, or maybe there is another option you prefer.

Screen Shot 2021-11-03 at 12 49 14 PM Screen Shot 2021-11-03 at 12 49 01 PM Screen Shot 2021-11-03 at 12 50 23 PM Screen Shot 2021-11-03 at 12 50 39 PM

Thoughts?

meg-gutshall commented 3 years ago

Hi @FionaDL! Thank you for taking a look at this and being patient waiting for my reply.

For the photo, I like the full-width look a lot, however, could you center the "Founder and CEO" title above the photo underneath the red line? I think that would look fantastic!

The links at the bottom is difficult... I'm wondering if there's a way to display the "|" pipes normally and then remove them at the mobile breakpoint because I really like the look of that last screenshot you took.

Also, Sean hard coded this into the page in our rush to get the MVP out. I'm trying to find some time to add my dynamic template back in which will take care of that trailing pipe at the end of the list of links. One step in the big process!