Full page image for home page

Let's make a simple header that has a background image filling the page, with centered text. Similar to the one here: http://superbe.be/

I like this design because it gives a quick impression of the site - the image placement gives a lot of freedom to set the tone.

I'm using this css to place the image and text: https://www.w3schools.com/howto/howto_css_hero_image.asp

At first, I wanted to create a block, however this requires styling a region.

Add a Cover region to theme.info.yml.

Print Cover region in page.html.twig.

Add image files to theme.

Add css for Cover region background and content.

TODO: Configurable image.

TODO: Discuss other image scaling options.

TODO: Make image responsive.

TODO: Configure image per page.

Tags
Theming