improve team display

[JustinStitt]

I was browsing the site and realized how poor the team display is on the home page.

This PR aims to make it more bearable (also tall display support!)

OLD

notice how the text doesn't line up and the logos cover the text

NEW (with tall display support)

fixed height logos, tall display utilizes stacked display

Various resizing stuff

[netlify]

✅ Deploy Preview for acmcsuf ready!

Name	Link
🔨 Latest commit	4fddfdd
🔍 Latest deploy log	https://app.netlify.com/sites/acmcsuf/deploys/6448c572af7493000884a3b1
😎 Deploy Preview	https://deploy-preview-839--acmcsuf.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site settings.

[karnikaavelumani]

Thank you so much Justin for your PR! I believe I made an issue for this somewhere so if I remember I will reference and close that issue.

Can you make the badges just a bit smaller before you merge? Overall it looks amazing!

[JustinStitt]

Thank you so much Justin for your PR! I believe I made an issue for this somewhere so if I remember I will reference and close that issue.

Can you make the badges just a bit smaller before you merge? Overall it looks amazing!

What badges? The team logos? I didn't change their size on Desktop version. If you mean on the tall display version then yeah, let me know by what % they should shrink by.

The idea for the tall display stacked version is that the logo is approximately the same size as the text to sell the effect a bit better.

Please pull my branch locally and experiment with a better size for the logos.

[karnikaavelumani]

I apologize I meant the logos. The reason for the overflow was because I updated the assets with no padding. Before when there was padding, the logos looked a bit smaller.

You might have to change the width now or just add padding to the img tag.

[JustinStitt]

I apologize I meant the logos. The reason for the overflow was because I updated the assets with no padding. Before when there was padding, the logos looked a bit smaller.

You might have to change the width now or just add padding to the img tag.

Honestly, out of scope of my PR. Create an issue (or revive an old issue) and create a new PR after this one is merged.

It's meaningless to discuss how many pixels the logos should be smaller by then I go and do it and update my PR only to be off by a few pixels of what is desired.

I was mainly concerned with text alignment and tall display styles.

[karnikaavelumani]

Sounds good! That's why I approved this PR in the first place. I will take that advice and apply it.

Feel free to merge!

[EthanThatOneKid]

LGTM! Thank you for the contribution, @JustinStitt. I’ll go ahead and merge this PR in a moment.

[jaasonw]

nice