Custom solution: Careers homepage background video

[sghoweri]

Jira

http://vjira2:8080/browse/BDS-1013

Summary

Created a custom solution (non-Bolt) to insert an autoplaying video into a band.

Details

1. Custom CSS is written inline on the page markup with the <style> tag.
2. The custom video is added to the band background through a block.
3. Variables are set up for all the editable fields.

How to test

1. Run the branch locally.
2. Check the mockup page: http://localhost:3000/pattern-lab/patterns/04-pages-50-d8-careers-00-careers-homepage/04-pages-50-d8-careers-00-careers-homepage.html

Limitations of this custom solution

1. Background video must be square to accommodate all screen sizes and the dynamic height and width of the band.
2. Background video should only be served as a decoration, expect it to be cropped anywhere within its square size.
3. Background video disappears when the browser size falls below 800px, this is where the white space is diminishing to a point that makes the height of the band longer than width of the band, which could result in the video not covering the entire background.
4. Background video poster must be provided as a fallback for when video disappears.

[remydenton]

This all works as expected. Nice work @mikemai2awesome!