Add support for background header image to event page - IDEA 41

[mattstratton]

If this is set, then it should display as the background. If it is not set, then it should not have a background image.

ProdPad URL

Effort: 9/10
Impact: 6/10

[mattstratton]

I have a branch with this as a POC - you can see it on Chicago at this link:

https://deploy-preview-447--devopsdays-theme.netlify.com/events/2017-chicago/

[mattstratton]

A few things to note:

1. Need to give some guidance around the ratio/size for the image to use as the background; if you look at that page in different viewports, you can see that it moves around what parts it shows.
2. The CTA buttons change to be non-transparent (they now have a gray background) if the header image is enabled.
3. The field that defines the background header image is currently called background; this should probably be more descriptive. Changed it to masthead_background
4. The code assumes that the image defined in masthead_background is relative to static/events/YYYY-CITY/ folder. We don't do a check for that existing, which means that if someone sets the value of background, but doesn't put the image there, I don't think Hugo will fail, but there will be a 404 in the background. I am pretty sure what happens is that the gradient displays, but it will overlay the modified CTA buttons which might look a little odd. This is an edge case but stranger things have happened.
5. There is inline style used in layouts/partials/welcome.html now; it's a copy-pasta from some of the stuff in the SCSS, so when we refactor that to use named colors, that's just going to have to stay messed up. Meh.

TODO:

• Change the background field to be a better name.
• Update docs (use the documentation-updates branch REFERENCE.md right now; no need to update docs on devopsdays-web.
• Add a test that the file in background or whatever actually exists before trying to do any of the fancy stuff.

[mattstratton]

I added the test; if the file doesn't exist, it doesn't try to do anything.

So to clarify, the usage of this feature is to add a file (preferably jpg, but png should be fine I think) to the static/events/YYYY-CITY directory, and put that file name as a string in the city's data file for the field masthead_background.

You will have to experiment with the image ratio and colors to see what looks good; there's no real guidance other than please don't make it much wider than 1800px.

[mattstratton]

Implemented in #447