Setting some base CSS values and variables

[justintadlock]

Because we decided that adding baseline Gutenberg styles into theme was a good idea, we also need to take care of some baseline width, margin, padding, size, and similar values.

For example, take this code from resources/scss/blocks/core/_cover-image.scss:

.wp-block-cover-image-text {
	color:         color( white );
	font-size:     2em;
	line-height:   1.25;
	z-index:       1;
	margin-bottom: 0;
	max-width:     content-width();
	padding:       14px;
	text-align:    center;

	a,
	a:hover,
	a:focus,
	a:active {
		color: color( white );
	}
}

As you can see, the content-width() function will return the theme's content width. However, we should take that further and allow theme authors to plug in other numeric values in /resources/scss/settings. The font-size, line-height and padding values from above could all be replaced with settings.

To do this, we'd need to identify all the places that could use such treatment and establish some standards on how to best handle that.

We could even explore existing packages/libraries that are out there.