Events: Breakpoint change for a cleaner cover

[renintw]

Fixes #1138

Screencast

Keep the mobile's vertical distribution of cover area (Heading, sub text, and map) until it reaches 960px

temp.cover.resize.mp4

Between 600-900, place location, date, and time labels horizontally in a single line.

fff.mp4

[StevenDufresne]

This looks better.

I don't think we need to stack the dates anymore since the font-size was brought down to 14px until large screens.

[renintw]

You mean this one, right?

If not stacking, for some screen size, it would look like this (this is under screen size wider than large, 960px)

Saw this as well on screen size 963px

And found that the font size changes to 14px until xlarge 1080px, instead of large 960px. Just noted. It doesn't change anything if switching font size earlier when it reaches 960px.

[StevenDufresne]

I see, there are cases where it breaks and looks bad.

I'm starting to think we could do this instead:

[renintw]

I've pushed a new change, it should match our expectations now.

I made the Date block size bigger, 1.5fr. I guess this would fit the longest format of the date. (Saturday, April 30?)

[StevenDufresne]

Doesn't work in all cases.

[renintw]

OK, I've changed it from 1.5fr to 2fr. It works for

I think this is the longest one? Although I think for April it would be Apr? This form isn't broken under all screen sizes.

Also tried Wednesday, March 31

asdfds.mp4

[StevenDufresne]

Okay, let's go with this. We can adjust later.

[StevenDufresne]

Something I missed: On wide screens the location should be closer to the date.

Production	Designs

[renintw]

Something I missed: On wide screens the location should be closer to the date.

Fixed in #1175