Begin adding G-berg styles.

affinity/blocks.css

@@ -0,0 +1,280 @@
+/*--------------------------------------------------------------
+## Gutenberg Styles
+--------------------------------------------------------------*/
+
+/* Alignments */
+.alignfull {
+	text-align: center;
+	max-width: 100%;
+}
+
+.alignwide {
+	/* max-width: 75%; */
+	max-width: 1020px;
+	margin-left: auto;
+	margin-right: auto;
+}
+
+.alignleft figcaption {}
+
+.alignright figcaption {}
+
+.wp-block-image.alignleft {}
+
+.wp-block-image.alignright {}
+
+.wp-block-image.aligncenter {}
+
+.wp-block-gallery.alignleft,
+.wp-block-gallery.alignright {}
+
+/* Text sizing */
+.is-small-text {}
+.is-regular-text {}
+.is-large-text {}
+.is-larger-text {}
+
+
+/* Dropcaps */
+p.has-drop-cap:first-letter {
+	font-family: -apple-system, "SF Pro Text", BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue", sans-serif;
+	font-size: 64px;
+	font-size: 6.4rem;
+}
+
+/* Images */
+.wp-block-image {}
+
+.wp-block-image figcaption {}
+
+/* Galleries */
+.wp-block-gallery {
+	margin-bottom: 3rem;
+}
+.columns-1 {}
+.columns-2 {}
+.columns-3 {}
+.columns-4 {}
+.columns-5 {}
+
+/* Captions */
+.wp-block-image figcaption,
+.wp-block-audio figcaption,
+.wp-block-video figcaption {
+	color: #606060;
+}
+
+/* Blockquotes*/
+.wp-block-quote {
+	color: #99908a;
+	font-size: 18px;
+	font-size: 1.125rem;
+	font-style: italic;
+	margin: 0;
+	border-top: 3px solid #e8e9ea;
+	padding-top: .8em;
+	border-bottom: 1px solid #e8e9ea;
+	margin-bottom: .8em;
+	padding-bottom: .8em;
+}
+
+.wp-block-quote.is-large {
+}
+
+.wp-block-quote p:last-of-type {
+	margin-bottom: 0;
+}
+
+.wp-block-quote cite {
+	display: block;
+	text-align: right;
+	font-style: normal;
+	font-size: 16px;
+}
+
+.blocks-quote-style-1 {}
+.blocks-quote-style-2 {}
+
+/* Cover Images */
+.wp-block-cover-image {}
+.wp-block-cover-image.alignfull {}
+
+.wp-block-cover-image.has-background-dim:before {}
+.has-parallax {}
+
+/* Video */
+.wp-block-video {}
+
+/* Audio */
+.wp-block-audio {}
+
+.wp-block-audio.alignleft,
+.wp-block-audio.alignright {
+	width: 32rem;
+}
+
+.wp-block-video video,
+.wp-block-audio audio {
+	height: auto;
+	width: 100%;
+}
+
+/* Pullquotes */
+.wp-block-pullquote {
+	padding: 0;
+}
+.wp-block-pullquote blockquote {
+	color: #99908a;
+	font-size: 18px;
+	font-size: 1.125rem;
+	font-style: italic;
+	margin: 0;
+	border-top: 3px solid #e8e9ea;
+	padding-top: .8em;
+	border-bottom: 1px solid #e8e9ea;
+	margin-bottom: .8em;
+	padding-bottom: .8em;
+}
+
+.wp-block-pullquote blockquote > p {}
+
+.wp-block-pullquote blockquote > cite {
+	display: block;
+	text-align: right;
+	font-style: normal;
+	font-size: 16px;
+	font-size: 1rem;
+}
+
+.wp-block-pullquote.alignleft blockquote > p,
+.wp-block-pullquote.alignright blockquote > p {}
+
+.entry-content .wp-block-pullquote.alignleft {
+	text-align: left;
+}
+
+.entry-content .wp-block-pullquote.alignright {
+	text-align: right;
+}
+
+.wp-block-pullquote.alignleft,
+.wp-block-pullquote.alignright {
+	max-width: 320px;
+	padding-bottom: 2rem;
+	padding-top: 1rem;
+}
+
+.wp-block-pullquote.alignwide {
+}
+
+.wp-block-pullquote.alignfull {
+}
+
+/* Categories */
+.wp-block-categories-list {}
+
+/* Tables */
+.wp-block-table {
+	display: table;
+}
+
+.wp-block-table.alignleft,
+.wp-block-table.alignright {
+	max-width: 50%;
+}
+
+/* Preformatted */
+.wp-block-preformatted {
+	background: #e8e9ea;
+	font-family: "Courier 10 Pitch", Courier, monospace;
+	font-size: 13.2px;
+	line-height: 1.6;
+	margin-bottom: 1.6em;
+	max-width: 100%;
+	overflow: auto;
+	padding: 1.6em;
+}
+
+/* Code */
+.wp-block-code {
+	font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
+	font-size: 13.2px;
+}
+
+/* Verse */
+.wp-block-verse {
+	background: #e8e9ea;
+	font-family: "Courier 10 Pitch", Courier, monospace;
+	font-size: 13.2px;
+	line-height: 1.6;
+	margin-bottom: 1.6em;
+	max-width: 100%;
+	overflow: auto;
+	padding: 1.6em;
+}
+.wp-block-verse.aligncenter {
+	text-align: center;
+}
+
+.wp-block-verse.alignleft {
+	text-align: left;
+}
+
+.wp-block-verse.alignright {
+	text-align: right;
+}
+
+/* Separator */
+.wp-block-separator {
+	background-color: #e8e9ea;
+	border: 0;
+	height: 1px;
+	margin: 0.8em auto;
+	max-width: 66%;
+}
+.wp-block-separator.is-style-wide {
+	max-width: 100%;
+}
+
+/* Buttons */
+.wp-block-button .wp-block-button__link {
+	border-radius: 0;
+	font-size: 13.2px;
+	font-family: Raleway, "Helvetica Neue", sans-serif;
+	text-transform: uppercase;
+	letter-spacing: 1px;
+	font-weight: bold;
+	line-height: 1;
+	transition: 0.3s;
+	text-decoration: none;
+}
+
+.wp-block-button__link:hover {
+}
+
+.wp-block-button .wp-block-button__link {}
+.wp-block-button a {}
+.wp-block-button a:hover,
+.wp-block-button a:focus,
+.wp-block-button a:active {}
+
+/* Text Columns */
+.wp-block-columns {
+	justify-content: space-between;
+}
+.wp-block-column {
+	flex: initial;
+}
+.wp-block-columns.has-2-columns .wp-block-column {
+	width: 47%;
+}
+.wp-block-columns.has-3-columns .wp-block-column {
+	width: 30%;
+}
+.wp-block-columns.has-4-columns .wp-block-column {
+	width: 23%;
+}
+
+/* Latest Posts */
+.wp-block-latest-posts {}
+.wp-block-latest-posts__post-date {}

affinity/editor-style.css

@@ -0,0 +1,393 @@
+/* Gutenberg Editor Styles */
+
+.editor-block-list__layout,
+.editor-block-list__layout p {
+	color: #1e1c1b;
+	font-family: Lora, Baskerville, Georgia, Times, serif;
+}
+
+.editor-block-list__layout a {
+	color: #99908a;
+  	transition: 0.3s;
+}
+
+.editor-block-list__layout a:visited {
+	color: #99908a;
+}
+
+.editor-block-list__layout a:hover,
+.editor-block-list__layout a:focus,
+.editor-block-list__layout a:active {
+	color: #383e44;
+}
+
+.editor-block-list__layout a:focus {
+	outline: thin dotted;
+}
+
+.editor-block-list__layout a:hover,
+.editor-block-list__layout a:active {
+	outline: 0;
+	text-decoration: none;
+}
+
+h1.mce-content-body,
+h2.mce-content-body,
+h3.mce-content-body,
+h4.mce-content-body,
+h5.mce-content-body,
+h6.mce-content-body,
+.editor-block-list__block[data-type="core/heading"] h1,
+.editor-block-list__block[data-type="core/heading"] h2,
+.editor-block-list__block[data-type="core/heading"] h3,
+.editor-block-list__block[data-type="core/heading"] h4,
+.editor-block-list__block[data-type="core/heading"] h5,
+.editor-block-list__block[data-type="core/heading"] h6 {
+	clear: both;
+	color: #1e1c1b;
+	font-family: Lora, Baskerville, Georgia, Times, serif;
+	font-style: italic;
+	font-weight: normal;
+	margin-top: 0.2em;
+	margin-bottom: 0.2em;
+}
+
+.editor-block-list__block[data-type="core/heading"] h1 {
+	font-size: 34px;
+}
+
+.editor-block-list__block[data-type="core/heading"] h2 {
+	font-size: 29.2px;
+}
+
+.editor-block-list__block[data-type="core/heading"] h3 {
+	font-size: 26px;
+}
+
+.editor-block-list__block[data-type="core/heading"] h4 {
+	font-size: 18px;
+}
+
+.editor-block-list__block[data-type="core/heading"] h5 {
+	font-size: 16px;
+}
+
+.editor-block-list__block[data-type="core/heading"] h6 {
+	font-size: 14px;
+}
+
+p {
+	margin-bottom: 1.6em;
+}
+
+dfn, cite, em, i {
+	font-style: italic;
+}
+
+blockquote {
+	color: #99908a;
+	font-size: 18px;
+	font-style: italic;
+	margin: 0;
+	border-top: 3px solid #e8e9ea;
+	padding-top: .8em;
+	border-bottom: 1px solid #e8e9ea;
+	margin-bottom: .8em;
+	padding-bottom: .8em;
+}
+
+blockquote cite {
+	display: block;
+	text-align: right;
+	font-style: normal;
+	font-size: 16px;
+}
+
+address {
+	margin: 0 0 1.6em;
+}
+
+pre {
+	background: #e8e9ea;
+	font-family: "Courier 10 Pitch", Courier, monospace;
+	font-size: 13.2px;
+	line-height: 1.6;
+	margin-bottom: 1.6em;
+	max-width: 100%;
+	overflow: auto;
+	padding: 1.6em;
+}
+
+code, kbd, tt, var {
+	font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
+	font-size: 15px;
+}
+
+abbr, acronym {
+	border-bottom: 1px dotted #666;
+	cursor: help;
+}
+
+mark, ins {
+	background: #fff9c0;
+	text-decoration: none;
+}
+
+big {
+	font-size: 125%;
+}
+
+.aligncenter img {
+	display: block;
+	margin: 0 auto;
+}
+
+/* Dropcaps */
+p.has-drop-cap:first-letter {
+	font-family: "Zilla Slab", "Merriweather", Georgia, "Times New Roman", serif;
+	font-size: 4.8em;
+	margin-right: .1em;
+}
+
+/* Images */
+.wp-block-image {
+	margin-bottom: 1.6em;
+}
+.wp-block-image figcaption {
+	font-style: italic;
+	font-size: 14px;
+	margin: .8em auto;
+}
+
+/* Galleries */
+.wp-block-gallery {}
+.columns-1 {}
+.columns-2 {}
+.columns-3 {}
+.columns-4 {}
+.columns-5 {}
+
+/* Blockquotes*/
+.wp-block-quote > .blocks-editable p {
+	font-size: 24px;
+}
+.wp-block-quote:not(.is-large) {
+	border: 0;
+	padding-left: 0;
+}
+.wp-block-quote p:last-of-type {
+	margin-bottom: .4em;
+}
+.wp-block-quote cite,
+.wp-block-quote > .blocks-editable footer {
+	display: block;
+	font-size: 16px;
+	font-style: normal;
+	color: #888;
+	margin-bottom: 1.6em;
+	text-align: right;
+	width: 100%;
+}
+.blocks-quote-style-1 {}
+.blocks-quote-style-2 {}
+
+/* Cover Images */
+.wp-block-cover-image {
+	margin: 0 0 1.6em;
+}
+.wp-block-cover-image h1,
+.wp-block-cover-image h2,
+.wp-block-cover-image h3,
+.wp-block-cover-image h4,
+.wp-block-cover-image h5,
+.wp-block-cover-image h6 {
+	color: #fff;
+	font-weight: normal;
+}
+.wp-block-cover-image .blocks-editable strong {
+	font-weight: bold;
+}
+.wp-block-cover-image .blocks-editable a,
+.wp-block-cover-image .blocks-editable a:visited {
+	color: white;
+	opacity: 1;
+	transition: 0.3s opacity;
+}
+.wp-block-cover-image .blocks-editable a:hover,
+.wp-block-cover-image .blocks-editable a:focus,
+.wp-block-cover-image .blocks-editable a:active {
+	color: white;
+	opacity: 0.5;
+}
+.has-background-dim {}
+.has-parallax {}
+
+/* Video */
+.wp-block-video {
+	margin: 0 0 1.6em;
+}
+.wp-block-video video {
+	display: block;
+	max-width: 100%;
+	margin: 0 auto;
+}
+
+/* Audio */
+.wp-block-audio {}
+
+/* Pullquotes */
+.wp-block-pullquote {
+	padding: 0;
+}
+.wp-block-pullquote > .blocks-editable p,
+.wp-block-pullquote blockquote > p {
+	font-size: 36px;
+	font-style: normal;
+	font-family: "Zilla Slab", "Merriweather", Georgia, "Times New Roman", serif;
+	margin: 0 0 .8em;
+	line-height: 1.1;
+	color: #4cb0c1;
+}
+.wp-block-pullquote blockquote {
+	color: #99908a;
+	font-size: 18px;
+	font-size: 1.125rem;
+	font-style: italic;
+	margin: 0;
+	border-top: 3px solid #e8e9ea;
+	padding-top: .8em;
+	border-bottom: 1px solid #e8e9ea;
+	margin-bottom: .8em;
+	padding-bottom: .8em;
+}
+.wp-block-pullquote blockquote > p {
+}
+.wp-block-pullquote > cite,
+.wp-block-pullquote > .blocks-editable footer {
+	font-family: "Merriweather Sans", Helvetica, Arial, sans-serif;
+	font-style: normal;
+	line-height: 1.6;
+	font-size: 14px;
+	color: #444;
+	text-transform: uppercase;
+	letter-spacing: 1px;
+	font-weight: bold;
+}
+
+.wp-block-pullquote.alignleft > p,
+.wp-block-pullquote.alignright > p {
+	font-size: 24px;
+	line-height: 1.4;
+}
+
+/* Tables */
+.wp-block-table {
+	display: table;
+	margin: 0 0 1.6em;
+	width: 100%;
+}
+
+.wp-block-table td,
+.wp-block-table th {
+  padding: 0.4em 0.2em;
+  border-bottom: 1px solid #e8e9ea;
+}
+
+.wp-block-table th {
+  font-weight: bold;
+  border-bottom-width: 3px;
+  text-align: left;
+}
+
+.wp-block-table caption {
+  font-style: italic;
+  font-weight: bold;
+}
+
+.wp-block-table.alignleft,
+.wp-block-table.alignright {
+	max-width: 50%;
+}
+
+/* Preformatted */
+.wp-block-preformatted {
+	background: #e8e9ea;
+	font-family: "Courier 10 Pitch", Courier, monospace;
+	font-size: 13.2px;
+	line-height: 1.6;
+	margin-bottom: 1.6em;
+	max-width: 100%;
+	overflow: auto;
+	padding: 1.6em;
+}
+
+/* Code */
+.wp-block-code {
+	font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
+	font-size: 13.2px;
+}
+
+/* Verse */
+.wp-block-verse {
+	background: #e8e9ea;
+	font-family: "Courier 10 Pitch", Courier, monospace;
+	font-size: 13.2px;
+	line-height: 1.6;
+	margin-bottom: 1.6em;
+	max-width: 100%;
+	overflow: auto;
+	padding: 1.6em;
+}
+
+.wp-block-verse.aligncenter {
+	text-align: center;
+}
+
+.wp-block-verse.alignleft {
+	text-align: left;
+}
+
+.wp-block-verse.alignright {
+	text-align: right;
+}
+
+/* Separator */
+.wp-block-separator {
+	background-color: #e8e9ea;
+	border: 0;
+	height: 1px;
+	margin: 0.8em auto;
+	max-width: 66%;
+}
+.wp-block-separator.is-style-wide {
+	max-width: 100%;
+}
+/* Buttons */
+.wp-block-button {
+	border-radius: 0;
+	display: block;
+	font-size: 13.2px;
+	font-family: Raleway, "Helvetica Neue", sans-serif;
+	text-transform: uppercase;
+	letter-spacing: 1px;
+	font-weight: bold;
+	line-height: 1;
+	transition: 0.3s;
+	text-decoration: none;
+}
+
+.wp-block-button .wp-block-button__link:hover,
+.wp-block-button .wp-block-button__link:focus,
+.wp-block-button .wp-block-button__link:active {
+}
+
+/* Text Columns */
+.wp-block-text-columns {}
+.wp-block-column {}
+
+/* Latest Posts */
+.wp-block-latest-posts {}
+.wp-block-latest-posts__post-date {
+	color: #888;
+}
+.is-grid {}

affinity/functions.php

@@ -233,6 +233,9 @@ function affinity_fonts_url() {
 function affinity_scripts() {
 	wp_enqueue_style( 'affinity-style', get_stylesheet_uri() );
 
+	// Gutenberg styles
+	wp_enqueue_style( 'affinity-blocks', get_template_directory_uri() . '/blocks.css' );
+
 	wp_enqueue_style( 'affinity-fonts', affinity_fonts_url(), array(), null );
 
 	wp_enqueue_style( 'genericons', get_template_directory_uri() . '/fonts/genericons/genericons.css', array(), '3.4.1' );
@@ -253,6 +256,15 @@ function affinity_scripts() {
 }
 add_action( 'wp_enqueue_scripts', 'affinity_scripts' );
 
+/** 
+ * Gutenberg Editor Styles 
+ */
+function affinity_editor_styles() {
+	wp_enqueue_style( 'affinity-editor-style', get_template_directory_uri() . '/editor-style.css');
+	wp_enqueue_style( 'affinity-fonts', affinity_fonts_url(), array(), null );
+}
+add_action( 'enqueue_block_editor_assets', 'affinity_editor_styles' );
+
 
 /* Allow user to adjust opacity of overlay to work with lighter/darker photos */
 function affinity_style_options() {