Fix accessibility issues for keyboard-only users, and fix some Safari bugs #268

Also fixed a couple of Safari-specific bugs. Summary:

Added a secondary-accent ring around buttons on focus. (White didn't show up very well against the background.) We can always chat with design about this later if we want to change it.
Fixed the weirdness with tabbing over the headers on the Advice pages. I also made the header flex vertically on mobile screens - this fixes the issue of extra whitespace on the right side, and is also somewhat consistent with the menu-y thing at the top of the mobile Meet the Team page.
- I was very tempted to do this on the Events term archive pages as well, but I figured I should get someone else's opinion on that first.
Removed the extra triangle symbol in the MiniEventCard on Safari. I had to use a vendor prefix, but if anyone else can come up with something better, then please do that, thank you.
Stopped the home page "Computer Science Club" from breaking into two lines on small desktop screens.
Added extra space to mobile footer.

Closes #250
Closes #248
Closes #253
Closes #256
Closes #261

Added a secondary-accent ring around buttons on focus. (White didn't show up very well against the background.) We can always chat with design about this later if we want to change it.

✅

Fixed the weirdness with tabbing over the headers on the Advice pages. I also made the header flex vertically on mobile screens - this fixes the issue of extra whitespace on the right side, and is also somewhat consistent with the menu-y thing at the top of the mobile Meet the Team page.
I was very tempted to do this on the Events term archive pages as well, but I figured I should get someone else's opinion on that first.

✅ Do it! It looks much better than what it is right now, also much more consistent with the rest of the website!

Removed the extra triangle symbol in the MiniEventCard on Safari. I had to use a vendor prefix, but if anyone else can come up with something better, then please do that, thank you.

✅

Stopped the home page "Computer Science Club" from breaking into two lines on large desktop screens.

✅

Added extra space to mobile footer.

✅

I can't test on Safari, so let's ~~assign this PR to someone~~ add a reviewer who has a mac. Then they could approve this PR if everything looks good, and we can merge!

Update: I tested it on my roommate's mac.

   .container {
     flex-direction: column-reverse;
     justify-content: space-around;
     gap: calc(4rem / 16);

Fix accessibility issues for keyboard-only users, and fix some Safari bugs #268

Reviewers