Standardize Events page: add section container without restricting banner

[daniellex0]

Overview

We want to add a section container (class .content-section) to the Events page body to keep this page consistent with other pages on the HfLA website.

This container ensures that the page has the standard 16px margin in mobile view. However, it adds the margin to the yellow covid warning banner as well, and we want that component to stay full-screen width if possible.

Action Items

• [x] To stay consistent with other pages, add an additional class to the section tag that currently has class .events-page, and name it .content-section (standard scss is already attached to this class)
• [x] Figure out a way to keep the yellow covid alert banner full-screen width despite the new section container
  • [x] Research potential solutions- this CSS tricks article (although it looks a bit overly complicated), etc
  • [x] If there is no simple solution / it's overly complicated, remove the .content-section container and notify @daniellex0

Resources/Instructions

Events page

This is how the banner looks with the .content-section class, without any edits (it should instead be full-width, without the purple margins on the sides):

[evancchen]

Is this ok?

[evancchen]

This is how it used to look

[daniellex0]

@evancchen Hi Evan, the yellow looks like it goes all the way to the edges of the screen, so that's good. The only issues are that the pink arrow and icon are a little too pushed up to the edges, the paragraph text is a little too crowded in the middle, and it looks like there is white area around the palm tree photo for some reason.

It should look more like it looks on the site right now, so like this:

I'm sorry, I know this issue is kind of a pain and won't really make a difference to the way the page looks- it's just for standardizing the CSS on all of the pages.

If it's overly complicated, we could just leave out the .content-section class from this page for now and leave this issue in the ice box to be honest.

So feel free to skip out on this issue and choose another one if you prefer!