主题

.gitignore

@@ -13,7 +13,6 @@ wp-content/*
 wp-content/plugins/hello.php
 
 # ignore specific themes
-wp-content/themes/twenty*/
 
 # ignore node dependency directories
 node_modules/
@@ -23,4 +22,5 @@ node_modules/
 *.sql
 *.sqlite
 
+.DS_Store
 wp-config.php

wp-content/themes/twentynineteen/404.php

@@ -0,0 +1,33 @@
+<?php
+/**
+ * The template for displaying 404 pages (not found)
+ *
+ * @link https://codex.wordpress.org/Creating_an_Error_404_Page
+ *
+ * @package WordPress
+ * @subpackage Twenty_Nineteen
+ * @since 1.0.0
+ */
+
+get_header();
+?>
+
+	<div id="primary" class="content-area">
+		<main id="main" class="site-main">
+
+			<div class="error-404 not-found">
+				<header class="page-header">
+					<h1 class="page-title"><?php _e( 'Oops! That page can&rsquo;t be found.', 'twentynineteen' ); ?></h1>
+				</header><!-- .page-header -->
+
+				<div class="page-content">
+					<p><?php _e( 'It looks like nothing was found at this location. Maybe try a search?', 'twentynineteen' ); ?></p>
+					<?php get_search_form(); ?>
+				</div><!-- .page-content -->
+			</div><!-- .error-404 -->
+
+		</main><!-- #main -->
+	</div><!-- #primary -->
+
+<?php
+get_footer();

wp-content/themes/twentynineteen/archive.php

@@ -0,0 +1,54 @@
+<?php
+/**
+ * The template for displaying archive pages
+ *
+ * @link https://developer.wordpress.org/themes/basics/template-hierarchy/
+ *
+ * @package WordPress
+ * @subpackage Twenty_Nineteen
+ * @since 1.0.0
+ */
+
+get_header();
+?>
+
+	<div id="primary" class="content-area">
+		<main id="main" class="site-main">
+
+		<?php if ( have_posts() ) : ?>
+
+			<header class="page-header">
+				<?php
+					the_archive_title( '<h1 class="page-title">', '</h1>' );
+				?>
+			</header><!-- .page-header -->
+
+			<?php
+			// Start the Loop.
+			while ( have_posts() ) :
+				the_post();
+
+				/*
+				 * Include the Post-Format-specific template for the content.
+				 * If you want to override this in a child theme, then include a file
+				 * called content-___.php (where ___ is the Post Format name) and that will be used instead.
+				 */
+				get_template_part( 'template-parts/content/content', 'excerpt' );
+
+				// End the loop.
+			endwhile;
+
+			// Previous/next page navigation.
+			twentynineteen_the_posts_navigation();
+
+			// If no content, include the "No posts found" template.
+		else :
+			get_template_part( 'template-parts/content/content', 'none' );
+
+		endif;
+		?>
+		</main><!-- #main -->
+	</div><!-- #primary -->
+
+<?php
+get_footer();

wp-content/themes/twentynineteen/classes/class-twentynineteen-walker-comment.php

@@ -0,0 +1,128 @@
+<?php
+/**
+ * Custom comment walker for this theme
+ *
+ * @package WordPress
+ * @subpackage Twenty_Nineteen
+ * @since 1.0.0
+ */
+
+/**
+ * This class outputs custom comment walker for HTML5 friendly WordPress comment and threaded replies.
+ *
+ * @since 1.0.0
+ */
+class TwentyNineteen_Walker_Comment extends Walker_Comment {
+
+	/**
+	 * Outputs a comment in the HTML5 format.
+	 *
+	 * @see wp_list_comments()
+	 *
+	 * @param WP_Comment $comment Comment to display.
+	 * @param int        $depth   Depth of the current comment.
+	 * @param array      $args    An array of arguments.
+	 */
+	protected function html5_comment( $comment, $depth, $args ) {
+
+		$tag = ( 'div' === $args['style'] ) ? 'div' : 'li';
+
+		?>
+		<<?php echo $tag; ?> id="comment-<?php comment_ID(); ?>" <?php comment_class( $this->has_children ? 'parent' : '', $comment ); ?>>
+			<article id="div-comment-<?php comment_ID(); ?>" class="comment-body">
+				<footer class="comment-meta">
+					<div class="comment-author vcard">
+						<?php
+						$comment_author_url = get_comment_author_url( $comment );
+						$comment_author     = get_comment_author( $comment );
+						$avatar             = get_avatar( $comment, $args['avatar_size'] );
+						if ( 0 != $args['avatar_size'] ) {
+							if ( empty( $comment_author_url ) ) {
+								echo $avatar;
+							} else {
+								printf( '<a href="%s" rel="external nofollow" class="url">', $comment_author_url );
+								echo $avatar;
+							}
+						}
+
+						/*
+						 * Using the `check` icon instead of `check_circle`, since we can't add a
+						 * fill color to the inner check shape when in circle form.
+						 */
+						if ( twentynineteen_is_comment_by_post_author( $comment ) ) {
+							printf( '<span class="post-author-badge" aria-hidden="true">%s</span>', twentynineteen_get_icon_svg( 'check', 24 ) );
+						}
+
+						printf(
+							wp_kses(
+								/* translators: %s: Comment author link. */
+								__( '%s <span class="screen-reader-text says">says:</span>', 'twentynineteen' ),
+								array(
+									'span' => array(
+										'class' => array(),
+									),
+								)
+							),
+							'<b class="fn">' . $comment_author . '</b>'
+						);
+
+						if ( ! empty( $comment_author_url ) ) {
+							echo '</a>';
+						}
+						?>
+					</div><!-- .comment-author -->
+
+					<div class="comment-metadata">
+						<a href="<?php echo esc_url( get_comment_link( $comment, $args ) ); ?>">
+							<?php
+								/* translators: 1: Comment date, 2: Comment time. */
+								$comment_timestamp = sprintf( __( '%1$s at %2$s', 'twentynineteen' ), get_comment_date( '', $comment ), get_comment_time() );
+							?>
+							<time datetime="<?php comment_time( 'c' ); ?>" title="<?php echo $comment_timestamp; ?>">
+								<?php echo $comment_timestamp; ?>
+							</time>
+						</a>
+						<?php
+							$edit_comment_icon = twentynineteen_get_icon_svg( 'edit', 16 );
+							edit_comment_link( __( 'Edit', 'twentynineteen' ), '<span class="edit-link-sep">&mdash;</span> <span class="edit-link">' . $edit_comment_icon, '</span>' );
+						?>
+					</div><!-- .comment-metadata -->
+
+					<?php
+					$commenter = wp_get_current_commenter();
+					if ( $commenter['comment_author_email'] ) {
+						$moderation_note = __( 'Your comment is awaiting moderation.', 'twentynineteen' );
+					} else {
+						$moderation_note = __( 'Your comment is awaiting moderation. This is a preview, your comment will be visible after it has been approved.', 'twentynineteen' );
+					}
+					?>
+
+					<?php if ( '0' == $comment->comment_approved ) : ?>
+					<p class="comment-awaiting-moderation"><?php echo $moderation_note; ?></p>
+					<?php endif; ?>
+
+				</footer><!-- .comment-meta -->
+
+				<div class="comment-content">
+					<?php comment_text(); ?>
+				</div><!-- .comment-content -->
+
+			</article><!-- .comment-body -->
+
+			<?php
+			comment_reply_link(
+				array_merge(
+					$args,
+					array(
+						'add_below' => 'div-comment',
+						'depth'     => $depth,
+						'max_depth' => $args['max_depth'],
+						'before'    => '<div class="comment-reply">',
+						'after'     => '</div>',
+					)
+				)
+			);
+			?>
+		<?php
+	}
+}

wp-content/themes/twentynineteen/comments.php

@@ -0,0 +1,128 @@
+<?php
+/**
+ * The template for displaying comments
+ *
+ * This is the template that displays the area of the page that contains both the current comments
+ * and the comment form.
+ *
+ * @link https://developer.wordpress.org/themes/basics/template-hierarchy/
+ *
+ * @package WordPress
+ * @subpackage Twenty_Nineteen
+ * @since 1.0.0
+ */
+
+/*
+ * If the current post is protected by a password and
+ * the visitor has not yet entered the password we will
+ * return early without loading the comments.
+*/
+if ( post_password_required() ) {
+	return;
+}
+
+$discussion = twentynineteen_get_discussion_data();
+?>
+
+<div id="comments" class="<?php echo comments_open() ? 'comments-area' : 'comments-area comments-closed'; ?>">
+	<div class="<?php echo $discussion->responses > 0 ? 'comments-title-wrap' : 'comments-title-wrap no-responses'; ?>">
+		<h2 class="comments-title">
+		<?php
+		if ( comments_open() ) {
+			if ( have_comments() ) {
+				_e( 'Join the Conversation', 'twentynineteen' );
+			} else {
+				_e( 'Leave a comment', 'twentynineteen' );
+			}
+		} else {
+			if ( '1' == $discussion->responses ) {
+				/* translators: %s: Post title. */
+				printf( _x( 'One reply on &ldquo;%s&rdquo;', 'comments title', 'twentynineteen' ), get_the_title() );
+			} else {
+				printf(
+					/* translators: 1: Number of comments, 2: Post title. */
+					_nx(
+						'%1$s reply on &ldquo;%2$s&rdquo;',
+						'%1$s replies on &ldquo;%2$s&rdquo;',
+						$discussion->responses,
+						'comments title',
+						'twentynineteen'
+					),
+					number_format_i18n( $discussion->responses ),
+					get_the_title()
+				);
+			}
+		}
+		?>
+		</h2><!-- .comments-title -->
+		<?php
+			// Only show discussion meta information when comments are open and available.
+		if ( have_comments() && comments_open() ) {
+			get_template_part( 'template-parts/post/discussion', 'meta' );
+		}
+		?>
+	</div><!-- .comments-title-flex -->
+	<?php
+	if ( have_comments() ) :
+
+		// Show comment form at top if showing newest comments at the top.
+		if ( comments_open() ) {
+			twentynineteen_comment_form( 'desc' );
+		}
+
+		?>
+		<ol class="comment-list">
+			<?php
+			wp_list_comments(
+				array(
+					'walker'      => new TwentyNineteen_Walker_Comment(),
+					'avatar_size' => twentynineteen_get_avatar_size(),
+					'short_ping'  => true,
+					'style'       => 'ol',
+				)
+			);
+			?>
+		</ol><!-- .comment-list -->
+		<?php
+
+		// Show comment navigation
+		if ( have_comments() ) :
+			$prev_icon     = twentynineteen_get_icon_svg( 'chevron_left', 22 );
+			$next_icon     = twentynineteen_get_icon_svg( 'chevron_right', 22 );
+			$comments_text = __( 'Comments', 'twentynineteen' );
+			the_comments_navigation(
+				array(
+					'prev_text' => sprintf( '%s <span class="nav-prev-text"><span class="primary-text">%s</span> <span class="secondary-text">%s</span></span>', $prev_icon, __( 'Previous', 'twentynineteen' ), __( 'Comments', 'twentynineteen' ) ),
+					'next_text' => sprintf( '<span class="nav-next-text"><span class="primary-text">%s</span> <span class="secondary-text">%s</span></span> %s', __( 'Next', 'twentynineteen' ), __( 'Comments', 'twentynineteen' ), $next_icon ),
+				)
+			);
+		endif;
+
+		// Show comment form at bottom if showing newest comments at the bottom.
+		if ( comments_open() && 'asc' === strtolower( get_option( 'comment_order', 'asc' ) ) ) :
+			?>
+			<div class="comment-form-flex">
+				<span class="screen-reader-text"><?php _e( 'Leave a comment', 'twentynineteen' ); ?></span>
+				<?php twentynineteen_comment_form( 'asc' ); ?>
+				<h2 class="comments-title" aria-hidden="true"><?php _e( 'Leave a comment', 'twentynineteen' ); ?></h2>
+			</div>
+			<?php
+		endif;
+
+		// If comments are closed and there are comments, let's leave a little note, shall we?
+		if ( ! comments_open() ) :
+			?>
+			<p class="no-comments">
+				<?php _e( 'Comments are closed.', 'twentynineteen' ); ?>
+			</p>
+			<?php
+		endif;
+
+	else :
+
+		// Show comment form.
+		twentynineteen_comment_form( true );
+
+	endif; // if have_comments();
+	?>
+</div><!-- #comments -->

wp-content/themes/twentynineteen/footer.php

@@ -0,0 +1,57 @@
+<?php
+/**
+ * The template for displaying the footer
+ *
+ * Contains the closing of the #content div and all content after.
+ *
+ * @link https://developer.wordpress.org/themes/basics/template-files/#template-partials
+ *
+ * @package WordPress
+ * @subpackage Twenty_Nineteen
+ * @since 1.0.0
+ */
+
+?>
+
+	</div><!-- #content -->
+
+	<footer id="colophon" class="site-footer">
+		<?php get_template_part( 'template-parts/footer/footer', 'widgets' ); ?>
+		<div class="site-info">
+			<?php $blog_info = get_bloginfo( 'name' ); ?>
+			<?php if ( ! empty( $blog_info ) ) : ?>
+				<a class="site-name" href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a>,
+			<?php endif; ?>
+			<a href="<?php echo esc_url( __( 'https://wordpress.org/', 'twentynineteen' ) ); ?>" class="imprint">
+				<?php
+				/* translators: %s: WordPress. */
+				printf( __( 'Proudly powered by %s.', 'twentynineteen' ), 'WordPress' );
+				?>
+			</a>
+			<?php
+			if ( function_exists( 'the_privacy_policy_link' ) ) {
+				the_privacy_policy_link( '', '<span role="separator" aria-hidden="true"></span>' );
+			}
+			?>
+			<?php if ( has_nav_menu( 'footer' ) ) : ?>
+				<nav class="footer-navigation" aria-label="<?php esc_attr_e( 'Footer Menu', 'twentynineteen' ); ?>">
+					<?php
+					wp_nav_menu(
+						array(
+							'theme_location' => 'footer',
+							'menu_class'     => 'footer-menu',
+							'depth'          => 1,
+						)
+					);
+					?>
+				</nav><!-- .footer-navigation -->
+			<?php endif; ?>
+		</div><!-- .site-info -->
+	</footer><!-- #colophon -->
+
+</div><!-- #page -->
+
+<?php wp_footer(); ?>
+
+</body>
+</html>

wp-content/themes/twentynineteen/functions.php

@@ -0,0 +1,325 @@
+<?php
+/**
+ * Twenty Nineteen functions and definitions
+ *
+ * @link https://developer.wordpress.org/themes/basics/theme-functions/
+ *
+ * @package WordPress
+ * @subpackage Twenty_Nineteen
+ * @since 1.0.0
+ */
+
+/**
+ * Twenty Nineteen only works in WordPress 4.7 or later.
+ */
+if ( version_compare( $GLOBALS['wp_version'], '4.7', '<' ) ) {
+	require get_template_directory() . '/inc/back-compat.php';
+	return;
+}
+
+if ( ! function_exists( 'twentynineteen_setup' ) ) :
+	/**
+	 * Sets up theme defaults and registers support for various WordPress features.
+	 *
+	 * Note that this function is hooked into the after_setup_theme hook, which
+	 * runs before the init hook. The init hook is too late for some features, such
+	 * as indicating support for post thumbnails.
+	 */
+	function twentynineteen_setup() {
+		/*
+		 * Make theme available for translation.
+		 * Translations can be filed in the /languages/ directory.
+		 * If you're building a theme based on Twenty Nineteen, use a find and replace
+		 * to change 'twentynineteen' to the name of your theme in all the template files.
+		 */
+		load_theme_textdomain( 'twentynineteen', get_template_directory() . '/languages' );
+
+		// Add default posts and comments RSS feed links to head.
+		add_theme_support( 'automatic-feed-links' );
+
+		/*
+		 * Let WordPress manage the document title.
+		 * By adding theme support, we declare that this theme does not use a
+		 * hard-coded <title> tag in the document head, and expect WordPress to
+		 * provide it for us.
+		 */
+		add_theme_support( 'title-tag' );
+
+		/*
+		 * Enable support for Post Thumbnails on posts and pages.
+		 *
+		 * @link https://developer.wordpress.org/themes/functionality/featured-images-post-thumbnails/
+		 */
+		add_theme_support( 'post-thumbnails' );
+		set_post_thumbnail_size( 1568, 9999 );
+
+		// This theme uses wp_nav_menu() in two locations.
+		register_nav_menus(
+			array(
+				'menu-1' => __( 'Primary', 'twentynineteen' ),
+				'footer' => __( 'Footer Menu', 'twentynineteen' ),
+				'social' => __( 'Social Links Menu', 'twentynineteen' ),
+			)
+		);
+
+		/*
+		 * Switch default core markup for search form, comment form, and comments
+		 * to output valid HTML5.
+		 */
+		add_theme_support(
+			'html5',
+			array(
+				'search-form',
+				'comment-form',
+				'comment-list',
+				'gallery',
+				'caption',
+				'script',
+				'style',
+			)
+		);
+
+		/**
+		 * Add support for core custom logo.
+		 *
+		 * @link https://codex.wordpress.org/Theme_Logo
+		 */
+		add_theme_support(
+			'custom-logo',
+			array(
+				'height'      => 190,
+				'width'       => 190,
+				'flex-width'  => false,
+				'flex-height' => false,
+			)
+		);
+
+		// Add theme support for selective refresh for widgets.
+		add_theme_support( 'customize-selective-refresh-widgets' );
+
+		// Add support for Block Styles.
+		add_theme_support( 'wp-block-styles' );
+
+		// Add support for full and wide align images.
+		add_theme_support( 'align-wide' );
+
+		// Add support for editor styles.
+		add_theme_support( 'editor-styles' );
+
+		// Enqueue editor styles.
+		add_editor_style( 'style-editor.css' );
+
+		// Add custom editor font sizes.
+		add_theme_support(
+			'editor-font-sizes',
+			array(
+				array(
+					'name'      => __( 'Small', 'twentynineteen' ),
+					'shortName' => __( 'S', 'twentynineteen' ),
+					'size'      => 19.5,
+					'slug'      => 'small',
+				),
+				array(
+					'name'      => __( 'Normal', 'twentynineteen' ),
+					'shortName' => __( 'M', 'twentynineteen' ),
+					'size'      => 22,
+					'slug'      => 'normal',
+				),
+				array(
+					'name'      => __( 'Large', 'twentynineteen' ),
+					'shortName' => __( 'L', 'twentynineteen' ),
+					'size'      => 36.5,
+					'slug'      => 'large',
+				),
+				array(
+					'name'      => __( 'Huge', 'twentynineteen' ),
+					'shortName' => __( 'XL', 'twentynineteen' ),
+					'size'      => 49.5,
+					'slug'      => 'huge',
+				),
+			)
+		);
+
+		// Editor color palette.
+		add_theme_support(
+			'editor-color-palette',
+			array(
+				array(
+					'name'  => 'default' === get_theme_mod( 'primary_color' ) ? __( 'Blue', 'twentynineteen' ) : null,
+					'slug'  => 'primary',
+					'color' => twentynineteen_hsl_hex( 'default' === get_theme_mod( 'primary_color' ) ? 199 : get_theme_mod( 'primary_color_hue', 199 ), 100, 33 ),
+				),
+				array(
+					'name'  => 'default' === get_theme_mod( 'primary_color' ) ? __( 'Dark Blue', 'twentynineteen' ) : null,
+					'slug'  => 'secondary',
+					'color' => twentynineteen_hsl_hex( 'default' === get_theme_mod( 'primary_color' ) ? 199 : get_theme_mod( 'primary_color_hue', 199 ), 100, 23 ),
+				),
+				array(
+					'name'  => __( 'Dark Gray', 'twentynineteen' ),
+					'slug'  => 'dark-gray',
+					'color' => '#111',
+				),
+				array(
+					'name'  => __( 'Light Gray', 'twentynineteen' ),
+					'slug'  => 'light-gray',
+					'color' => '#767676',
+				),
+				array(
+					'name'  => __( 'White', 'twentynineteen' ),
+					'slug'  => 'white',
+					'color' => '#FFF',
+				),
+			)
+		);
+
+		// Add support for responsive embedded content.
+		add_theme_support( 'responsive-embeds' );
+	}
+endif;
+add_action( 'after_setup_theme', 'twentynineteen_setup' );
+
+/**
+ * Register widget area.
+ *
+ * @link https://developer.wordpress.org/themes/functionality/sidebars/#registering-a-sidebar
+ */
+function twentynineteen_widgets_init() {
+
+	register_sidebar(
+		array(
+			'name'          => __( 'Footer', 'twentynineteen' ),
+			'id'            => 'sidebar-1',
+			'description'   => __( 'Add widgets here to appear in your footer.', 'twentynineteen' ),
+			'before_widget' => '<section id="%1$s" class="widget %2$s">',
+			'after_widget'  => '</section>',
+			'before_title'  => '<h2 class="widget-title">',
+			'after_title'   => '</h2>',
+		)
+	);
+
+}
+add_action( 'widgets_init', 'twentynineteen_widgets_init' );
+
+/**
+ * Set the content width in pixels, based on the theme's design and stylesheet.
+ *
+ * Priority 0 to make it available to lower priority callbacks.
+ *
+ * @global int $content_width Content width.
+ */
+function twentynineteen_content_width() {
+	// This variable is intended to be overruled from themes.
+	// Open WPCS issue: {@link https://github.com/WordPress-Coding-Standards/WordPress-Coding-Standards/issues/1043}.
+	// phpcs:ignore WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound
+	$GLOBALS['content_width'] = apply_filters( 'twentynineteen_content_width', 640 );
+}
+add_action( 'after_setup_theme', 'twentynineteen_content_width', 0 );
+
+/**
+ * Enqueue scripts and styles.
+ */
+function twentynineteen_scripts() {
+	wp_enqueue_style( 'twentynineteen-style', get_stylesheet_uri(), array(), wp_get_theme()->get( 'Version' ) );
+
+	wp_style_add_data( 'twentynineteen-style', 'rtl', 'replace' );
+
+	if ( has_nav_menu( 'menu-1' ) ) {
+		wp_enqueue_script( 'twentynineteen-priority-menu', get_theme_file_uri( '/js/priority-menu.js' ), array(), '20181214', true );
+		wp_enqueue_script( 'twentynineteen-touch-navigation', get_theme_file_uri( '/js/touch-keyboard-navigation.js' ), array(), '20181231', true );
+	}
+
+	wp_enqueue_style( 'twentynineteen-print-style', get_template_directory_uri() . '/print.css', array(), wp_get_theme()->get( 'Version' ), 'print' );
+
+	if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
+		wp_enqueue_script( 'comment-reply' );
+	}
+}
+add_action( 'wp_enqueue_scripts', 'twentynineteen_scripts' );
+
+/**
+ * Fix skip link focus in IE11.
+ *
+ * This does not enqueue the script because it is tiny and because it is only for IE11,
+ * thus it does not warrant having an entire dedicated blocking script being loaded.
+ *
+ * @link https://git.io/vWdr2
+ */
+function twentynineteen_skip_link_focus_fix() {
+	// The following is minified via `terser --compress --mangle -- js/skip-link-focus-fix.js`.
+	?>
+	<script>
+	/(trident|msie)/i.test(navigator.userAgent)&&document.getElementById&&window.addEventListener&&window.addEventListener("hashchange",function(){var t,e=location.hash.substring(1);/^[A-z0-9_-]+$/.test(e)&&(t=document.getElementById(e))&&(/^(?:a|select|input|button|textarea)$/i.test(t.tagName)||(t.tabIndex=-1),t.focus())},!1);
+	</script>
+	<?php
+}
+add_action( 'wp_print_footer_scripts', 'twentynineteen_skip_link_focus_fix' );
+
+/**
+ * Enqueue supplemental block editor styles.
+ */
+function twentynineteen_editor_customizer_styles() {
+
+	wp_enqueue_style( 'twentynineteen-editor-customizer-styles', get_theme_file_uri( '/style-editor-customizer.css' ), false, '1.1', 'all' );
+
+	if ( 'custom' === get_theme_mod( 'primary_color' ) ) {
+		// Include color patterns.
+		require_once get_parent_theme_file_path( '/inc/color-patterns.php' );
+		wp_add_inline_style( 'twentynineteen-editor-customizer-styles', twentynineteen_custom_colors_css() );
+	}
+}
+add_action( 'enqueue_block_editor_assets', 'twentynineteen_editor_customizer_styles' );
+
+/**
+ * Display custom color CSS in customizer and on frontend.
+ */
+function twentynineteen_colors_css_wrap() {
+
+	// Only include custom colors in customizer or frontend.
+	if ( ( ! is_customize_preview() && 'default' === get_theme_mod( 'primary_color', 'default' ) ) || is_admin() ) {
+		return;
+	}
+
+	require_once get_parent_theme_file_path( '/inc/color-patterns.php' );
+
+	$primary_color = 199;
+	if ( 'default' !== get_theme_mod( 'primary_color', 'default' ) ) {
+		$primary_color = get_theme_mod( 'primary_color_hue', 199 );
+	}
+	?>
+
+	<style type="text/css" id="custom-theme-colors" <?php echo is_customize_preview() ? 'data-hue="' . absint( $primary_color ) . '"' : ''; ?>>
+		<?php echo twentynineteen_custom_colors_css(); ?>
+	</style>
+	<?php
+}
+add_action( 'wp_head', 'twentynineteen_colors_css_wrap' );
+
+/**
+ * SVG Icons class.
+ */
+require get_template_directory() . '/classes/class-twentynineteen-svg-icons.php';
+
+/**
+ * Custom Comment Walker template.
+ */
+require get_template_directory() . '/classes/class-twentynineteen-walker-comment.php';
+
+/**
+ * Enhance the theme by hooking into WordPress.
+ */
+require get_template_directory() . '/inc/template-functions.php';
+
+/**
+ * SVG Icons related functions.
+ */
+require get_template_directory() . '/inc/icon-functions.php';
+
+/**
+ * Custom template tags for the theme.
+ */
+require get_template_directory() . '/inc/template-tags.php';
+
+/**
+ * Customizer additions.
+ */
+require get_template_directory() . '/inc/customizer.php';

wp-content/themes/twentynineteen/header.php

@@ -0,0 +1,53 @@
+<?php
+/**
+ * The header for our theme
+ *
+ * This is the template that displays all of the <head> section and everything up until <div id="content">
+ *
+ * @link https://developer.wordpress.org/themes/basics/template-files/#template-partials
+ *
+ * @package WordPress
+ * @subpackage Twenty_Nineteen
+ * @since 1.0.0
+ */
+?><!doctype html>
+<html <?php language_attributes(); ?>>
+<head>
+	<meta charset="<?php bloginfo( 'charset' ); ?>" />
+	<meta name="viewport" content="width=device-width, initial-scale=1" />
+	<link rel="profile" href="https://gmpg.org/xfn/11" />
+	<?php wp_head(); ?>
+</head>
+
+<body <?php body_class(); ?>>
+<?php wp_body_open(); ?>
+<div id="page" class="site">
+	<a class="skip-link screen-reader-text" href="#content"><?php _e( 'Skip to content', 'twentynineteen' ); ?></a>
+
+		<header id="masthead" class="<?php echo is_singular() && twentynineteen_can_show_post_thumbnail() ? 'site-header featured-image' : 'site-header'; ?>">
+
+			<div class="site-branding-container">
+				<?php get_template_part( 'template-parts/header/site', 'branding' ); ?>
+			</div><!-- .site-branding-container -->
+
+			<?php if ( is_singular() && twentynineteen_can_show_post_thumbnail() ) : ?>
+				<div class="site-featured-image">
+					<?php
+						twentynineteen_post_thumbnail();
+						the_post();
+						$discussion = ! is_page() && twentynineteen_can_show_post_thumbnail() ? twentynineteen_get_discussion_data() : null;
+
+						$classes = 'entry-header';
+					if ( ! empty( $discussion ) && absint( $discussion->responses ) > 0 ) {
+						$classes = 'entry-header has-discussion';
+					}
+					?>
+					<div class="<?php echo $classes; ?>">
+						<?php get_template_part( 'template-parts/header/entry', 'header' ); ?>
+					</div><!-- .entry-header -->
+					<?php rewind_posts(); ?>
+				</div>
+			<?php endif; ?>
+		</header><!-- #masthead -->
+
+	<div id="content" class="site-content">

wp-content/themes/twentynineteen/image.php

@@ -0,0 +1,104 @@
+<?php
+/**
+ * The template for displaying image attachments
+ *
+ * @package WordPress
+ * @subpackage Twenty_Nineteen
+ * @since 1.0.0
+ */
+
+get_header();
+?>
+
+	<div id="primary" class="content-area">
+		<main id="main" class="site-main">
+
+			<?php
+				// Start the loop.
+			while ( have_posts() ) :
+				the_post();
+				?>
+
+				<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
+
+					<header class="entry-header">
+					<?php the_title( '<h1 class="entry-title">', '</h1>' ); ?>
+					</header><!-- .entry-header -->
+
+					<div class="entry-content">
+
+						<figure class="entry-attachment wp-block-image">
+						<?php
+							/**
+							 * Filter the default twentynineteen image attachment size.
+							 *
+							 * @since Twenty Sixteen 1.0
+							 *
+							 * @param string $image_size Image size. Default 'large'.
+							 */
+							$image_size = apply_filters( 'twentynineteen_attachment_size', 'full' );
+
+							echo wp_get_attachment_image( get_the_ID(), $image_size );
+						?>
+
+							<figcaption class="wp-caption-text"><?php the_excerpt(); ?></figcaption>
+
+						</figure><!-- .entry-attachment -->
+
+						<?php
+						the_content();
+						wp_link_pages(
+							array(
+								'before'      => '<div class="page-links"><span class="page-links-title">' . __( 'Pages:', 'twentynineteen' ) . '</span>',
+								'after'       => '</div>',
+								'link_before' => '<span>',
+								'link_after'  => '</span>',
+								'pagelink'    => '<span class="screen-reader-text">' . __( 'Page', 'twentynineteen' ) . ' </span>%',
+								'separator'   => '<span class="screen-reader-text">, </span>',
+							)
+						);
+						?>
+					</div><!-- .entry-content -->
+
+					<footer class="entry-footer">
+					<?php
+						// Retrieve attachment metadata.
+						$metadata = wp_get_attachment_metadata();
+					if ( $metadata ) {
+						printf(
+							'<span class="full-size-link"><span class="screen-reader-text">%1$s</span><a href="%2$s">%3$s &times; %4$s</a></span>',
+							_x( 'Full size', 'Used before full size attachment link.', 'twentynineteen' ),
+							esc_url( wp_get_attachment_url() ),
+							absint( $metadata['width'] ),
+							absint( $metadata['height'] )
+						);
+					}
+					?>
+
+						<?php twentynineteen_entry_footer(); ?>
+
+					</footer><!-- .entry-footer -->
+				</article><!-- #post-<?php the_ID(); ?> -->
+
+				<?php
+				// Parent post navigation.
+				the_post_navigation(
+					array(
+						'prev_text' => _x( '<span class="meta-nav">Published in</span><br><span class="post-title">%title</span>', 'Parent post link', 'twentynineteen' ),
+					)
+				);
+
+				// If comments are open or we have at least one comment, load up the comment template.
+				if ( comments_open() || get_comments_number() ) {
+					comments_template();
+				}
+
+				// End the loop.
+				endwhile;
+			?>
+
+		</main><!-- .site-main -->
+	</div><!-- .content-area -->
+
+<?php
+get_footer();

wp-content/themes/twentynineteen/inc/back-compat.php

@@ -0,0 +1,79 @@
+<?php
+/**
+ * Twenty Nineteen back compat functionality
+ *
+ * Prevents Twenty Nineteen from running on WordPress versions prior to 4.7,
+ * since this theme is not meant to be backward compatible beyond that and
+ * relies on many newer functions and markup changes introduced in 4.7.
+ *
+ * @package WordPress
+ * @subpackage Twenty_Nineteen
+ * @since Twenty Nineteen 1.0.0
+ */
+
+/**
+ * Prevent switching to Twenty Nineteen on old versions of WordPress.
+ *
+ * Switches to the default theme.
+ *
+ * @since Twenty Nineteen 1.0.0
+ */
+function twentynineteen_switch_theme() {
+	switch_theme( WP_DEFAULT_THEME );
+	unset( $_GET['activated'] );
+	add_action( 'admin_notices', 'twentynineteen_upgrade_notice' );
+}
+add_action( 'after_switch_theme', 'twentynineteen_switch_theme' );
+
+/**
+ * Adds a message for unsuccessful theme switch.
+ *
+ * Prints an update nag after an unsuccessful attempt to switch to
+ * Twenty Nineteen on WordPress versions prior to 4.7.
+ *
+ * @since Twenty Nineteen 1.0.0
+ *
+ * @global string $wp_version WordPress version.
+ */
+function twentynineteen_upgrade_notice() {
+	/* translators: %s: WordPress version. */
+	$message = sprintf( __( 'Twenty Nineteen requires at least WordPress version 4.7. You are running version %s. Please upgrade and try again.', 'twentynineteen' ), $GLOBALS['wp_version'] );
+	printf( '<div class="error"><p>%s</p></div>', $message );
+}
+
+/**
+ * Prevents the Customizer from being loaded on WordPress versions prior to 4.7.
+ *
+ * @since Twenty Nineteen 1.0.0
+ *
+ * @global string $wp_version WordPress version.
+ */
+function twentynineteen_customize() {
+	wp_die(
+		sprintf(
+			/* translators: %s: WordPress version. */
+			__( 'Twenty Nineteen requires at least WordPress version 4.7. You are running version %s. Please upgrade and try again.', 'twentynineteen' ),
+			$GLOBALS['wp_version']
+		),
+		'',
+		array(
+			'back_link' => true,
+		)
+	);
+}
+add_action( 'load-customize.php', 'twentynineteen_customize' );
+
+/**
+ * Prevents the Theme Preview from being loaded on WordPress versions prior to 4.7.
+ *
+ * @since Twenty Nineteen 1.0.0
+ *
+ * @global string $wp_version WordPress version.
+ */
+function twentynineteen_preview() {
+	if ( isset( $_GET['preview'] ) ) {
+		/* translators: %s: WordPress version. */
+		wp_die( sprintf( __( 'Twenty Nineteen requires at least WordPress version 4.7. You are running version %s. Please upgrade and try again.', 'twentynineteen' ), $GLOBALS['wp_version'] ) );
+	}
+}
+add_action( 'template_redirect', 'twentynineteen_preview' );

wp-content/themes/twentynineteen/inc/color-patterns.php

@@ -0,0 +1,271 @@
+<?php
+/**
+ * Twenty Nineteen: Color Patterns
+ *
+ * @package WordPress
+ * @subpackage TwentyNineteen
+ * @since 1.0
+ */
+
+/**
+ * Generate the CSS for the current primary color.
+ */
+function twentynineteen_custom_colors_css() {
+
+	$primary_color = 199;
+	if ( 'default' !== get_theme_mod( 'primary_color', 'default' ) ) {
+		$primary_color = absint( get_theme_mod( 'primary_color_hue', 199 ) );
+	}
+
+	/**
+	 * Filter Twenty Nineteen default saturation level.
+	 *
+	 * @since Twenty Nineteen 1.0
+	 *
+	 * @param int $saturation Color saturation level.
+	 */
+	$saturation = apply_filters( 'twentynineteen_custom_colors_saturation', 100 );
+	$saturation = absint( $saturation ) . '%';
+
+	/**
+	 * Filter Twenty Nineteen default selection saturation level.
+	 *
+	 * @since Twenty Nineteen 1.0
+	 *
+	 * @param int $saturation_selection Selection color saturation level.
+	 */
+	$saturation_selection = absint( apply_filters( 'twentynineteen_custom_colors_saturation_selection', 50 ) );
+	$saturation_selection = $saturation_selection . '%';
+
+	/**
+	 * Filter Twenty Nineteen default lightness level.
+	 *
+	 * @since Twenty Nineteen 1.0
+	 *
+	 * @param int $lightness Color lightness level.
+	 */
+	$lightness = apply_filters( 'twentynineteen_custom_colors_lightness', 33 );
+	$lightness = absint( $lightness ) . '%';
+
+	/**
+	 * Filter Twenty Nineteen default hover lightness level.
+	 *
+	 * @since Twenty Nineteen 1.0
+	 *
+	 * @param int $lightness_hover Hover color lightness level.
+	 */
+	$lightness_hover = apply_filters( 'twentynineteen_custom_colors_lightness_hover', 23 );
+	$lightness_hover = absint( $lightness_hover ) . '%';
+
+	/**
+	 * Filter Twenty Nineteen default selection lightness level.
+	 *
+	 * @since Twenty Nineteen 1.0
+	 *
+	 * @param int $lightness_selection Selection color lightness level.
+	 */
+	$lightness_selection = apply_filters( 'twentynineteen_custom_colors_lightness_selection', 90 );
+	$lightness_selection = absint( $lightness_selection ) . '%';
+
+	$theme_css = '
+		/*
+		 * Set background for:
+		 * - featured image :before
+		 * - featured image :before
+		 * - post thumbmail :before
+		 * - post thumbmail :before
+		 * - Submenu
+		 * - Sticky Post
+		 * - buttons
+		 * - WP Block Button
+		 * - Blocks
+		 */
+		.image-filters-enabled .site-header.featured-image .site-featured-image:before,
+		.image-filters-enabled .site-header.featured-image .site-featured-image:after,
+		.image-filters-enabled .entry .post-thumbnail:before,
+		.image-filters-enabled .entry .post-thumbnail:after,
+		.main-navigation .sub-menu,
+		.sticky-post,
+		.entry .entry-content .wp-block-button .wp-block-button__link:not(.has-background),
+		.entry .button, button, input[type="button"], input[type="reset"], input[type="submit"],
+		.entry .entry-content > .has-primary-background-color,
+		.entry .entry-content > *[class^="wp-block-"].has-primary-background-color,
+		.entry .entry-content > *[class^="wp-block-"] .has-primary-background-color,
+		.entry .entry-content > *[class^="wp-block-"].is-style-solid-color,
+		.entry .entry-content > *[class^="wp-block-"].is-style-solid-color.has-primary-background-color,
+		.entry .entry-content .wp-block-file .wp-block-file__button {
+			background-color: hsl( ' . $primary_color . ', ' . $saturation . ', ' . $lightness . ' ); /* base: #0073a8; */
+		}
+
+		/*
+		 * Set Color for:
+		 * - all links
+		 * - main navigation links
+		 * - Post navigation links
+		 * - Post entry meta hover
+		 * - Post entry header more-link hover
+		 * - main navigation svg
+		 * - comment navigation
+		 * - Comment edit link hover
+		 * - Site Footer Link hover
+		 * - Widget links
+		 */
+		a,
+		a:visited,
+		.main-navigation .main-menu > li,
+		.main-navigation ul.main-menu > li > a,
+		.post-navigation .post-title,
+		.entry .entry-meta a:hover,
+		.entry .entry-footer a:hover,
+		.entry .entry-content .more-link:hover,
+		.main-navigation .main-menu > li > a + svg,
+		.comment .comment-metadata > a:hover,
+		.comment .comment-metadata .comment-edit-link:hover,
+		#colophon .site-info a:hover,
+		.widget a,
+		.entry .entry-content .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color),
+		.entry .entry-content > .has-primary-color,
+		.entry .entry-content > *[class^="wp-block-"] .has-primary-color,
+		.entry .entry-content > *[class^="wp-block-"].is-style-solid-color blockquote.has-primary-color,
+		.entry .entry-content > *[class^="wp-block-"].is-style-solid-color blockquote.has-primary-color p {
+			color: hsl( ' . $primary_color . ', ' . $saturation . ', ' . $lightness . ' ); /* base: #0073a8; */
+		}
+
+		/*
+		 * Set border color for:
+		 * wp block quote
+		 * :focus
+		 */
+		blockquote,
+		.entry .entry-content blockquote,
+		.entry .entry-content .wp-block-quote:not(.is-large),
+		.entry .entry-content .wp-block-quote:not(.is-style-large),
+		input[type="text"]:focus,
+		input[type="email"]:focus,
+		input[type="url"]:focus,
+		input[type="password"]:focus,
+		input[type="search"]:focus,
+		input[type="number"]:focus,
+		input[type="tel"]:focus,
+		input[type="range"]:focus,
+		input[type="date"]:focus,
+		input[type="month"]:focus,
+		input[type="week"]:focus,
+		input[type="time"]:focus,
+		input[type="datetime"]:focus,
+		input[type="datetime-local"]:focus,
+		input[type="color"]:focus,
+		textarea:focus {
+			border-color: hsl( ' . $primary_color . ', ' . $saturation . ', ' . $lightness . ' ); /* base: #0073a8; */
+		}
+
+		.gallery-item > div > a:focus {
+			box-shadow: 0 0 0 2px hsl( ' . $primary_color . ', ' . $saturation . ', ' . $lightness . ' ); /* base: #0073a8; */
+		}
+
+		/* Hover colors */
+		a:hover, a:active,
+		.main-navigation .main-menu > li > a:hover,
+		.main-navigation .main-menu > li > a:hover + svg,
+		.post-navigation .nav-links a:hover,
+		.post-navigation .nav-links a:hover .post-title,
+		.author-bio .author-description .author-link:hover,
+		.entry .entry-content > .has-secondary-color,
+		.entry .entry-content > *[class^="wp-block-"] .has-secondary-color,
+		.entry .entry-content > *[class^="wp-block-"].is-style-solid-color blockquote.has-secondary-color,
+		.entry .entry-content > *[class^="wp-block-"].is-style-solid-color blockquote.has-secondary-color p,
+		.comment .comment-author .fn a:hover,
+		.comment-reply-link:hover,
+		.comment-navigation .nav-previous a:hover,
+		.comment-navigation .nav-next a:hover,
+		#cancel-comment-reply-link:hover,
+		.widget a:hover {
+			color: hsl( ' . $primary_color . ', ' . $saturation . ', ' . $lightness_hover . ' ); /* base: #005177; */
+		}
+
+		.main-navigation .sub-menu > li > a:hover,
+		.main-navigation .sub-menu > li > a:focus,
+		.main-navigation .sub-menu > li > a:hover:after,
+		.main-navigation .sub-menu > li > a:focus:after,
+		.main-navigation .sub-menu > li > .menu-item-link-return:hover,
+		.main-navigation .sub-menu > li > .menu-item-link-return:focus,
+		.main-navigation .sub-menu > li > a:not(.submenu-expand):hover,
+		.main-navigation .sub-menu > li > a:not(.submenu-expand):focus,
+		.entry .entry-content > .has-secondary-background-color,
+		.entry .entry-content > *[class^="wp-block-"].has-secondary-background-color,
+		.entry .entry-content > *[class^="wp-block-"] .has-secondary-background-color,
+		.entry .entry-content > *[class^="wp-block-"].is-style-solid-color.has-secondary-background-color {
+			background-color: hsl( ' . $primary_color . ', ' . $saturation . ', ' . $lightness_hover . ' ); /* base: #005177; */
+		}
+
+		/* Text selection colors */
+		::selection {
+			background-color: hsl( ' . $primary_color . ', ' . $saturation_selection . ', ' . $lightness_selection . ' ); /* base: #005177; */
+		}
+		::-moz-selection {
+			background-color: hsl( ' . $primary_color . ', ' . $saturation_selection . ', ' . $lightness_selection . ' ); /* base: #005177; */
+		}';
+
+	$editor_css = '
+		/*
+		 * Set colors for:
+		 * - links
+		 * - blockquote
+		 * - pullquote (solid color)
+		 * - buttons
+		 */
+		.editor-block-list__layout .editor-block-list__block a,
+		.editor-block-list__layout .editor-block-list__block .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color),
+		.editor-block-list__layout .editor-block-list__block .wp-block-button.is-style-outline:hover .wp-block-button__link:not(.has-text-color),
+		.editor-block-list__layout .editor-block-list__block .wp-block-button.is-style-outline:focus .wp-block-button__link:not(.has-text-color),
+		.editor-block-list__layout .editor-block-list__block .wp-block-button.is-style-outline:active .wp-block-button__link:not(.has-text-color),
+		.editor-block-list__layout .editor-block-list__block .wp-block-file .wp-block-file__textlink {
+			color: hsl( ' . $primary_color . ', ' . $saturation . ', ' . $lightness . ' ); /* base: #0073a8; */
+		}
+
+		.editor-block-list__layout .editor-block-list__block .wp-block-quote:not(.is-large):not(.is-style-large),
+		.editor-styles-wrapper .editor-block-list__layout .wp-block-freeform blockquote {
+			border-color: hsl( ' . $primary_color . ', ' . $saturation . ', ' . $lightness . ' ); /* base: #0073a8; */
+		}
+
+		.editor-block-list__layout .editor-block-list__block .wp-block-pullquote.is-style-solid-color:not(.has-background-color) {
+			background-color: hsl( ' . $primary_color . ', ' . $saturation . ', ' . $lightness . ' ); /* base: #0073a8; */
+		}
+
+		.editor-block-list__layout .editor-block-list__block .wp-block-file .wp-block-file__button,
+		.editor-block-list__layout .editor-block-list__block .wp-block-button:not(.is-style-outline) .wp-block-button__link,
+		.editor-block-list__layout .editor-block-list__block .wp-block-button:not(.is-style-outline) .wp-block-button__link:active,
+		.editor-block-list__layout .editor-block-list__block .wp-block-button:not(.is-style-outline) .wp-block-button__link:focus,
+		.editor-block-list__layout .editor-block-list__block .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover {
+			background-color: hsl( ' . $primary_color . ', ' . $saturation . ', ' . $lightness . ' ); /* base: #0073a8; */
+		}
+
+		/* Hover colors */
+		.editor-block-list__layout .editor-block-list__block a:hover,
+		.editor-block-list__layout .editor-block-list__block a:active,
+		.editor-block-list__layout .editor-block-list__block .wp-block-file .wp-block-file__textlink:hover {
+			color: hsl( ' . $primary_color . ', ' . $saturation . ', ' . $lightness_hover . ' ); /* base: #005177; */
+		}
+
+		/* Do not overwrite solid color pullquote or cover links */
+		.editor-block-list__layout .editor-block-list__block .wp-block-pullquote.is-style-solid-color a,
+		.editor-block-list__layout .editor-block-list__block .wp-block-cover a {
+			color: inherit;
+		}
+		';
+
+	if ( function_exists( 'register_block_type' ) && is_admin() ) {
+		$theme_css = $editor_css;
+	}
+
+	/**
+	 * Filters Twenty Nineteen custom colors CSS.
+	 *
+	 * @since Twenty Nineteen 1.0
+	 *
+	 * @param string $css           Base theme colors CSS.
+	 * @param int    $primary_color The user's selected color hue.
+	 * @param string $saturation    Filtered theme color saturation level.
+	 */
+	return apply_filters( 'twentynineteen_custom_colors_css', $theme_css, $primary_color, $saturation );
+}

wp-content/themes/twentynineteen/inc/customizer.php

@@ -0,0 +1,158 @@
+<?php
+/**
+ * Twenty Nineteen: Customizer
+ *
+ * @package WordPress
+ * @subpackage Twenty_Nineteen
+ * @since 1.0.0
+ */
+
+/**
+ * Add postMessage support for site title and description for the Theme Customizer.
+ *
+ * @param WP_Customize_Manager $wp_customize Theme Customizer object.
+ */
+function twentynineteen_customize_register( $wp_customize ) {
+	$wp_customize->get_setting( 'blogname' )->transport         = 'postMessage';
+	$wp_customize->get_setting( 'blogdescription' )->transport  = 'postMessage';
+	$wp_customize->get_setting( 'header_textcolor' )->transport = 'postMessage';
+
+	if ( isset( $wp_customize->selective_refresh ) ) {
+		$wp_customize->selective_refresh->add_partial(
+			'blogname',
+			array(
+				'selector'        => '.site-title a',
+				'render_callback' => 'twentynineteen_customize_partial_blogname',
+			)
+		);
+		$wp_customize->selective_refresh->add_partial(
+			'blogdescription',
+			array(
+				'selector'        => '.site-description',
+				'render_callback' => 'twentynineteen_customize_partial_blogdescription',
+			)
+		);
+	}
+
+	/**
+	 * Primary color.
+	 */
+	$wp_customize->add_setting(
+		'primary_color',
+		array(
+			'default'           => 'default',
+			'transport'         => 'postMessage',
+			'sanitize_callback' => 'twentynineteen_sanitize_color_option',
+		)
+	);
+
+	$wp_customize->add_control(
+		'primary_color',
+		array(
+			'type'     => 'radio',
+			'label'    => __( 'Primary Color', 'twentynineteen' ),
+			'choices'  => array(
+				'default' => _x( 'Default', 'primary color', 'twentynineteen' ),
+				'custom'  => _x( 'Custom', 'primary color', 'twentynineteen' ),
+			),
+			'section'  => 'colors',
+			'priority' => 5,
+		)
+	);
+
+	// Add primary color hue setting and control.
+	$wp_customize->add_setting(
+		'primary_color_hue',
+		array(
+			'default'           => 199,
+			'transport'         => 'postMessage',
+			'sanitize_callback' => 'absint',
+		)
+	);
+
+	$wp_customize->add_control(
+		new WP_Customize_Color_Control(
+			$wp_customize,
+			'primary_color_hue',
+			array(
+				'description' => __( 'Apply a custom color for buttons, links, featured images, etc.', 'twentynineteen' ),
+				'section'     => 'colors',
+				'mode'        => 'hue',
+			)
+		)
+	);
+
+	// Add image filter setting and control.
+	$wp_customize->add_setting(
+		'image_filter',
+		array(
+			'default'           => 1,
+			'sanitize_callback' => 'absint',
+			'transport'         => 'postMessage',
+		)
+	);
+
+	$wp_customize->add_control(
+		'image_filter',
+		array(
+			'label'   => __( 'Apply a filter to featured images using the primary color', 'twentynineteen' ),
+			'section' => 'colors',
+			'type'    => 'checkbox',
+		)
+	);
+}
+add_action( 'customize_register', 'twentynineteen_customize_register' );
+
+/**
+ * Render the site title for the selective refresh partial.
+ *
+ * @return void
+ */
+function twentynineteen_customize_partial_blogname() {
+	bloginfo( 'name' );
+}
+
+/**
+ * Render the site tagline for the selective refresh partial.
+ *
+ * @return void
+ */
+function twentynineteen_customize_partial_blogdescription() {
+	bloginfo( 'description' );
+}
+
+/**
+ * Bind JS handlers to instantly live-preview changes.
+ */
+function twentynineteen_customize_preview_js() {
+	wp_enqueue_script( 'twentynineteen-customize-preview', get_theme_file_uri( '/js/customize-preview.js' ), array( 'customize-preview' ), '20181214', true );
+}
+add_action( 'customize_preview_init', 'twentynineteen_customize_preview_js' );
+
+/**
+ * Load dynamic logic for the customizer controls area.
+ */
+function twentynineteen_panels_js() {
+	wp_enqueue_script( 'twentynineteen-customize-controls', get_theme_file_uri( '/js/customize-controls.js' ), array(), '20181214', true );
+}
+add_action( 'customize_controls_enqueue_scripts', 'twentynineteen_panels_js' );
+
+/**
+ * Sanitize custom color choice.
+ *
+ * @param string $choice Whether image filter is active.
+ *
+ * @return string
+ */
+function twentynineteen_sanitize_color_option( $choice ) {
+	$valid = array(
+		'default',
+		'custom',
+	);
+
+	if ( in_array( $choice, $valid, true ) ) {
+		return $choice;
+	}
+
+	return 'default';
+}

wp-content/themes/twentynineteen/inc/icon-functions.php

@@ -0,0 +1,52 @@
+<?php
+/**
+ * SVG icons related functions
+ *
+ * @package WordPress
+ * @subpackage Twenty_Nineteen
+ * @since 1.0.0
+ */
+
+/**
+ * Gets the SVG code for a given icon.
+ */
+function twentynineteen_get_icon_svg( $icon, $size = 24 ) {
+	return TwentyNineteen_SVG_Icons::get_svg( 'ui', $icon, $size );
+}
+
+/**
+ * Gets the SVG code for a given social icon.
+ */
+function twentynineteen_get_social_icon_svg( $icon, $size = 24 ) {
+	return TwentyNineteen_SVG_Icons::get_svg( 'social', $icon, $size );
+}
+
+/**
+ * Detects the social network from a URL and returns the SVG code for its icon.
+ */
+function twentynineteen_get_social_link_svg( $uri, $size = 24 ) {
+	return TwentyNineteen_SVG_Icons::get_social_link_svg( $uri, $size );
+}
+
+/**
+ * Display SVG icons in social links menu.
+ *
+ * @param  string  $item_output The menu item output.
+ * @param  WP_Post $item        Menu item object.
+ * @param  int     $depth       Depth of the menu.
+ * @param  array   $args        wp_nav_menu() arguments.
+ * @return string  $item_output The menu item output with social icon.
+ */
+function twentynineteen_nav_menu_social_icons( $item_output, $item, $depth, $args ) {
+	// Change SVG icon inside social links menu if there is supported URL.
+	if ( 'social' === $args->theme_location ) {
+		$svg = twentynineteen_get_social_link_svg( $item->url, 26 );
+		if ( empty( $svg ) ) {
+			$svg = twentynineteen_get_icon_svg( 'link' );
+		}
+		$item_output = str_replace( $args->link_after, '</span>' . $svg, $item_output );
+	}
+
+	return $item_output;
+}
+add_filter( 'walker_nav_menu_start_el', 'twentynineteen_nav_menu_social_icons', 10, 4 );

wp-content/themes/twentynineteen/inc/template-functions.php

@@ -0,0 +1,422 @@
+<?php
+/**
+ * Functions which enhance the theme by hooking into WordPress
+ *
+ * @package WordPress
+ * @subpackage Twenty_Nineteen
+ * @since 1.0.0
+ */
+
+/**
+ * Adds custom classes to the array of body classes.
+ *
+ * @param array $classes Classes for the body element.
+ * @return array
+ */
+function twentynineteen_body_classes( $classes ) {
+
+	if ( is_singular() ) {
+		// Adds `singular` to singular pages.
+		$classes[] = 'singular';
+	} else {
+		// Adds `hfeed` to non singular pages.
+		$classes[] = 'hfeed';
+	}
+
+	// Adds a class if image filters are enabled.
+	if ( twentynineteen_image_filters_enabled() ) {
+		$classes[] = 'image-filters-enabled';
+	}
+
+	return $classes;
+}
+add_filter( 'body_class', 'twentynineteen_body_classes' );
+
+/**
+ * Adds custom class to the array of posts classes.
+ */
+function twentynineteen_post_classes( $classes, $class, $post_id ) {
+	$classes[] = 'entry';
+
+	return $classes;
+}
+add_filter( 'post_class', 'twentynineteen_post_classes', 10, 3 );
+
+
+/**
+ * Add a pingback url auto-discovery header for single posts, pages, or attachments.
+ */
+function twentynineteen_pingback_header() {
+	if ( is_singular() && pings_open() ) {
+		echo '<link rel="pingback" href="', esc_url( get_bloginfo( 'pingback_url' ) ), '">';
+	}
+}
+add_action( 'wp_head', 'twentynineteen_pingback_header' );
+
+/**
+ * Changes comment form default fields.
+ */
+function twentynineteen_comment_form_defaults( $defaults ) {
+	$comment_field = $defaults['comment_field'];
+
+	// Adjust height of comment form.
+	$defaults['comment_field'] = preg_replace( '/rows="\d+"/', 'rows="5"', $comment_field );
+
+	return $defaults;
+}
+add_filter( 'comment_form_defaults', 'twentynineteen_comment_form_defaults' );
+
+/**
+ * Filters the default archive titles.
+ */
+function twentynineteen_get_the_archive_title() {
+	if ( is_category() ) {
+		$title = __( 'Category Archives: ', 'twentynineteen' ) . '<span class="page-description">' . single_term_title( '', false ) . '</span>';
+	} elseif ( is_tag() ) {
+		$title = __( 'Tag Archives: ', 'twentynineteen' ) . '<span class="page-description">' . single_term_title( '', false ) . '</span>';
+	} elseif ( is_author() ) {
+		$title = __( 'Author Archives: ', 'twentynineteen' ) . '<span class="page-description">' . get_the_author_meta( 'display_name' ) . '</span>';
+	} elseif ( is_year() ) {
+		$title = __( 'Yearly Archives: ', 'twentynineteen' ) . '<span class="page-description">' . get_the_date( _x( 'Y', 'yearly archives date format', 'twentynineteen' ) ) . '</span>';
+	} elseif ( is_month() ) {
+		$title = __( 'Monthly Archives: ', 'twentynineteen' ) . '<span class="page-description">' . get_the_date( _x( 'F Y', 'monthly archives date format', 'twentynineteen' ) ) . '</span>';
+	} elseif ( is_day() ) {
+		$title = __( 'Daily Archives: ', 'twentynineteen' ) . '<span class="page-description">' . get_the_date() . '</span>';
+	} elseif ( is_post_type_archive() ) {
+		$title = __( 'Post Type Archives: ', 'twentynineteen' ) . '<span class="page-description">' . post_type_archive_title( '', false ) . '</span>';
+	} elseif ( is_tax() ) {
+		$tax = get_taxonomy( get_queried_object()->taxonomy );
+		/* translators: %s: Taxonomy singular name. */
+		$title = sprintf( esc_html__( '%s Archives:', 'twentynineteen' ), $tax->labels->singular_name );
+	} else {
+		$title = __( 'Archives:', 'twentynineteen' );
+	}
+	return $title;
+}
+add_filter( 'get_the_archive_title', 'twentynineteen_get_the_archive_title' );
+
+/**
+ * Determines if post thumbnail can be displayed.
+ */
+function twentynineteen_can_show_post_thumbnail() {
+	return apply_filters( 'twentynineteen_can_show_post_thumbnail', ! post_password_required() && ! is_attachment() && has_post_thumbnail() );
+}
+
+/**
+ * Returns true if image filters are enabled on the theme options.
+ */
+function twentynineteen_image_filters_enabled() {
+	return 0 !== get_theme_mod( 'image_filter', 1 );
+}
+
+/**
+ * Add custom sizes attribute to responsive image functionality for post thumbnails.
+ *
+ * @origin Twenty Nineteen 1.0
+ *
+ * @param array $attr  Attributes for the image markup.
+ * @return string Value for use in post thumbnail 'sizes' attribute.
+ */
+function twentynineteen_post_thumbnail_sizes_attr( $attr ) {
+
+	if ( is_admin() ) {
+		return $attr;
+	}
+
+	if ( ! is_singular() ) {
+		$attr['sizes'] = '(max-width: 34.9rem) calc(100vw - 2rem), (max-width: 53rem) calc(8 * (100vw / 12)), (min-width: 53rem) calc(6 * (100vw / 12)), 100vw';
+	}
+
+	return $attr;
+}
+add_filter( 'wp_get_attachment_image_attributes', 'twentynineteen_post_thumbnail_sizes_attr', 10, 1 );
+
+/**
+ * Returns the size for avatars used in the theme.
+ */
+function twentynineteen_get_avatar_size() {
+	return 60;
+}
+
+/**
+ * Returns true if comment is by author of the post.
+ *
+ * @see get_comment_class()
+ */
+function twentynineteen_is_comment_by_post_author( $comment = null ) {
+	if ( is_object( $comment ) && $comment->user_id > 0 ) {
+		$user = get_userdata( $comment->user_id );
+		$post = get_post( $comment->comment_post_ID );
+		if ( ! empty( $user ) && ! empty( $post ) ) {
+			return $comment->user_id === $post->post_author;
+		}
+	}
+	return false;
+}
+
+/**
+ * Returns information about the current post's discussion, with cache support.
+ */
+function twentynineteen_get_discussion_data() {
+	static $discussion, $post_id;
+
+	$current_post_id = get_the_ID();
+	if ( $current_post_id === $post_id ) {
+		return $discussion; /* If we have discussion information for post ID, return cached object */
+	} else {
+		$post_id = $current_post_id;
+	}
+
+	$comments = get_comments(
+		array(
+			'post_id' => $current_post_id,
+			'orderby' => 'comment_date_gmt',
+			'order'   => get_option( 'comment_order', 'asc' ), /* Respect comment order from Settings » Discussion. */
+			'status'  => 'approve',
+			'number'  => 20, /* Only retrieve the last 20 comments, as the end goal is just 6 unique authors */
+		)
+	);
+
+	$authors = array();
+	foreach ( $comments as $comment ) {
+		$authors[] = ( (int) $comment->user_id > 0 ) ? (int) $comment->user_id : $comment->comment_author_email;
+	}
+
+	$authors    = array_unique( $authors );
+	$discussion = (object) array(
+		'authors'   => array_slice( $authors, 0, 6 ),           /* Six unique authors commenting on the post. */
+		'responses' => get_comments_number( $current_post_id ), /* Number of responses. */
+	);
+
+	return $discussion;
+}
+
+/**
+ * Add an extra menu to our nav for our priority+ navigation to use
+ *
+ * @param object $nav_menu  Nav menu.
+ * @param object $args      Nav menu args.
+ * @return string More link for hidden menu items.
+ */
+function twentynineteen_add_ellipses_to_nav( $nav_menu, $args ) {
+
+	if ( 'menu-1' === $args->theme_location ) :
+
+		$nav_menu .= '
+			<div class="main-menu-more">
+				<ul class="main-menu">
+					<li class="menu-item menu-item-has-children">
+						<button class="submenu-expand main-menu-more-toggle is-empty" tabindex="-1"
+							aria-label="' . esc_attr__( 'More', 'twentynineteen' ) . '" aria-haspopup="true" aria-expanded="false">' .
+							twentynineteen_get_icon_svg( 'arrow_drop_down_ellipsis' ) . '
+						</button>
+						<ul class="sub-menu hidden-links">
+							<li class="mobile-parent-nav-menu-item">
+								<button class="menu-item-link-return">' .
+									twentynineteen_get_icon_svg( 'chevron_left' ) .
+									esc_html__( 'Back', 'twentynineteen' ) . '
+								</button>
+							</li>
+						</ul>
+					</li>
+				</ul>
+			</div>';
+
+	endif;
+
+	return $nav_menu;
+}
+add_filter( 'wp_nav_menu', 'twentynineteen_add_ellipses_to_nav', 10, 2 );
+
+/**
+ * WCAG 2.0 Attributes for Dropdown Menus
+ *
+ * Adjustments to menu attributes tot support WCAG 2.0 recommendations
+ * for flyout and dropdown menus.
+ *
+ * @ref https://www.w3.org/WAI/tutorials/menus/flyout/
+ */
+function twentynineteen_nav_menu_link_attributes( $atts, $item, $args, $depth ) {
+
+	// Add [aria-haspopup] and [aria-expanded] to menu items that have children
+	$item_has_children = in_array( 'menu-item-has-children', $item->classes );
+	if ( $item_has_children ) {
+		$atts['aria-haspopup'] = 'true';
+		$atts['aria-expanded'] = 'false';
+	}
+
+	return $atts;
+}
+add_filter( 'nav_menu_link_attributes', 'twentynineteen_nav_menu_link_attributes', 10, 4 );
+
+/**
+ * Add a dropdown icon to top-level menu items.
+ *
+ * @param string $output Nav menu item start element.
+ * @param object $item   Nav menu item.
+ * @param int    $depth  Depth.
+ * @param object $args   Nav menu args.
+ * @return string Nav menu item start element.
+ * Add a dropdown icon to top-level menu items
+ */
+function twentynineteen_add_dropdown_icons( $output, $item, $depth, $args ) {
+
+	// Only add class to 'top level' items on the 'primary' menu.
+	if ( ! isset( $args->theme_location ) || 'menu-1' !== $args->theme_location ) {
+		return $output;
+	}
+
+	if ( in_array( 'mobile-parent-nav-menu-item', $item->classes, true ) && isset( $item->original_id ) ) {
+		// Inject the keyboard_arrow_left SVG inside the parent nav menu item, and let the item link to the parent item.
+		// @todo Only do this for nested submenus? If on a first-level submenu, then really the link could be "#" since the desire is to remove the target entirely.
+		$link = sprintf(
+			'<button class="menu-item-link-return" tabindex="-1">%s',
+			twentynineteen_get_icon_svg( 'chevron_left', 24 )
+		);
+
+		// replace opening <a> with <button>
+		$output = preg_replace(
+			'/<a\s.*?>/',
+			$link,
+			$output,
+			1 // Limit.
+		);
+
+		// replace closing </a> with </button>
+		$output = preg_replace(
+			'#</a>#i',
+			'</button>',
+			$output,
+			1 // Limit.
+		);
+
+	} elseif ( in_array( 'menu-item-has-children', $item->classes, true ) ) {
+
+		// Add SVG icon to parent items.
+		$icon = twentynineteen_get_icon_svg( 'keyboard_arrow_down', 24 );
+
+		$output .= sprintf(
+			'<button class="submenu-expand" tabindex="-1">%s</button>',
+			$icon
+		);
+	}
+
+	return $output;
+}
+add_filter( 'walker_nav_menu_start_el', 'twentynineteen_add_dropdown_icons', 10, 4 );
+
+/**
+ * Create a nav menu item to be displayed on mobile to navigate from submenu back to the parent.
+ *
+ * This duplicates each parent nav menu item and makes it the first child of itself.
+ *
+ * @param array  $sorted_menu_items Sorted nav menu items.
+ * @param object $args              Nav menu args.
+ * @return array Amended nav menu items.
+ */
+function twentynineteen_add_mobile_parent_nav_menu_items( $sorted_menu_items, $args ) {
+	static $pseudo_id = 0;
+	if ( ! isset( $args->theme_location ) || 'menu-1' !== $args->theme_location ) {
+		return $sorted_menu_items;
+	}
+
+	$amended_menu_items = array();
+	foreach ( $sorted_menu_items as $nav_menu_item ) {
+		$amended_menu_items[] = $nav_menu_item;
+		if ( in_array( 'menu-item-has-children', $nav_menu_item->classes, true ) ) {
+			$parent_menu_item                   = clone $nav_menu_item;
+			$parent_menu_item->original_id      = $nav_menu_item->ID;
+			$parent_menu_item->ID               = --$pseudo_id;
+			$parent_menu_item->db_id            = $parent_menu_item->ID;
+			$parent_menu_item->object_id        = $parent_menu_item->ID;
+			$parent_menu_item->classes          = array( 'mobile-parent-nav-menu-item' );
+			$parent_menu_item->menu_item_parent = $nav_menu_item->ID;
+
+			$amended_menu_items[] = $parent_menu_item;
+		}
+	}
+
+	return $amended_menu_items;
+}
+add_filter( 'wp_nav_menu_objects', 'twentynineteen_add_mobile_parent_nav_menu_items', 10, 2 );
+
+/**
+ * Convert HSL to HEX colors
+ */
+function twentynineteen_hsl_hex( $h, $s, $l, $to_hex = true ) {
+
+	$h /= 360;
+	$s /= 100;
+	$l /= 100;
+
+	$r = $l;
+	$g = $l;
+	$b = $l;
+	$v = ( $l <= 0.5 ) ? ( $l * ( 1.0 + $s ) ) : ( $l + $s - $l * $s );
+	if ( $v > 0 ) {
+		$m;
+		$sv;
+		$sextant;
+		$fract;
+		$vsf;
+		$mid1;
+		$mid2;
+
+		$m       = $l + $l - $v;
+		$sv      = ( $v - $m ) / $v;
+		$h      *= 6.0;
+		$sextant = floor( $h );
+		$fract   = $h - $sextant;
+		$vsf     = $v * $sv * $fract;
+		$mid1    = $m + $vsf;
+		$mid2    = $v - $vsf;
+
+		switch ( $sextant ) {
+			case 0:
+				$r = $v;
+				$g = $mid1;
+				$b = $m;
+				break;
+			case 1:
+				$r = $mid2;
+				$g = $v;
+				$b = $m;
+				break;
+			case 2:
+				$r = $m;
+				$g = $v;
+				$b = $mid1;
+				break;
+			case 3:
+				$r = $m;
+				$g = $mid2;
+				$b = $v;
+				break;
+			case 4:
+				$r = $mid1;
+				$g = $m;
+				$b = $v;
+				break;
+			case 5:
+				$r = $v;
+				$g = $m;
+				$b = $mid2;
+				break;
+		}
+	}
+	$r = round( $r * 255, 0 );
+	$g = round( $g * 255, 0 );
+	$b = round( $b * 255, 0 );
+
+	if ( $to_hex ) {
+
+		$r = ( $r < 15 ) ? '0' . dechex( $r ) : dechex( $r );
+		$g = ( $g < 15 ) ? '0' . dechex( $g ) : dechex( $g );
+		$b = ( $b < 15 ) ? '0' . dechex( $b ) : dechex( $b );
+
+		return "#$r$g$b";
+
+	}
+
+	return "rgb($r, $g, $b)";
+}

wp-content/themes/twentynineteen/inc/template-tags.php

@@ -0,0 +1,258 @@
+<?php
+/**
+ * Custom template tags for this theme
+ *
+ * @package WordPress
+ * @subpackage Twenty_Nineteen
+ * @since 1.0.0
+ */
+
+if ( ! function_exists( 'twentynineteen_posted_on' ) ) :
+	/**
+	 * Prints HTML with meta information for the current post-date/time.
+	 */
+	function twentynineteen_posted_on() {
+		$time_string = '<time class="entry-date published updated" datetime="%1$s">%2$s</time>';
+		if ( get_the_time( 'U' ) !== get_the_modified_time( 'U' ) ) {
+			$time_string = '<time class="entry-date published" datetime="%1$s">%2$s</time><time class="updated" datetime="%3$s">%4$s</time>';
+		}
+
+		$time_string = sprintf(
+			$time_string,
+			esc_attr( get_the_date( DATE_W3C ) ),
+			esc_html( get_the_date() ),
+			esc_attr( get_the_modified_date( DATE_W3C ) ),
+			esc_html( get_the_modified_date() )
+		);
+
+		printf(
+			'<span class="posted-on">%1$s<a href="%2$s" rel="bookmark">%3$s</a></span>',
+			twentynineteen_get_icon_svg( 'watch', 16 ),
+			esc_url( get_permalink() ),
+			$time_string
+		);
+	}
+endif;
+
+if ( ! function_exists( 'twentynineteen_posted_by' ) ) :
+	/**
+	 * Prints HTML with meta information about theme author.
+	 */
+	function twentynineteen_posted_by() {
+		printf(
+			/* translators: 1: SVG icon. 2: Post author, only visible to screen readers. 3: Author link. */
+			'<span class="byline">%1$s<span class="screen-reader-text">%2$s</span><span class="author vcard"><a class="url fn n" href="%3$s">%4$s</a></span></span>',
+			twentynineteen_get_icon_svg( 'person', 16 ),
+			__( 'Posted by', 'twentynineteen' ),
+			esc_url( get_author_posts_url( get_the_author_meta( 'ID' ) ) ),
+			esc_html( get_the_author() )
+		);
+	}
+endif;
+
+if ( ! function_exists( 'twentynineteen_comment_count' ) ) :
+	/**
+	 * Prints HTML with the comment count for the current post.
+	 */
+	function twentynineteen_comment_count() {
+		if ( ! post_password_required() && ( comments_open() || get_comments_number() ) ) {
+			echo '<span class="comments-link">';
+			echo twentynineteen_get_icon_svg( 'comment', 16 );
+
+			/* translators: %s: Post title. Only visible to screen readers. */
+			comments_popup_link( sprintf( __( 'Leave a comment<span class="screen-reader-text"> on %s</span>', 'twentynineteen' ), get_the_title() ) );
+
+			echo '</span>';
+		}
+	}
+endif;
+
+if ( ! function_exists( 'twentynineteen_entry_footer' ) ) :
+	/**
+	 * Prints HTML with meta information for the categories, tags and comments.
+	 */
+	function twentynineteen_entry_footer() {
+
+		// Hide author, post date, category and tag text for pages.
+		if ( 'post' === get_post_type() ) {
+
+			// Posted by
+			twentynineteen_posted_by();
+
+			// Posted on
+			twentynineteen_posted_on();
+
+			/* translators: Used between list items, there is a space after the comma. */
+			$categories_list = get_the_category_list( __( ', ', 'twentynineteen' ) );
+			if ( $categories_list ) {
+				printf(
+					/* translators: 1: SVG icon. 2: Posted in label, only visible to screen readers. 3: List of categories. */
+					'<span class="cat-links">%1$s<span class="screen-reader-text">%2$s</span>%3$s</span>',
+					twentynineteen_get_icon_svg( 'archive', 16 ),
+					__( 'Posted in', 'twentynineteen' ),
+					$categories_list
+				); // WPCS: XSS OK.
+			}
+
+			/* translators: Used between list items, there is a space after the comma. */
+			$tags_list = get_the_tag_list( '', __( ', ', 'twentynineteen' ) );
+			if ( $tags_list ) {
+				printf(
+					/* translators: 1: SVG icon. 2: Posted in label, only visible to screen readers. 3: List of tags. */
+					'<span class="tags-links">%1$s<span class="screen-reader-text">%2$s </span>%3$s</span>',
+					twentynineteen_get_icon_svg( 'tag', 16 ),
+					__( 'Tags:', 'twentynineteen' ),
+					$tags_list
+				); // WPCS: XSS OK.
+			}
+		}
+
+		// Comment count.
+		if ( ! is_singular() ) {
+			twentynineteen_comment_count();
+		}
+
+		// Edit post link.
+		edit_post_link(
+			sprintf(
+				wp_kses(
+					/* translators: %s: Post title. Only visible to screen readers. */
+					__( 'Edit <span class="screen-reader-text">%s</span>', 'twentynineteen' ),
+					array(
+						'span' => array(
+							'class' => array(),
+						),
+					)
+				),
+				get_the_title()
+			),
+			'<span class="edit-link">' . twentynineteen_get_icon_svg( 'edit', 16 ),
+			'</span>'
+		);
+	}
+endif;
+
+if ( ! function_exists( 'twentynineteen_post_thumbnail' ) ) :
+	/**
+	 * Displays an optional post thumbnail.
+	 *
+	 * Wraps the post thumbnail in an anchor element on index views, or a div
+	 * element when on single views.
+	 */
+	function twentynineteen_post_thumbnail() {
+		if ( ! twentynineteen_can_show_post_thumbnail() ) {
+			return;
+		}
+
+		if ( is_singular() ) :
+			?>
+
+			<figure class="post-thumbnail">
+				<?php the_post_thumbnail(); ?>
+			</figure><!-- .post-thumbnail -->
+
+			<?php
+		else :
+			?>
+
+		<figure class="post-thumbnail">
+			<a class="post-thumbnail-inner" href="<?php the_permalink(); ?>" aria-hidden="true" tabindex="-1">
+				<?php the_post_thumbnail( 'post-thumbnail' ); ?>
+			</a>
+		</figure>
+
+			<?php
+		endif; // End is_singular().
+	}
+endif;
+
+if ( ! function_exists( 'twentynineteen_get_user_avatar_markup' ) ) :
+	/**
+	 * Returns the HTML markup to generate a user avatar.
+	 */
+	function twentynineteen_get_user_avatar_markup( $id_or_email = null ) {
+
+		if ( ! isset( $id_or_email ) ) {
+			$id_or_email = get_current_user_id();
+		}
+
+		return sprintf( '<div class="comment-user-avatar comment-author vcard">%s</div>', get_avatar( $id_or_email, twentynineteen_get_avatar_size() ) );
+	}
+endif;
+
+if ( ! function_exists( 'twentynineteen_discussion_avatars_list' ) ) :
+	/**
+	 * Displays a list of avatars involved in a discussion for a given post.
+	 */
+	function twentynineteen_discussion_avatars_list( $comment_authors ) {
+		if ( empty( $comment_authors ) ) {
+			return;
+		}
+		echo '<ol class="discussion-avatar-list">', "\n";
+		foreach ( $comment_authors as $id_or_email ) {
+			printf(
+				"<li>%s</li>\n",
+				twentynineteen_get_user_avatar_markup( $id_or_email )
+			);
+		}
+		echo '</ol><!-- .discussion-avatar-list -->', "\n";
+	}
+endif;
+
+if ( ! function_exists( 'twentynineteen_comment_form' ) ) :
+	/**
+	 * Documentation for function.
+	 */
+	function twentynineteen_comment_form( $order ) {
+		if ( true === $order || strtolower( $order ) === strtolower( get_option( 'comment_order', 'asc' ) ) ) {
+
+			comment_form(
+				array(
+					'logged_in_as' => null,
+					'title_reply'  => null,
+				)
+			);
+		}
+	}
+endif;
+
+if ( ! function_exists( 'twentynineteen_the_posts_navigation' ) ) :
+	/**
+	 * Documentation for function.
+	 */
+	function twentynineteen_the_posts_navigation() {
+		the_posts_pagination(
+			array(
+				'mid_size'  => 2,
+				'prev_text' => sprintf(
+					'%s <span class="nav-prev-text">%s</span>',
+					twentynineteen_get_icon_svg( 'chevron_left', 22 ),
+					__( 'Newer posts', 'twentynineteen' )
+				),
+				'next_text' => sprintf(
+					'<span class="nav-next-text">%s</span> %s',
+					__( 'Older posts', 'twentynineteen' ),
+					twentynineteen_get_icon_svg( 'chevron_right', 22 )
+				),
+			)
+		);
+	}
+endif;
+
+if ( ! function_exists( 'wp_body_open' ) ) :
+	/**
+	 * Fire the wp_body_open action.
+	 *
+	 * Added for backwards compatibility to support pre 5.2.0 WordPress versions.
+	 *
+	 * @since Twenty Nineteen 1.4
+	 */
+	function wp_body_open() {
+		/**
+		 * Triggered after the opening <body> tag.
+		 *
+		 * @since Twenty Nineteen 1.4
+		 */
+		do_action( 'wp_body_open' );
+	}
+endif;

wp-content/themes/twentynineteen/index.php

@@ -0,0 +1,47 @@
+<?php
+/**
+ * The main template file
+ *
+ * This is the most generic template file in a WordPress theme
+ * and one of the two required files for a theme (the other being style.css).
+ * It is used to display a page when nothing more specific matches a query.
+ * E.g., it puts together the home page when no home.php file exists.
+ *
+ * @link https://developer.wordpress.org/themes/basics/template-hierarchy/
+ *
+ * @package WordPress
+ * @subpackage Twenty_Nineteen
+ * @since 1.0.0
+ */
+
+get_header();
+?>
+
+	<div id="primary" class="content-area">
+		<main id="main" class="site-main">
+
+		<?php
+		if ( have_posts() ) {
+
+			// Load posts loop.
+			while ( have_posts() ) {
+				the_post();
+				get_template_part( 'template-parts/content/content' );
+			}
+
+			// Previous/next page navigation.
+			twentynineteen_the_posts_navigation();
+
+		} else {
+
+			// If no content, include the "No posts found" template.
+			get_template_part( 'template-parts/content/content', 'none' );
+
+		}
+		?>
+
+		</main><!-- .site-main -->
+	</div><!-- .content-area -->
+
+<?php
+get_footer();

wp-content/themes/twentynineteen/js/customize-controls.js

@@ -0,0 +1,30 @@
+/**
+ * File customize-controls.js.
+ *
+ * Theme Customizer enhancements for a better user experience.
+ *
+ * Contains handlers to make Theme Customizer preview reload changes asynchronously.
+ */
+
+(function() {
+
+	wp.customize.bind( 'ready', function() {
+
+		// Only show the color hue control when there's a custom primary color.
+		wp.customize( 'primary_color', function( setting ) {
+			wp.customize.control( 'primary_color_hue', function( control ) {
+				var visibility = function() {
+					if ( 'custom' === setting.get() ) {
+						control.container.slideDown( 180 );
+					} else {
+						control.container.slideUp( 180 );
+					}
+				};
+
+				visibility();
+				setting.bind( visibility );
+			});
+		});
+	});
+
+})();

wp-content/themes/twentynineteen/js/customize-preview.js

@@ -0,0 +1,60 @@
+/**
+ * File customize-preview.js.
+ *
+ * Theme Customizer enhancements for a better user experience.
+ *
+ * Contains handlers to make Theme Customizer preview reload changes asynchronously.
+ */
+
+(function( $ ) {
+
+	// Primary color.
+	wp.customize( 'primary_color', function( value ) {
+		value.bind( function( to ) {
+			// Update custom color CSS.
+			var style = $( '#custom-theme-colors' ),
+				hue = style.data( 'hue' ),
+				css = style.html(),
+				color;
+
+			if( 'custom' === to ){
+				// If a custom primary color is selected, use the currently set primary_color_hue
+				color = wp.customize.get().primary_color_hue;
+			} else {
+				// If the "default" option is selected, get the default primary_color_hue
+				color = 199;
+			}
+
+			// Equivalent to css.replaceAll, with hue followed by comma to prevent values with units from being changed.
+			css = css.split( hue + ',' ).join( color + ',' );
+			style.html( css ).data( 'hue', color );
+		});
+	});
+
+	// Primary color hue.
+	wp.customize( 'primary_color_hue', function( value ) {
+		value.bind( function( to ) {
+
+			// Update custom color CSS.
+			var style = $( '#custom-theme-colors' ),
+				hue = style.data( 'hue' ),
+				css = style.html();
+
+			// Equivalent to css.replaceAll, with hue followed by comma to prevent values with units from being changed.
+			css = css.split( hue + ',' ).join( to + ',' );
+			style.html( css ).data( 'hue', to );
+		});
+	});
+
+	// Image filter.
+	wp.customize( 'image_filter', function( value ) {
+		value.bind( function( to ) {
+			if ( to ) {
+				$( 'body' ).addClass( 'image-filters-enabled' );
+			} else {
+				$( 'body' ).removeClass( 'image-filters-enabled' );
+			}
+		} );
+	} );
+
+})( jQuery );

wp-content/themes/twentynineteen/js/priority-menu.js

@@ -0,0 +1,216 @@
+(function() {
+
+	/**
+	 * Debounce
+	 *
+	 * @param {Function} func
+	 * @param {number} wait
+	 * @param {boolean} immediate
+	 */
+	function debounce(func, wait, immediate) {
+		'use strict';
+
+		var timeout;
+		wait      = (typeof wait !== 'undefined') ? wait : 20;
+		immediate = (typeof immediate !== 'undefined') ? immediate : true;
+
+		return function() {
+
+			var context = this, args = arguments;
+			var later = function() {
+				timeout = null;
+
+				if (!immediate) {
+					func.apply(context, args);
+				}
+			};
+
+			var callNow = immediate && !timeout;
+
+			clearTimeout(timeout);
+			timeout = setTimeout(later, wait);
+
+			if (callNow) {
+				func.apply(context, args);
+			}
+		};
+	}
+
+	/**
+	 * Prepends an element to a container.
+	 *
+	 * @param {Element} container
+	 * @param {Element} element
+	 */
+	function prependElement(container, element) {
+		if (container.firstChild.nextSibling) {
+			return container.insertBefore(element, container.firstChild.nextSibling);
+		} else {
+			return container.appendChild(element);
+		}
+	}
+
+	/**
+	 * Shows an element by adding a hidden className.
+	 *
+	 * @param {Element} element
+	 */
+	function showButton(element) {
+		// classList.remove is not supported in IE11
+		element.className = element.className.replace('is-empty', '');
+	}
+
+	/**
+	 * Hides an element by removing the hidden className.
+	 *
+	 * @param {Element} element
+	 */
+	function hideButton(element) {
+		// classList.add is not supported in IE11
+		if (!element.classList.contains('is-empty')) {
+			element.className += ' is-empty';
+		}
+	}
+
+	/**
+	 * Returns the currently available space in the menu container.
+	 *
+	 * @returns {number} Available space
+	 */
+	function getAvailableSpace( button, container ) {
+		return container.offsetWidth - button.offsetWidth - 22;
+	}
+
+	/**
+	 * Returns whether the current menu is overflowing or not.
+	 *
+	 * @returns {boolean} Is overflowing
+	 */
+	function isOverflowingNavivation( list, button, container ) {
+		return list.offsetWidth > getAvailableSpace( button, container );
+	}
+
+	/**
+	 * Set menu container variable
+	 */
+	var navContainer = document.querySelector('.main-navigation');
+	var breaks       = [];
+
+	/**
+	 * Let’s bail if we our menu doesn't exist
+	 */
+	if ( ! navContainer ) {
+		return;
+	}
+
+	/**
+	 * Refreshes the list item from the menu depending on the menu size
+	 */
+	function updateNavigationMenu( container ) {
+
+		/**
+		 * Let’s bail if our menu is empty
+		 */
+		if ( ! container.parentNode.querySelector('.main-menu[id]') ) {
+			return;
+		}
+
+		// Adds the necessary UI to operate the menu.
+		var visibleList  = container.parentNode.querySelector('.main-menu[id]');
+		var hiddenList   = visibleList.parentNode.nextElementSibling.querySelector('.hidden-links');
+		var toggleButton = visibleList.parentNode.nextElementSibling.querySelector('.main-menu-more-toggle');
+
+		if ( isOverflowingNavivation( visibleList, toggleButton, container ) ) {
+
+			// Record the width of the list
+			breaks.push( visibleList.offsetWidth );
+			// Move last item to the hidden list
+			prependElement( hiddenList, ! visibleList.lastChild || null === visibleList.lastChild ? visibleList.previousElementSibling : visibleList.lastChild );
+			// Show the toggle button
+			showButton( toggleButton );
+
+		} else {
+
+			// There is space for another item in the nav
+			if ( getAvailableSpace( toggleButton, container ) > breaks[breaks.length - 1] ) {
+				// Move the item to the visible list
+				visibleList.appendChild( hiddenList.firstChild.nextSibling );
+				breaks.pop();
+			}
+
+			// Hide the dropdown btn if hidden list is empty
+			if (breaks.length < 2) {
+				hideButton( toggleButton );
+			}
+		}
+
+		// Recur if the visible list is still overflowing the nav
+		if ( isOverflowingNavivation( visibleList, toggleButton, container ) ) {
+			updateNavigationMenu( container );
+		}
+	}
+
+	/**
+	 * Run our priority+ function as soon as the document is `ready`
+	 */
+	document.addEventListener( 'DOMContentLoaded', function() {
+
+		updateNavigationMenu( navContainer );
+
+		// Also, run our priority+ function on selective refresh in the customizer
+		var hasSelectiveRefresh = (
+			'undefined' !== typeof wp &&
+			wp.customize &&
+			wp.customize.selectiveRefresh &&
+			wp.customize.navMenusPreview.NavMenuInstancePartial
+		);
+
+		if ( hasSelectiveRefresh ) {
+			// Re-run our priority+ function on Nav Menu partial refreshes
+			wp.customize.selectiveRefresh.bind( 'partial-content-rendered', function ( placement ) {
+
+				var isNewNavMenu = (
+					placement &&
+					placement.partial.id.includes( 'nav_menu_instance' ) &&
+					'null' !== placement.container[0].parentNode &&
+					placement.container[0].parentNode.classList.contains( 'main-navigation' )
+				);
+
+				if ( isNewNavMenu ) {
+					updateNavigationMenu( placement.container[0].parentNode );
+				}
+			});
+        }
+	});
+
+	/**
+	 * Run our priority+ function on load
+	 */
+	window.addEventListener( 'load', function() {
+		updateNavigationMenu( navContainer );
+	});
+
+	/**
+	 * Run our priority+ function every time the window resizes
+	 */
+	var isResizing = false;
+	window.addEventListener( 'resize',
+		debounce( function() {
+			if ( isResizing ) {
+				return;
+			}
+
+			isResizing = true;
+			setTimeout( function() {
+				updateNavigationMenu( navContainer );
+				isResizing = false;
+			}, 150 );
+		} )
+	);
+
+	/**
+	 * Run our priority+ function
+	 */
+	updateNavigationMenu( navContainer );
+
+})();

wp-content/themes/twentynineteen/js/skip-link-focus-fix.js

@@ -0,0 +1,33 @@
+/**
+ * File skip-link-focus-fix.js.
+ *
+ * Helps with accessibility for keyboard only users.
+ *
+ * This is the source file for what is minified in the twentynineteen_skip_link_focus_fix() PHP function.
+ *
+ * Learn more: https://git.io/vWdr2
+ */
+( function() {
+	var isIe = /(trident|msie)/i.test( navigator.userAgent );
+
+	if ( isIe && document.getElementById && window.addEventListener ) {
+		window.addEventListener( 'hashchange', function() {
+			var id = location.hash.substring( 1 ),
+				element;
+
+			if ( ! ( /^[A-z0-9_-]+$/.test( id ) ) ) {
+				return;
+			}
+
+			element = document.getElementById( id );
+
+			if ( element ) {
+				if ( ! ( /^(?:a|select|input|button|textarea)$/i.test( element.tagName ) ) ) {
+					element.tabIndex = -1;
+				}
+
+				element.focus();
+			}
+		}, false );
+	}
+} )();

wp-content/themes/twentynineteen/js/touch-keyboard-navigation.js

@@ -0,0 +1,354 @@
+/**
+ * Touch & Keyboard navigation.
+ *
+ * Contains handlers for touch devices and keyboard navigation.
+ */
+
+(function() {
+
+	/**
+	 * Debounce
+	 *
+	 * @param {Function} func
+	 * @param {number} wait
+	 * @param {boolean} immediate
+	 */
+	function debounce(func, wait, immediate) {
+		'use strict';
+
+		var timeout;
+		wait      = (typeof wait !== 'undefined') ? wait : 20;
+		immediate = (typeof immediate !== 'undefined') ? immediate : true;
+
+		return function() {
+
+			var context = this, args = arguments;
+			var later = function() {
+				timeout = null;
+
+				if (!immediate) {
+					func.apply(context, args);
+				}
+			};
+
+			var callNow = immediate && !timeout;
+
+			clearTimeout(timeout);
+			timeout = setTimeout(later, wait);
+
+			if (callNow) {
+				func.apply(context, args);
+			}
+		};
+	}
+
+	/**
+	 * Add class
+	 *
+	 * @param {Object} el
+	 * @param {string} cls
+	 */
+	function addClass(el, cls) {
+		if ( ! el.className.match( '(?:^|\\s)' + cls + '(?!\\S)') ) {
+			el.className += ' ' + cls;
+		}
+	}
+
+	/**
+	 * Delete class
+	 *
+	 * @param {Object} el
+	 * @param {string} cls
+	 */
+	function deleteClass(el, cls) {
+		el.className = el.className.replace( new RegExp( '(?:^|\\s)' + cls + '(?!\\S)' ),'' );
+	}
+
+	/**
+	 * Has class?
+	 *
+	 * @param {Object} el
+	 * @param {string} cls
+	 *
+	 * @returns {boolean} Has class
+	 */
+	function hasClass(el, cls) {
+
+		if ( el.className.match( '(?:^|\\s)' + cls + '(?!\\S)' ) ) {
+			return true;
+		}
+	}
+
+	/**
+	 * Toggle Aria Expanded state for screenreaders
+	 *
+	 * @param {Object} ariaItem
+	 */
+	function toggleAriaExpandedState( ariaItem ) {
+		'use strict';
+
+		var ariaState = ariaItem.getAttribute('aria-expanded');
+
+		if ( ariaState === 'true' ) {
+			ariaState = 'false';
+		} else {
+			ariaState = 'true';
+		}
+
+		ariaItem.setAttribute('aria-expanded', ariaState);
+	}
+
+	/**
+	 * Open sub-menu
+	 *
+	 * @param {Object} currentSubMenu
+	 */
+	function openSubMenu( currentSubMenu ) {
+		'use strict';
+
+		// Update classes
+		// classList.add is not supported in IE11
+		currentSubMenu.parentElement.className += ' off-canvas';
+		currentSubMenu.parentElement.lastElementChild.className += ' expanded-true';
+
+		// Update aria-expanded state
+		toggleAriaExpandedState( currentSubMenu );
+	}
+
+	/**
+	 * Close sub-menu
+	 *
+	 * @param {Object} currentSubMenu
+	 */
+	function closeSubMenu( currentSubMenu ) {
+		'use strict';
+
+		var menuItem     = getCurrentParent( currentSubMenu, '.menu-item' ); // this.parentNode
+		var menuItemAria = menuItem.querySelector('a[aria-expanded]');
+		var subMenu      = currentSubMenu.closest('.sub-menu');
+
+		// If this is in a sub-sub-menu, go back to parent sub-menu
+		if ( getCurrentParent( currentSubMenu, 'ul' ).classList.contains( 'sub-menu' ) ) {
+
+			// Update classes
+			// classList.remove is not supported in IE11
+			menuItem.className = menuItem.className.replace( 'off-canvas', '' );
+			subMenu.className  = subMenu.className.replace( 'expanded-true', '' );
+
+			// Update aria-expanded and :focus states
+			toggleAriaExpandedState( menuItemAria );
+
+		// Or else close all sub-menus
+		} else {
+
+			// Update classes
+			// classList.remove is not supported in IE11
+			menuItem.className = menuItem.className.replace( 'off-canvas', '' );
+			menuItem.lastElementChild.className = menuItem.lastElementChild.className.replace( 'expanded-true', '' );
+
+			// Update aria-expanded and :focus states
+			toggleAriaExpandedState( menuItemAria );
+		}
+	}
+
+	/**
+	 * Find first ancestor of an element by selector
+	 *
+	 * @param {Object} child
+	 * @param {String} selector
+	 * @param {String} stopSelector
+	 */
+	function getCurrentParent( child, selector, stopSelector ) {
+
+		var currentParent = null;
+
+		while ( child ) {
+
+			if ( child.matches(selector) ) {
+
+				currentParent = child;
+				break;
+
+			} else if ( stopSelector && child.matches(stopSelector) ) {
+
+				break;
+			}
+
+			child = child.parentElement;
+		}
+
+		return currentParent;
+	}
+
+	/**
+	 * Remove all off-canvas states
+	 */
+	function removeAllFocusStates() {
+		'use strict';
+
+		var siteBranding            = document.getElementsByClassName( 'site-branding' )[0];
+		var getFocusedElements      = siteBranding.querySelectorAll(':hover, :focus, :focus-within');
+		var getFocusedClassElements = siteBranding.querySelectorAll('.is-focused');
+		var i;
+		var o;
+
+		for ( i = 0; i < getFocusedElements.length; i++) {
+			getFocusedElements[i].blur();
+		}
+
+		for ( o = 0; o < getFocusedClassElements.length; o++) {
+			deleteClass( getFocusedClassElements[o], 'is-focused' );
+		}
+	}
+
+	/**
+	 * Matches polyfill for IE11
+	 */
+	if (!Element.prototype.matches) {
+		Element.prototype.matches = Element.prototype.msMatchesSelector;
+	}
+
+	/**
+	 * Toggle `focus` class to allow sub-menu access on touch screens.
+	 */
+	function toggleSubmenuDisplay() {
+
+		document.addEventListener('touchstart', function(event) {
+
+			if ( event.target.matches('a') ) {
+
+				var url = event.target.getAttribute( 'href' ) ? event.target.getAttribute( 'href' ) : '';
+
+				// Open submenu if url is #
+				if ( '#' === url && event.target.nextSibling.matches('.submenu-expand') ) {
+					openSubMenu( event.target );
+				}
+			}
+
+			// Check if .submenu-expand is touched
+			if ( event.target.matches('.submenu-expand') ) {
+				openSubMenu(event.target);
+
+			// Check if child of .submenu-expand is touched
+			} else if ( null != getCurrentParent( event.target, '.submenu-expand' ) &&
+								getCurrentParent( event.target, '.submenu-expand' ).matches( '.submenu-expand' ) ) {
+				openSubMenu( getCurrentParent( event.target, '.submenu-expand' ) );
+
+			// Check if .menu-item-link-return is touched
+			} else if ( event.target.matches('.menu-item-link-return') ) {
+				closeSubMenu( event.target );
+
+			// Check if child of .menu-item-link-return is touched
+			} else if ( null != getCurrentParent( event.target, '.menu-item-link-return' ) && getCurrentParent( event.target, '.menu-item-link-return' ).matches( '.menu-item-link-return' ) ) {
+				closeSubMenu( event.target );
+			}
+
+			// Prevent default mouse/focus events
+			removeAllFocusStates();
+
+		}, false);
+
+		document.addEventListener('touchend', function(event) {
+
+			var mainNav = getCurrentParent( event.target, '.main-navigation' );
+
+			if ( null != mainNav && hasClass( mainNav, '.main-navigation' ) ) {
+				// Prevent default mouse events
+				event.preventDefault();
+
+			} else if (
+				event.target.matches('.submenu-expand') ||
+				null != getCurrentParent( event.target, '.submenu-expand' ) &&
+				getCurrentParent( event.target, '.submenu-expand' ).matches( '.submenu-expand' ) ||
+				event.target.matches('.menu-item-link-return') ||
+				null != getCurrentParent( event.target, '.menu-item-link-return' ) &&
+				getCurrentParent( event.target, '.menu-item-link-return' ).matches( '.menu-item-link-return' ) ) {
+					// Prevent default mouse events
+					event.preventDefault();
+			}
+
+			// Prevent default mouse/focus events
+			removeAllFocusStates();
+
+		}, false);
+
+		document.addEventListener('focus', function(event) {
+
+			if ( event.target.matches('.main-navigation > div > ul > li a') ) {
+
+				// Remove Focused elements in sibling div
+				var currentDiv        = getCurrentParent( event.target, 'div', '.main-navigation' );
+				var currentDivSibling = currentDiv.previousElementSibling === null ? currentDiv.nextElementSibling : currentDiv.previousElementSibling;
+				var focusedElement    = currentDivSibling.querySelector( '.is-focused' );
+				var focusedClass      = 'is-focused';
+				var prevLi            = getCurrentParent( event.target, '.main-navigation > div > ul > li', '.main-navigation' ).previousElementSibling;
+				var nextLi            = getCurrentParent( event.target, '.main-navigation > div > ul > li', '.main-navigation' ).nextElementSibling;
+
+				if ( null !== focusedElement && null !== hasClass( focusedElement, focusedClass ) ) {
+					deleteClass( focusedElement, focusedClass );
+				}
+
+				// Add .is-focused class to top-level li
+				if ( getCurrentParent( event.target, '.main-navigation > div > ul > li', '.main-navigation' ) ) {
+					addClass( getCurrentParent( event.target, '.main-navigation > div > ul > li', '.main-navigation' ), focusedClass );
+				}
+
+				// Check for previous li
+				if ( prevLi && hasClass( prevLi, focusedClass ) ) {
+					deleteClass( prevLi, focusedClass );
+				}
+
+				// Check for next li
+				if ( nextLi && hasClass( nextLi, focusedClass ) ) {
+					deleteClass( nextLi, focusedClass );
+				}
+			}
+
+		}, true);
+
+		document.addEventListener('click', function(event) {
+
+			// Remove all focused menu states when clicking outside site branding
+			if ( event.target !== document.getElementsByClassName( 'site-branding' )[0] ) {
+				removeAllFocusStates();
+			} else {
+				// nothing
+			}
+
+		}, false);
+	}
+
+	/**
+	 * Run our sub-menu function as soon as the document is `ready`
+	 */
+	document.addEventListener( 'DOMContentLoaded', function() {
+		toggleSubmenuDisplay();
+	});
+
+	/**
+	 * Run our sub-menu function on selective refresh in the customizer
+	 */
+	document.addEventListener( 'customize-preview-menu-refreshed', function( e, params ) {
+		if ( 'menu-1' === params.wpNavMenuArgs.theme_location ) {
+			toggleSubmenuDisplay();
+		}
+	});
+
+	/**
+	 * Run our sub-menu function every time the window resizes
+	 */
+	var isResizing = false;
+	window.addEventListener( 'resize', function() {
+		isResizing = true;
+		debounce( function() {
+			if ( isResizing ) {
+				return;
+			}
+
+			toggleSubmenuDisplay();
+			isResizing = false;
+
+		}, 150 );
+	} );
+
+})();

wp-content/themes/twentynineteen/package.json

@@ -0,0 +1,44 @@
+{
+  "name": "twentynineteen",
+  "version": "1.0.0",
+  "description": "Default WP Theme",
+  "bugs": {
+    "url": "https://github.com/WordPress/twentynineteen/issues"
+  },
+  "homepage": "https://github.com/WordPress/twentynineteen#readme",
+  "devDependencies": {
+    "@wordpress/browserslist-config": "^2.5.0",
+    "autoprefixer": "^9.6.0",
+    "chokidar-cli": "^2.0.0",
+    "node-sass": "^4.12.0",
+    "npm-run-all": "^4.1.5",
+    "postcss-cli": "^6.1.2",
+    "postcss-focus-within": "^3.0.0",
+    "rtlcss": "^2.4.0"
+  },
+  "rtlcssConfig": {
+    "options": {
+      "autoRename": false,
+      "autoRenameStrict": false,
+      "blacklist": {},
+      "clean": true,
+      "greedy": false,
+      "processUrls": false,
+      "stringMap": []
+    },
+    "plugins": [],
+    "map": false
+  },
+  "browserslist": [
+    "extends @wordpress/browserslist-config"
+  ],
+  "scripts": {
+    "build:style": "node-sass style.scss style.css --output-style expanded && postcss -r style.css",
+    "build:style-editor": "node-sass style-editor.scss style-editor.css --output-style expanded && postcss -r style-editor.css",
+    "build:style-editor-customizer": "node-sass style-editor-customizer.scss style-editor-customizer.css --output-style expanded && postcss -r style-editor-customizer.css",
+    "build:rtl": "rtlcss style.css style-rtl.css",
+    "build:print": "node-sass print.scss print.css --output-style expanded && postcss -r print.css",
+    "build": "run-p \"build:*\"",
+    "watch": "chokidar \"**/*.scss\" -c \"npm run build\" --initial"
+  }
+}

wp-content/themes/twentynineteen/page.php

@@ -0,0 +1,38 @@
+<?php
+/**
+ * The template for displaying all single posts
+ *
+ * @link https://developer.wordpress.org/themes/basics/template-hierarchy/#single-post
+ *
+ * @package WordPress
+ * @subpackage Twenty_Nineteen
+ * @since 1.0.0
+ */
+
+get_header();
+?>
+
+	<div id="primary" class="content-area">
+		<main id="main" class="site-main">
+
+			<?php
+
+			/* Start the Loop */
+			while ( have_posts() ) :
+				the_post();
+
+				get_template_part( 'template-parts/content/content', 'page' );
+
+				// If comments are open or we have at least one comment, load up the comment template.
+				if ( comments_open() || get_comments_number() ) {
+					comments_template();
+				}
+
+			endwhile; // End of the loop.
+			?>
+
+		</main><!-- #main -->
+	</div><!-- #primary -->
+
+<?php
+get_footer();

wp-content/themes/twentynineteen/postcss.config.js

@@ -0,0 +1,13 @@
+var postcssFocusWithin = require('postcss-focus-within');
+
+module.exports = {
+    plugins: {
+        autoprefixer: {}
+    }
+};
+
+module.exports = {
+    plugins: [
+        postcssFocusWithin(/* pluginOptions */)
+    ]
+};

wp-content/themes/twentynineteen/print.css

@@ -0,0 +1,162 @@
+/*
+Theme Name: Twenty Nineteen
+
+Adding print support. The print styles are based on the the great work of
+Andreas Hecht in https://www.jotform.com/blog/css-perfect-print-stylesheet-98272/.
+*/
+/*--------------------------------------------------------------
+>>> TABLE OF CONTENTS:
+----------------------------------------------------------------
+# Margins
+# Typography
+# Page breaks
+# Links
+# Visibility
+--------------------------------------------------------------*/
+@media print {
+  /* Margins */
+  @page {
+    margin: 2cm;
+  }
+  .entry {
+    margin-top: 1em;
+  }
+  .entry .entry-header, .site-footer .site-info {
+    margin: 0;
+  }
+  /* Fonts */
+  body {
+    font: 13pt Georgia, "Times New Roman", Times, serif;
+    line-height: 1.3;
+    background: #fff !important;
+    color: #000;
+  }
+  h1 {
+    font-size: 24pt;
+  }
+  h2,
+  h3,
+  h4,
+  .has-regular-font-size,
+  .has-large-font-size,
+  h2.author-title,
+  p.author-bio,
+  .comments-title, h3 {
+    font-size: 14pt;
+    margin-top: 25px;
+  }
+  /* Page breaks */
+  a {
+    page-break-inside: avoid;
+  }
+  blockquote {
+    page-break-inside: avoid;
+  }
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
+    page-break-after: avoid;
+    page-break-inside: avoid;
+  }
+  img {
+    page-break-inside: avoid;
+    page-break-after: avoid;
+  }
+  table, pre {
+    page-break-inside: avoid;
+  }
+  ul, ol, dl {
+    page-break-before: avoid;
+  }
+  /* Links */
+  a:link, a:visited, a {
+    background: transparent;
+    font-weight: bold;
+    text-decoration: underline;
+    text-align: left;
+  }
+  a {
+    page-break-inside: avoid;
+  }
+  a[href^=http]:after {
+    content: " < " attr(href) "> ";
+  }
+  a:after > img {
+    content: "";
+  }
+  article a[href^="#"]:after {
+    content: "";
+  }
+  a:not(:local-link):after {
+    content: " < " attr(href) "> ";
+  }
+  /* Visibility */
+  .main-navigation,
+  .site-title + .main-navigation,
+  .social-navigation,
+  .site-branding-container:before,
+  .entry .entry-title:before,
+  .entry-footer,
+  .author-description:before,
+  .post-navigation,
+  .widget-area,
+  .comment-form-flex,
+  .comment-reply,
+  .comment .comment-metadata .edit-link {
+    display: none;
+  }
+  .entry .entry-content .wp-block-button .wp-block-button__link,
+  .entry .entry-content .button {
+    color: #000;
+    background: none;
+  }
+  /* Site Header (With Featured Image) */
+  .site-header.featured-image {
+    min-height: 0;
+  }
+  .site-header.featured-image .main-navigation a,
+  .site-header.featured-image .main-navigation a + svg,
+  .site-header.featured-image .social-navigation a,
+  .site-header.featured-image .site-title a,
+  .site-header.featured-image .site-featured-image a,
+  .site-header.featured-image .site-branding .site-title,
+  .site-header.featured-image .site-branding .site-description,
+  .site-header.featured-image .main-navigation a:after,
+  .site-header.featured-image .main-navigation .main-menu > li.menu-item-has-children:after,
+  .site-header.featured-image .main-navigation li,
+  .site-header.featured-image .social-navigation li,
+  .site-header.featured-image .entry-meta,
+  .site-header.featured-image .entry-title,
+  .site-header.featured-image#masthead .site-title a {
+    color: #000;
+    text-shadow: none;
+  }
+  .site-header.featured-image .site-featured-image .entry-header,
+  .site-header.featured-image .site-branding-container {
+    margin-top: 0;
+    margin-bottom: 0;
+  }
+  .site-header.featured-image .site-featured-image .post-thumbnail img {
+    position: relative;
+    height: initial;
+    width: initial;
+    object-fit: none;
+    min-width: 0;
+    min-height: 0;
+    max-width: 100%;
+    margin-top: 1rem;
+  }
+  /* Remove image filters from featured image */
+  .image-filters-enabled *:after {
+    display: none !important;
+  }
+  .image-filters-enabled .site-header.featured-image .site-featured-image:before {
+    display: none;
+  }
+  .image-filters-enabled .site-header.featured-image .site-featured-image .post-thumbnail img {
+    filter: none;
+  }
+}

wp-content/themes/twentynineteen/print.scss

@@ -0,0 +1,198 @@
+/*
+Theme Name: Twenty Nineteen
+
+Adding print support. The print styles are based on the the great work of
+Andreas Hecht in https://www.jotform.com/blog/css-perfect-print-stylesheet-98272/.
+*/
+
+/*--------------------------------------------------------------
+>>> TABLE OF CONTENTS:
+----------------------------------------------------------------
+# Margins
+# Typography
+# Page breaks
+# Links
+# Visibility
+--------------------------------------------------------------*/
+
+@media print {
+
+	/* Margins */
+
+	@page {
+		margin: 2cm;
+	}
+
+	.entry {
+		margin-top: 1em;
+	}
+
+	.entry .entry-header, .site-footer .site-info {
+		margin: 0;
+	}
+
+	/* Fonts */
+
+	body {
+		font: 13pt Georgia, "Times New Roman", Times, serif;
+		line-height: 1.3;
+		background: #fff !important;
+		color: #000;
+	}
+
+	h1 {
+		font-size: 24pt;
+	}
+
+	h2,
+	h3,
+	h4,
+	.has-regular-font-size, 
+	.has-large-font-size, 
+	h2.author-title, 
+	p.author-bio, 
+	.comments-title, h3 {
+		font-size: 14pt;
+		margin-top: 25px;
+	}
+
+	/* Page breaks */
+
+	a {
+		page-break-inside: avoid
+	}
+
+	blockquote {
+		page-break-inside: avoid;
+	}
+
+	h1,
+	h2,
+	h3,
+	h4,
+	h5,
+	h6 {
+		page-break-after: avoid;
+		page-break-inside: avoid
+	}
+
+	img {
+		page-break-inside: avoid;
+		page-break-after: avoid;
+	}
+
+	table, pre {
+		page-break-inside: avoid;
+	}
+
+	ul, ol, dl {
+		page-break-before: avoid;
+	}
+
+	/* Links */
+
+	a:link, a:visited, a {
+		background: transparent;
+		font-weight: bold;
+		text-decoration: underline;
+		text-align: left;
+	}
+
+	a {
+		page-break-inside: avoid;
+	}
+
+	a[href^=http]:after {
+		content: " < " attr(href) "> ";
+	}
+
+	a:after > img {
+		content: "";
+	}
+
+	article a[href^="#"]:after {
+		content: "";
+	}
+
+	a:not(:local-link):after {
+		content: " < " attr(href) "> ";
+	}
+
+	/* Visibility */
+	.main-navigation,
+	.site-title + .main-navigation,
+	.social-navigation,
+	.site-branding-container:before,
+	.entry .entry-title:before,
+	.entry-footer,
+	.author-description:before,
+	.post-navigation,
+	.widget-area,
+	.comment-form-flex,
+	.comment-reply,
+	.comment .comment-metadata .edit-link {
+		display: none;
+	}
+
+	.entry .entry-content .wp-block-button .wp-block-button__link,
+	.entry .entry-content .button {
+		color: #000;
+		background: none;
+	}
+
+	/* Site Header (With Featured Image) */
+	.site-header.featured-image {
+		min-height: 0;
+
+		.main-navigation a,
+		.main-navigation a + svg,
+		.social-navigation a,
+		.site-title a,
+		.site-featured-image a,
+		.site-branding .site-title,
+		.site-branding .site-description,
+		.main-navigation a:after,
+		.main-navigation .main-menu > li.menu-item-has-children:after,
+		.main-navigation li,
+		.social-navigation li,
+		.entry-meta,
+		.entry-title,
+		&#masthead .site-title a {
+			color: #000;
+			text-shadow: none;
+		}
+
+		.site-featured-image .entry-header,
+		.site-branding-container {
+			margin-top: 0;
+			margin-bottom: 0;
+		}
+
+		.site-featured-image .post-thumbnail img {
+			position: relative;
+			height: initial;
+			width: initial;
+			object-fit: none;
+			min-width: 0;
+			min-height: 0;
+			max-width: 100%;
+			margin-top: 1rem;
+		}
+	}
+
+	/* Remove image filters from featured image */
+	.image-filters-enabled {
+
+		*:after {
+			display: none !important;
+		}
+
+		.site-header.featured-image .site-featured-image:before {
+			display: none;
+		}
+
+		.site-header.featured-image .site-featured-image .post-thumbnail img {
+			filter: none;
+		}
+	}
+}

wp-content/themes/twentynineteen/sass/_normalize.scss

@@ -0,0 +1,341 @@
+/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */
+
+/* Document
+	 ========================================================================== */
+
+/**
+ * 1. Correct the line height in all browsers.
+ * 2. Prevent adjustments of font size after orientation changes in iOS.
+ */
+
+html {
+	line-height: 1.15; /* 1 */
+	-webkit-text-size-adjust: 100%; /* 2 */
+}
+
+/* Sections
+	 ========================================================================== */
+
+/**
+ * Remove the margin in all browsers.
+ */
+
+body {
+	margin: 0;
+}
+
+/**
+ * Correct the font size and margin on `h1` elements within `section` and
+ * `article` contexts in Chrome, Firefox, and Safari.
+ */
+
+h1 {
+	font-size: 2em;
+	margin: 0.67em 0;
+}
+
+/* Grouping content
+	 ========================================================================== */
+
+/**
+ * 1. Add the correct box sizing in Firefox.
+ * 2. Show the overflow in Edge and IE.
+ */
+
+hr {
+	box-sizing: content-box; /* 1 */
+	height: 0; /* 1 */
+	overflow: visible; /* 2 */
+}
+
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+
+pre {
+	font-family: monospace, monospace; /* 1 */
+	font-size: 1em; /* 2 */
+}
+
+/* Text-level semantics
+	 ========================================================================== */
+
+/**
+ * Remove the gray background on active links in IE 10.
+ */
+
+a {
+	background-color: transparent;
+}
+
+/**
+ * 1. Remove the bottom border in Chrome 57-
+ * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
+ */
+
+abbr[title] {
+	border-bottom: none; /* 1 */
+	text-decoration: underline; /* 2 */
+	text-decoration: underline dotted; /* 2 */
+}
+
+/**
+ * Add the correct font weight in Chrome, Edge, and Safari.
+ */
+
+b,
+strong {
+	font-weight: bolder;
+}
+
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+
+code,
+kbd,
+samp {
+	font-family: monospace, monospace; /* 1 */
+	font-size: 1em; /* 2 */
+}
+
+/**
+ * Add the correct font size in all browsers.
+ */
+
+small {
+	font-size: 80%;
+}
+
+/**
+ * Prevent `sub` and `sup` elements from affecting the line height in
+ * all browsers.
+ */
+
+sub,
+sup {
+	font-size: 75%;
+	line-height: 0;
+	position: relative;
+	vertical-align: baseline;
+}
+
+sub {
+	bottom: -0.25em;
+}
+
+sup {
+	top: -0.5em;
+}
+
+/* Embedded content
+	 ========================================================================== */
+
+/**
+ * Remove the border on images inside links in IE 10.
+ */
+
+img {
+	border-style: none;
+}
+
+/* Forms
+	 ========================================================================== */
+
+/**
+ * 1. Change the font styles in all browsers.
+ * 2. Remove the margin in Firefox and Safari.
+ */
+
+button,
+input,
+optgroup,
+select,
+textarea {
+	font-family: inherit; /* 1 */
+	font-size: 100%; /* 1 */
+	line-height: 1.15; /* 1 */
+	margin: 0; /* 2 */
+}
+
+/**
+ * Show the overflow in IE.
+ * 1. Show the overflow in Edge.
+ */
+
+button,
+input { /* 1 */
+	overflow: visible;
+}
+
+/**
+ * Remove the inheritance of text transform in Edge, Firefox, and IE.
+ * 1. Remove the inheritance of text transform in Firefox.
+ */
+
+button,
+select { /* 1 */
+	text-transform: none;
+}
+
+/**
+ * Correct the inability to style clickable types in iOS and Safari.
+ */
+
+button,
+[type="button"],
+[type="reset"],
+[type="submit"] {
+	-webkit-appearance: button;
+}
+
+/**
+ * Remove the inner border and padding in Firefox.
+ */
+
+button::-moz-focus-inner,
+[type="button"]::-moz-focus-inner,
+[type="reset"]::-moz-focus-inner,
+[type="submit"]::-moz-focus-inner {
+	border-style: none;
+	padding: 0;
+}
+
+/**
+ * Restore the focus styles unset by the previous rule.
+ */
+
+button:-moz-focusring,
+[type="button"]:-moz-focusring,
+[type="reset"]:-moz-focusring,
+[type="submit"]:-moz-focusring {
+	outline: 1px dotted ButtonText;
+}
+
+/**
+ * Correct the padding in Firefox.
+ */
+
+fieldset {
+	padding: 0.35em 0.75em 0.625em;
+}
+
+/**
+ * 1. Correct the text wrapping in Edge and IE.
+ * 2. Correct the color inheritance from `fieldset` elements in IE.
+ * 3. Remove the padding so developers are not caught out when they zero out
+ *		`fieldset` elements in all browsers.
+ */
+
+legend {
+	box-sizing: border-box; /* 1 */
+	color: inherit; /* 2 */
+	display: table; /* 1 */
+	max-width: 100%; /* 1 */
+	padding: 0; /* 3 */
+	white-space: normal; /* 1 */
+}
+
+/**
+ * Add the correct vertical alignment in Chrome, Firefox, and Opera.
+ */
+
+progress {
+	vertical-align: baseline;
+}
+
+/**
+ * Remove the default vertical scrollbar in IE 10+.
+ */
+
+textarea {
+	overflow: auto;
+}
+
+/**
+ * 1. Add the correct box sizing in IE 10.
+ * 2. Remove the padding in IE 10.
+ */
+
+[type="checkbox"],
+[type="radio"] {
+	box-sizing: border-box; /* 1 */
+	padding: 0; /* 2 */
+}
+
+/**
+ * Correct the cursor style of increment and decrement buttons in Chrome.
+ */
+
+[type="number"]::-webkit-inner-spin-button,
+[type="number"]::-webkit-outer-spin-button {
+	height: auto;
+}
+
+/**
+ * 1. Correct the odd appearance in Chrome and Safari.
+ * 2. Correct the outline style in Safari.
+ */
+
+[type="search"] {
+	-webkit-appearance: textfield; /* 1 */
+	outline-offset: -2px; /* 2 */
+}
+
+/**
+ * Remove the inner padding in Chrome and Safari on macOS.
+ */
+
+[type="search"]::-webkit-search-decoration {
+	-webkit-appearance: none;
+}
+
+/**
+ * 1. Correct the inability to style clickable types in iOS and Safari.
+ * 2. Change font properties to `inherit` in Safari.
+ */
+
+::-webkit-file-upload-button {
+	-webkit-appearance: button; /* 1 */
+	font: inherit; /* 2 */
+}
+
+/* Interactive
+	 ========================================================================== */
+
+/*
+ * Add the correct display in Edge, IE 10+, and Firefox.
+ */
+
+details {
+	display: block;
+}
+
+/*
+ * Add the correct display in all browsers.
+ */
+
+summary {
+	display: list-item;
+}
+
+/* Misc
+	 ========================================================================== */
+
+/**
+ * Add the correct display in IE 10+.
+ */
+
+template {
+	display: none;
+}
+
+/**
+ * Add the correct display in IE 10.
+ */
+
+[hidden] {
+	display: none;
+}

wp-content/themes/twentynineteen/sass/elements/_elements.scss

@@ -0,0 +1,92 @@
+html {
+	box-sizing: border-box;
+}
+
+::-moz-selection {
+	background-color: $color__background_selection;
+}
+
+::selection {
+	background-color: $color__background_selection;
+}
+
+*,
+*:before,
+*:after {
+	box-sizing: inherit;
+}
+
+body {
+	background-color: $color__background-body;
+}
+
+a {
+	@include link-transition;
+	color: $color__link;
+}
+
+a:visited {
+
+}
+
+a:hover,
+a:active {
+	color: $color__link-hover;
+	outline: 0;
+	text-decoration: none;
+}
+
+a:focus {
+	outline: thin;
+	outline-style: dotted;
+	text-decoration: underline;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+	clear: both;
+	margin: $size__spacing-unit 0;
+}
+
+h1:not(.site-title),
+h2 {
+	@include post-section-dash;
+}
+
+hr {
+	background-color: $color__text-light;
+	border: 0;
+	height: 2px;
+}
+
+@import "lists";
+
+img {
+	height: auto;
+	max-width: 100%;
+	position: relative;
+}
+
+figure {
+	margin: 0;
+}
+
+blockquote {
+	border-left: 2px solid $color__link;
+	margin-left: 0;
+	padding: 0 0 0 $size__spacing-unit;
+
+	> p {
+		margin: 0 0 $size__spacing-unit;
+	}
+
+	cite {
+		color: $color__text-light;
+	}
+}
+
+@import "tables";

wp-content/themes/twentynineteen/sass/elements/_lists.scss

@@ -0,0 +1,33 @@
+ul,
+ol {
+	padding-left: ( 1 * $size__spacing-unit );
+}
+
+ul {
+	list-style: disc;
+
+	ul {
+		list-style-type: circle;
+	}
+}
+
+ol {
+	list-style: decimal;
+}
+
+li {
+	line-height: $font__line-height-body;
+}
+
+li > ul,
+li > ol {
+	padding-left: ( 2 * $size__spacing-unit );
+}
+
+dt {
+	font-weight: bold;
+}
+
+dd {
+	margin: 0 $size__spacing-unit $size__spacing-unit;
+}

wp-content/themes/twentynineteen/sass/elements/_tables.scss

@@ -0,0 +1,13 @@
+table {
+	margin: 0 0 $size__spacing-unit;
+	border-collapse: collapse;
+	width: 100%;
+	@include font-family( $font__heading );
+
+	td,
+	th {
+		padding: 0.5em;
+		border: 1px solid $color__text-light;
+		word-break: break-all;
+	}
+}

wp-content/themes/twentynineteen/sass/forms/_buttons.scss

@@ -0,0 +1,37 @@
+.button,
+button,
+input[type="button"],
+input[type="reset"],
+input[type="submit"] {
+
+	@include button-transition;
+	background: $color__background-button;
+	border: none;
+	border-radius: 5px;
+	box-sizing: border-box;
+	color: $color__background-body;
+	@include font-family( $font__heading );
+	font-size: $font__size-sm;
+	font-weight: 700;
+	line-height: $font__line-height-heading;
+	outline: none;
+	padding: ( $size__spacing-unit * .76 ) $size__spacing-unit;
+	text-decoration: none;
+	vertical-align: bottom;
+
+	&:hover {
+		background: $color__background-button-hover;
+		cursor: pointer;
+	}
+
+	&:visited {
+		color: $color__background-body;
+		text-decoration: none;
+	}
+
+	&:focus {
+		background: $color__background-button-hover;
+		outline: thin dotted;
+		outline-offset: -4px;
+	}
+}

wp-content/themes/twentynineteen/sass/forms/_fields.scss

@@ -0,0 +1,58 @@
+input[type="text"],
+input[type="email"],
+input[type="url"],
+input[type="password"],
+input[type="search"],
+input[type="number"],
+input[type="tel"],
+input[type="range"],
+input[type="date"],
+input[type="month"],
+input[type="week"],
+input[type="time"],
+input[type="datetime"],
+input[type="datetime-local"],
+input[type="color"],
+textarea {
+	-webkit-backface-visibility: hidden;
+	background: $color__background-input;
+	border: solid 1px $color__border;
+	box-sizing: border-box;
+	outline: none;
+	padding: #{.36 * $size__spacing-unit} #{.66 * $size__spacing-unit};
+	-webkit-appearance: none;
+	outline-offset: 0;
+	border-radius: 0;
+
+	&:focus {
+		border-color: $color__link;
+		outline: thin solid rgba( $color__link, 0.15 );
+		outline-offset: -4px;
+	}
+}
+
+input[type="search"] {
+	&::-webkit-search-decoration {
+		display: none;
+	}
+}
+
+select {
+
+}
+
+textarea {
+	box-sizing: border-box;
+	display: block;
+	width: 100%;
+	max-width: 100%;
+	resize: vertical;
+}
+
+form {
+
+	p {
+		margin: $size__spacing-unit 0;
+	}
+
+}

wp-content/themes/twentynineteen/sass/forms/_forms.scss

@@ -0,0 +1,3 @@
+@import "buttons";
+
+@import "fields";

wp-content/themes/twentynineteen/sass/layout/_layout.scss

@@ -0,0 +1,11 @@
+
+/** === Layout === */
+
+#page {
+	width: 100%;
+}
+
+.site-content {
+	overflow: hidden;
+}
+

wp-content/themes/twentynineteen/sass/media/_captions.scss

@@ -0,0 +1,32 @@
+.wp-caption {
+	margin-bottom: calc(1.5 * #{$size__spacing-unit});
+
+	&.aligncenter {
+
+		@include media(tablet) {
+			position: relative;
+			left: calc( #{$size__site-tablet-content} / 2 );
+			transform: translateX( -50% );
+		}
+
+		@include media(desktop) {
+			left: calc( #{$size__site-desktop-content} / 2 );
+		}
+	}
+}
+
+.wp-caption img[class*="wp-image-"] {
+	display: block;
+	margin-left: auto;
+	margin-right: auto;
+}
+
+.wp-caption-text {
+	color: $color__text-light;
+	font-size: $font__size-xs;
+	@include font-family( $font__heading );
+ 	line-height: $font__line-height-pre;
+ 	margin: 0;
+ 	padding: ( $size__spacing-unit * .5 );
+	text-align: center;
+}

wp-content/themes/twentynineteen/sass/media/_galleries.scss

@@ -0,0 +1,52 @@
+.gallery {
+	display: flex;
+	flex-flow: row wrap;
+	justify-content: center;
+	margin-bottom: calc(1.5 * #{$size__spacing-unit});
+}
+
+.gallery-item {
+	display: inline-block;
+	margin-right: 16px;
+	margin-bottom: 16px;
+	text-align: center;
+	vertical-align: top;
+	width: 100%;
+
+	// Loops to enumerate the classes for gallery columns.
+	@for $i from 2 through 9 {
+		.gallery-columns-#{$i} & {
+			max-width: calc((100% - 16px * #{ $i - 1 }) / #{ $i });
+
+			&:nth-of-type(#{$i}n+#{$i}) {
+				margin-right: 0;
+			}
+		}
+	}
+
+	&:last-of-type {
+		padding-right: 0;
+	}
+}
+
+.gallery-caption {
+	display: block;
+	font-size: $font__size-xs;
+	@include font-family( $font__heading );
+	line-height: $font__line-height-pre;
+	margin: 0;
+	padding: ( $size__spacing-unit * .5 );
+}
+
+.gallery-item > div > a {
+	display: block;
+	line-height: 0;
+
+	// Accessibility
+	box-shadow: 0 0 0 0 transparent;
+
+	&:focus {
+		box-shadow: 0 0 0 2px rgba( $color__link, 1 );
+	}
+}
+

wp-content/themes/twentynineteen/sass/media/_media.scss

@@ -0,0 +1,41 @@
+.page-content .wp-smiley,
+.entry-content .wp-smiley,
+.comment-content .wp-smiley {
+	border: none;
+	margin-bottom: 0;
+	margin-top: 0;
+	padding: 0;
+}
+
+embed,
+iframe,
+object {
+	max-width: 100%;
+}
+
+.custom-logo-link {
+	display: inline-block;
+}
+
+.avatar {
+	border-radius: 100%;
+	display: block;
+	height: calc(2.25 * #{$size__spacing-unit});
+	min-height: inherit;
+	width: calc(2.25 * #{$size__spacing-unit});
+}
+
+svg {
+	transition: fill $icon_transition ease-in-out;
+	fill: currentColor;
+}
+
+/*--------------------------------------------------------------
+## Captions
+--------------------------------------------------------------*/
+@import "captions";
+
+/*--------------------------------------------------------------
+## Galleries
+--------------------------------------------------------------*/
+@import "galleries";

wp-content/themes/twentynineteen/sass/mixins/_mixins-master.scss

@@ -0,0 +1,132 @@
+// Rem output with px fallback
+@mixin font-size($sizeValue: 1) {
+	font-size: ($sizeValue * 16) * 1px;
+	font-size: $sizeValue * 1rem;
+}
+
+// Center block
+@mixin center-block {
+	display: block;
+	margin-left: auto;
+	margin-right: auto;
+}
+
+// Clearfix
+@mixin clearfix() {
+	content: "";
+	display: table;
+	table-layout: fixed;
+}
+
+// Clear after (not all clearfix need this also)
+@mixin clearfix-after() {
+	clear: both;
+}
+
+// Column width with margin
+@mixin column-width($numberColumns: 3) {
+	width: map-get($columns, $numberColumns) - (($columns__margin * ($numberColumns - 1)) / $numberColumns);
+}
+
+@mixin filter-duotone {
+
+	&:before {
+		background: $color__link;
+		mix-blend-mode: screen;
+		opacity: 0.1;
+		z-index: 2;
+	}
+
+	&:after {
+		background: $color__link;
+		mix-blend-mode: multiply;
+		opacity: .8;
+		z-index: 3;
+
+		/* Browsers supporting mix-blend-mode don't need opacity < 1 */
+		@supports (mix-blend-mode: multiply) {
+			opacity: 1;
+		}
+	}
+}
+
+@mixin filter-grayscale {
+
+	position: relative;
+	filter: grayscale(100%);
+	z-index: 1;
+
+	&:after {
+		display: block;
+		width: 100%;
+		height: 100%;
+		z-index: 10;
+	}
+}
+
+@mixin post-section-dash {
+
+	&:before {
+		background: $color__text-light;
+		content: "\020";
+		display: block;
+		height: 2px;
+		margin: $size__spacing-unit 0;
+		width: 1em;
+	}
+}
+
+/* If we add the border using a regular CSS border, it won't look good on non-retina devices,
+ * since its edges can look jagged due to lack of antialiasing. In this case, we are several
+ * layers of box-shadow to add the border visually, which will render the border smoother. */
+
+@mixin box-shadow( $size ) {
+	box-shadow:
+		0 0 0 $size $color__text-light inset,           // Original border.
+		0 0 0 ($size + 1px) $color__text-light inset,   // Antialiasing, inner edge.
+		0 0 1px 0 rgba( $color__text-light, 0.7 );      // Antialiasing, outer edge.
+}
+
+/* Calculates maximum width for post content */
+@mixin postContentMaxWidth() {
+
+	@include media(tablet) {
+		max-width: $size__site-tablet-content;
+	}
+
+	@include media(desktop) {
+		max-width: $size__site-desktop-content;
+	}
+}
+
+/* Nested sub-menu padding: 10 levels deep */
+@mixin nestedSubMenuPadding() {
+
+	ul {
+		counter-reset: submenu;
+	}
+
+	ul > li > a::before {
+		font-family: $font__body;
+		font-weight: normal;
+		content: "\2013\00a0" counters(submenu, "\2013\00a0", none);
+		counter-increment: submenu
+	}
+}
+
+/* Ensure all font family declarations come with non-latin fallbacks */
+@mixin font-family( $font_family: $font__body ) {
+	font-family: $font_family;
+	@extend %non-latin-fonts;
+}
+
+/* Build our non-latin font styles */
+%non-latin-fonts {
+	@each $lang, $font__fallback in $font__fallbacks {
+		&:lang(#{$lang}) {
+			font-family: unquote( $font__fallback );
+		}
+	}
+}
+
+@import "utilities";

wp-content/themes/twentynineteen/sass/mixins/_utilities.scss

@@ -0,0 +1,51 @@
+
+@mixin media( $res ) {
+	@if mobile == $res {
+		@media only screen and (min-width: $mobile_width) {
+			@content;
+		}
+	}
+
+	@if tablet == $res {
+		@media only screen and (min-width: $tablet_width) {
+			@content;
+		}
+	}
+
+	@if desktop == $res {
+		@media only screen and (min-width: $desktop_width) {
+			@content;
+		}
+	}
+
+	@if wide == $res {
+		@media only screen and (min-width: $wide_width) {
+			@content;
+		}
+	}
+}
+
+@mixin link-transition( $attr: color ) {
+	transition: $attr $link_transition ease-in-out;
+}
+
+@mixin button-transition() {
+	transition: background $button_transition ease-in-out;
+}
+
+@mixin button-all-transition() {
+	transition: all $button_transition ease-in-out;
+}
+
+@mixin background-transition() {
+	transition: background $background_transition ease-in-out;
+}
+
+@mixin selection {
+	::-moz-selection {
+		@content;
+	}
+	::selection {
+		@content;
+	}
+}

wp-content/themes/twentynineteen/sass/modules/_accessibility.scss

@@ -0,0 +1,38 @@
+/* Text meant only for screen readers. */
+.screen-reader-text {
+	border: 0;
+	clip: rect(1px, 1px, 1px, 1px);
+	clip-path: inset(50%);
+	height: 1px;
+	margin: -1px;
+	overflow: hidden;
+	padding: 0;
+	position: absolute !important;
+	width: 1px;
+	word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */
+
+	&:focus {
+		background-color: $color__background-screen;
+		border-radius: 3px;
+		box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
+		clip: auto !important;
+		clip-path: none;
+		color: $color__text-screen;
+		display: block;
+		@include font-size(0.875);
+		font-weight: bold;
+		height: auto;
+		left: 5px;
+		line-height: normal;
+		padding: 15px 23px 14px;
+		text-decoration: none;
+		top: 5px;
+		width: auto;
+		z-index: 100000; /* Above WP toolbar. */
+	}
+}
+
+/* Do not show the outline on the skip link target. */
+#content[tabindex="-1"]:focus {
+	outline: 0;
+}

wp-content/themes/twentynineteen/sass/modules/_alignments.scss

@@ -0,0 +1,28 @@
+.alignleft {
+	/*rtl:ignore*/
+	float: left;
+	/*rtl:ignore*/
+	margin-right: $size__spacing-unit;
+
+	@include media(tablet) {
+		/*rtl:ignore*/
+		margin-right: calc(2 * #{$size__spacing-unit});
+	}
+}
+
+.alignright {
+	/*rtl:ignore*/
+	float: right;
+	/*rtl:ignore*/
+	margin-left: $size__spacing-unit;
+
+	@include media(tablet) {
+		/*rtl:ignore*/
+		margin-left: calc(2 * #{$size__spacing-unit});
+	}
+}
+
+.aligncenter {
+	clear: both;
+	@include center-block;
+}

wp-content/themes/twentynineteen/sass/modules/_clearings.scss

@@ -0,0 +1,23 @@
+.clear:before,
+.clear:after,
+.entry-content:before,
+.entry-content:after,
+.comment-content:before,
+.comment-content:after,
+.site-header:before,
+.site-header:after,
+.site-content:before,
+.site-content:after,
+.site-footer:before,
+.site-footer:after {
+	@include clearfix;
+}
+
+.clear:after,
+.entry-content:after,
+.comment-content:after,
+.site-header:after,
+.site-content:after,
+.site-footer:after {
+	@include clearfix-after;
+}

wp-content/themes/twentynineteen/sass/navigation/_links.scss

@@ -0,0 +1,21 @@
+a {
+
+	@include link-transition;
+	color: $color__link;
+
+	&:visited {
+		color: $color__link-visited;
+	}
+
+	&:hover,
+	&:active {
+		color: $color__link-hover;
+		outline: 0;
+		text-decoration: none;
+	}
+
+	&:focus {
+		outline: thin dotted;
+		text-decoration: underline;
+	}
+}

wp-content/themes/twentynineteen/sass/navigation/_menu-footer-navigation.scss

@@ -0,0 +1,22 @@
+/** === Footer menu === */
+
+.footer-navigation {
+
+	display: inline;
+
+	& > div {
+		display: inline;
+	}
+
+	.footer-menu {
+
+		display: inline;
+		padding-left: 0;
+
+		li {
+			display: inline;
+			margin-right: 1rem;
+		}
+	}
+
+}

wp-content/themes/twentynineteen/sass/navigation/_menu-main-navigation.scss

@@ -0,0 +1,506 @@
+/** === Main menu === */
+
+.main-navigation {
+
+	display: block;
+	margin-top: #{0.25 * $size__spacing-unit};
+
+	body.page & {
+		display: block;
+	}
+
+	> div {
+		display: inline;
+	}
+
+	/* Un-style buttons */
+	button {
+		display: inline-block;
+		border: none;
+		padding: 0;
+		margin: 0;
+		font-family: $font__heading;
+		font-weight: 700;
+		line-height: $font__line-height-heading;
+		text-decoration: none;
+		background: transparent;
+		color: inherit;
+		cursor: pointer;
+		transition:
+			background 250ms ease-in-out,
+			transform 150ms ease;
+		-webkit-appearance: none;
+		-moz-appearance: none;
+
+		&:hover,
+		&:focus {
+			background: transparent;
+		}
+
+		&:focus {
+			outline: 1px solid transparent;
+			outline-offset: -4px;
+		}
+
+		&:active {
+			transform: scale(0.99);
+		}
+	}
+
+	.main-menu {
+
+		display: inline-block;
+		margin: 0;
+		padding: 0;
+
+		> li {
+
+			color: $color__link;
+			display: inline;
+			position: relative;
+
+			> a {
+
+				font-weight: 700;
+				color: $color__link;
+				margin-right: #{0.5 * $size__spacing-unit};
+
+				+ svg {
+					margin-right: #{0.5 * $size__spacing-unit};
+				}
+
+				&:hover,
+				&:hover + svg {
+					color: $color__link-hover;
+				}
+			}
+
+			&.menu-item-has-children {
+
+				display: inline-block;
+				position: inherit;
+
+				@include media(tablet) {
+					position: relative;
+				}
+
+				> a {
+					margin-right: #{0.125 * $size__spacing-unit};
+				}
+
+				& > a,
+				.menu-item-has-children > a {
+
+					&:after {
+						content: "";
+						display: none;
+					}
+				}
+
+				.submenu-expand {
+
+					display: inline-block;
+					margin-right: #{0.25 * $size__spacing-unit};
+
+					/* Priority+ Menu */
+					&.main-menu-more-toggle {
+
+						position: relative;
+						height: 24px;
+						line-height: $font__line-height-heading;
+						width: 24px;
+						padding: 0;
+						margin-left: #{0.5 * $size__spacing-unit};
+
+						svg {
+							height: 24px;
+							width: 24px;
+							top: #{-0.125 * $size__spacing-unit};
+							vertical-align: text-bottom;
+						}
+					}
+
+					.wp-customizer-unloading &,
+					&.is-empty {
+						display: none;
+					}
+
+					svg {
+						position: relative;
+						top: 0.2rem;
+					}
+				}
+			}
+
+			&:last-child > a,
+			&:last-child.menu-item-has-children .submenu-expand {
+				margin-right: 0;
+			}
+		}
+	}
+
+	.sub-menu {
+
+		background-color: $color__link;
+		color: $color__background-body;
+		list-style: none;
+		padding-left: 0;
+
+		position: absolute;
+		opacity: 0;
+		left: -9999px;
+		z-index: 99999;
+
+		@include media(tablet) {
+			width: auto;
+			min-width: -moz-max-content;
+			min-width: -webkit-max-content;
+			min-width: max-content;
+		}
+
+		> li {
+
+			display: block;
+			float: none;
+			position: relative;
+
+			&.menu-item-has-children {
+
+				.submenu-expand {
+					display: inline-block;
+					position: absolute;
+					width: calc( 24px + #{$size__spacing-unit} );
+					right: 0;
+					top: calc( .125 * #{$size__spacing-unit} );
+					bottom: 0;
+					color: white;
+					line-height: 1;
+					padding: calc( .5 * #{$size__spacing-unit} );
+
+					svg {
+						top: 0;
+					}
+				}
+
+				.submenu-expand {
+					margin-right: 0;
+				}
+
+				@include media(tablet) {
+
+					.menu-item-has-children > a {
+
+						&:after {
+							content: "\203a";
+						}
+					}
+				}
+			}
+
+			> a,
+			> .menu-item-link-return {
+
+				color: $color__background-body;
+				display: block;
+				line-height: $font__line-height-heading;
+				text-shadow: none;
+				padding: calc( .5 * #{$size__spacing-unit} ) calc( 24px + #{$size__spacing-unit} ) calc( .5 * #{$size__spacing-unit} ) $size__spacing-unit;
+				white-space: nowrap;
+
+				&:hover,
+				&:focus {
+					background: $color__link-hover;
+
+					&:after {
+						background: $color__link-hover;
+					}
+				}
+			}
+
+			> .menu-item-link-return {
+				width: 100%;
+				font-size: $font__size_base;
+				font-weight: normal;
+				text-align: left;
+			}
+
+			> a:empty {
+				display: none;
+			}
+
+			&.mobile-parent-nav-menu-item {
+
+				display: none;
+				font-size: $font__size-sm;
+				font-weight: normal;
+
+				svg {
+					position: relative;
+					top: 0.2rem;
+					margin-right: calc( .25 * #{$size__spacing-unit} );
+				}
+			}
+		}
+	}
+
+	/*
+	 * Sub-menu styles
+	 *
+	 * :focus-within needs its own selector so other similar
+	 * selectors don’t get ignored if a browser doesn’t recognize it
+	 */
+	.main-menu .menu-item-has-children:not(.off-canvas):focus-within > .sub-menu {
+
+		display: block;
+		left: 0;
+		margin-top: 0;
+		opacity: 1;
+		width: auto;
+		min-width: 100%;
+
+
+		/* Non-mobile position */
+		@include media(tablet) {
+			display: block;
+			margin-top: 0;
+			opacity: 1;
+			position: absolute;
+			left: 0;
+			right: auto;
+			top: auto;
+			bottom: auto;
+			height: auto;
+			min-width: -moz-max-content;
+			min-width: -webkit-max-content;
+			min-width: max-content;
+			transform: none;
+		}
+
+		&.hidden-links {
+			left: 0;
+			width: 100%;
+			display: table;
+			position: absolute;
+
+			@include media(tablet) {
+				right: 0;
+				left: auto;
+				display: block;
+				width: max-content;
+			}
+		}
+
+		.submenu-expand {
+			display: none;
+		}
+
+		.sub-menu {
+			display: block;
+			margin-top: inherit;
+			position: relative;
+			width: 100%;
+			left: 0;
+			opacity: 1;
+
+			/* Non-mobile position */
+			@include media(tablet) {
+				float: none;
+				max-width: 100%;
+			}
+		}
+
+		/* Nested sub-menu dashes */
+		.sub-menu {
+			counter-reset: submenu;
+		}
+
+		.sub-menu > li > a::before {
+			font-family: $font__body;
+			font-weight: normal;
+			content: "\2013\00a0" counters(submenu, "\2013\00a0", none);
+			counter-increment: submenu
+		}
+	}
+
+	.main-menu .menu-item-has-children:not(.off-canvas):hover > .sub-menu,
+	.main-menu .menu-item-has-children:not(.off-canvas):focus > .sub-menu,
+	.main-menu .menu-item-has-children.is-focused:not(.off-canvas) > .sub-menu {
+
+		display: block;
+		left: 0;
+		margin-top: 0;
+		opacity: 1;
+		width: auto;
+		min-width: 100%;
+
+
+		/* Non-mobile position */
+		@include media(tablet) {
+			display: block;
+			float: none;
+			margin-top: 0;
+			opacity: 1;
+			position: absolute;
+			left: 0;
+			right: auto;
+			top: auto;
+			bottom: auto;
+			height: auto;
+			min-width: -moz-max-content;
+			min-width: -webkit-max-content;
+			min-width: max-content;
+			transform: none;
+		}
+
+		&.hidden-links {
+			left: 0;
+			width: 100%;
+			display: table;
+			position: absolute;
+
+			@include media(tablet) {
+				right: 0;
+				left: auto;
+				display: table;
+				width: max-content;
+			}
+		}
+
+		.submenu-expand {
+			display: none;
+		}
+
+		.sub-menu {
+			display: block;
+			margin-top: inherit;
+			position: relative;
+			width: 100%;
+			left: 0;
+			opacity: 1;
+
+			/* Non-mobile position */
+			@include media(tablet) {
+				float: none;
+				max-width: 100%;
+			}
+		}
+
+		/* Nested sub-menu dashes */
+		.sub-menu {
+			counter-reset: submenu;
+		}
+
+		.sub-menu > li > a::before {
+			font-family: $font__body;
+			font-weight: normal;
+			content: "\2013\00a0" counters(submenu, "\2013\00a0", none);
+			counter-increment: submenu
+		}
+	}
+
+	/**
+	 * Fade-in animation for top-level submenus
+	 */
+	.main-menu > .menu-item-has-children:not(.off-canvas):hover > .sub-menu {
+		animation: fade_in 0.1s forwards;
+	}
+
+	/**
+	 * Off-canvas touch device styles
+	 */
+	.main-menu .menu-item-has-children.off-canvas .sub-menu {
+
+		.submenu-expand .svg-icon {
+			transform: rotate(270deg);
+		}
+
+		.sub-menu {
+			opacity: 0;
+			position: absolute;
+			z-index: 0;
+			transform: translateX(-100%);
+		}
+
+		li:hover,
+		li:focus,
+		li > a:hover,
+		li > a:focus {
+			background-color: transparent;
+		}
+
+		> li > a,
+		> li > .menu-item-link-return {
+			white-space: inherit;
+		}
+
+		&.expanded-true {
+
+			display: table;
+			margin-top: 0;
+			opacity: 1;
+			padding-left: 0;
+
+			/* Mobile position */
+			left: 0;
+			top: 0;
+			right: 0;
+			bottom: 0;
+			position: fixed;
+			z-index: 100000; /* Make sure appears above mobile admin bar */
+			width: 100vw;
+			height: 100vh;
+			max-width: 100vw;
+			transform: translateX(+100%);
+			animation: slide_in_right 0.3s forwards;
+
+			> .mobile-parent-nav-menu-item {
+				display: block;
+			}
+
+			/* Prevent menu from being blocked by admin bar */
+			.admin-bar & {
+				top: 46px;
+				height: calc( 100vh - 46px );
+
+				.sub-menu.expanded-true {
+					top: 0;
+				}
+
+				/* WP core breakpoint */
+				@media only screen and ( min-width: 782px ) {
+					top: 32px;
+					height: calc( 100vh - 32px );
+
+					.sub-menu.expanded-true {
+						top: 0;
+					}
+				}
+			}
+		}
+	}
+
+	// Hide duplicate menu-more-link when re-loading a menu in the customizer
+	.main-menu-more {
+		&:nth-child(n+3) {
+			display: none;
+		}
+	}
+
+}
+
+/* Menu animation */
+
+@keyframes slide_in_right {
+	100% {
+		transform: translateX(0%);
+	}
+}
+
+@keyframes fade_in {
+	from {
+		opacity: 0;
+	}
+	to {
+		opacity: 1;
+	}
+}

wp-content/themes/twentynineteen/sass/navigation/_menu-social-navigation.scss

@@ -0,0 +1,66 @@
+/* Social menu */
+
+.social-navigation {
+	margin-top: calc(#{$size__spacing-unit} / 2 );
+	text-align: left;
+
+	ul.social-links-menu {
+		@include clearfix;
+
+		display: inline-block;
+		margin: 0;
+		padding: 0;
+
+		li {
+			display: inline-block;
+			vertical-align: bottom;
+			vertical-align: -webkit-baseline-middle;
+			list-style: none;
+
+			&:nth-child(n+2) {
+				margin-left: 0.1em;
+			}
+
+			a {
+				border-bottom: 1px solid transparent;
+				display: block;
+				color: $color__text-main;
+				margin-bottom: -1px;
+				transition: opacity $link_transition ease-in-out;
+
+				&:hover,
+				&:active {
+					color: $color__text-main;
+					opacity: 0.6;
+				}
+
+				&:focus {
+					color: $color__text-main;
+					opacity: 1;
+					border-bottom: 1px solid $color__text-main;
+				}
+
+				svg {
+					display: block;
+					width: 32px;
+					height: 32px;
+
+					// Prevent icons from jumping in Safari using hardware acceleration.
+					transform: translateZ(0);
+
+					&#ui-icon-link {
+						transform: rotate(-45deg);
+					}
+				}
+			}
+		}
+	}
+}
+
+.site-title + .social-navigation,
+.site-description + .social-navigation {
+
+	@include media(tablet) {
+		margin-top: calc(#{$size__spacing-unit} / 5 );
+	}
+}

wp-content/themes/twentynineteen/sass/navigation/_navigation.scss

@@ -0,0 +1,16 @@
+/*--------------------------------------------------------------
+## Links
+--------------------------------------------------------------*/
+@import "links";
+
+/*--------------------------------------------------------------
+## Menus
+--------------------------------------------------------------*/
+@import "menu-main-navigation";
+@import "menu-social-navigation";
+@import "menu-footer-navigation";
+
+/*--------------------------------------------------------------
+## Next / Previous
+--------------------------------------------------------------*/
+@import "next-previous";

wp-content/themes/twentynineteen/sass/navigation/_next-previous.scss

@@ -0,0 +1,201 @@
+/* Next/Previous navigation */
+
+// Singular navigation
+.post-navigation {
+
+	margin: calc(3 * 1rem) 0;
+
+	@include media(tablet) {
+		margin: calc(3 * 1rem) $size__site-margins;
+		max-width: calc(6 * (100vw / 12));
+	}
+
+	@include media(desktop) {
+		margin: calc(3 * 1rem) 0;
+		max-width: 100%;
+	}
+
+	.nav-links {
+
+		margin: 0 $size__spacing-unit;
+		max-width: 100%;
+		display: flex;
+		flex-direction: column;
+
+		@include media(tablet) {
+			margin: 0;
+		}
+
+		@include media(desktop) {
+			flex-direction: row;
+			margin: 0 $size__site-margins;
+			max-width: $size__site-desktop-content;
+		}
+
+		a {
+			.meta-nav {
+				color: $color__text-light;
+				user-select: none;
+
+				&:before,
+				&:after {
+					display: none;
+					content: "—";
+					width: 2em;
+					color: $color__text-light;
+					height: 1em;
+				}
+			}
+
+			.post-title {
+				hyphens: auto;
+			}
+
+			&:hover {
+				color: $color__link-hover;
+			}
+		}
+
+		.nav-previous,
+		.nav-next {
+
+			@include media(desktop) {
+				min-width: calc(50% - 2 * #{$size__spacing-unit});
+			}
+		}
+
+		.nav-previous {
+			order: 2;
+
+			@include media(desktop) {
+				order: 1;
+			}
+
+			+ .nav-next {
+				margin-bottom: $size__spacing-unit;
+			}
+
+			.meta-nav {
+				&:before {
+					display: inline;
+				}
+			}
+		}
+
+		.nav-next {
+			order: 1;
+
+			@include media(desktop) {
+				order: 2;
+				padding-left: $size__spacing-unit;
+			}
+
+			.meta-nav {
+				&:after {
+					display: inline;
+				}
+			}
+		}
+	}
+}
+
+// Index/archive navigation
+.pagination {
+
+	.nav-links {
+
+		display: flex;
+		flex-wrap: wrap;
+		padding: 0 calc(.5 * #{$size__spacing-unit});
+
+
+		& > * {
+			padding: calc(.5 * #{$size__spacing-unit});
+
+			&.dots,
+			&.prev {
+				padding-left: 0;
+			}
+
+			&.dots,
+			&.next {
+				padding-right: 0;
+			}
+		}
+
+		a:focus {
+			text-decoration: underline;
+			outline-offset: -1px;
+
+			&.prev,
+			&.next {
+				text-decoration: none;
+
+				.nav-prev-text,
+				.nav-next-text {
+					text-decoration: underline;
+				}
+			}
+		}
+
+		.nav-next-text,
+		.nav-prev-text {
+			display: none;
+		}
+
+		@include media(tablet) {
+
+			margin-left: $size__site-margins;
+			padding: 0;
+
+			.prev,
+			.next {
+
+				& > * {
+					display: inline-block;
+					vertical-align: text-bottom;
+				}
+			}
+
+			& > * {
+				padding: $size__spacing-unit;
+			}
+		}
+	}
+}
+
+// Comments navigation
+.comment-navigation {
+
+	.nav-links {
+		display: flex;
+		flex-direction: row;
+	}
+
+	.nav-previous,
+	.nav-next {
+		min-width: 50%;
+		width: 100%;
+		@include font-family( $font__heading );
+		font-weight: bold;
+
+		.secondary-text {
+			display: none;
+
+			@include media(tablet) {
+				display: inline;
+			}
+		}
+
+		svg {
+			vertical-align: middle;
+			position: relative;
+			margin: 0 -0.35em;
+			top: -1px;
+		}
+	}
+
+	.nav-next {
+		text-align: right;
+	}
+}

wp-content/themes/twentynineteen/sass/site/_site.scss

@@ -0,0 +1,27 @@
+
+/*--------------------------------------------------------------
+## Header
+--------------------------------------------------------------*/
+@import "header/site-header";
+@import "header/site-featured-image";
+
+/*--------------------------------------------------------------
+## Posts and pages
+--------------------------------------------------------------*/
+@import "primary/posts-and-pages";
+
+/*--------------------------------------------------------------
+## Comments
+--------------------------------------------------------------*/
+@import "primary/comments";
+
+/*--------------------------------------------------------------
+## Archives
+--------------------------------------------------------------*/
+@import "primary/archives";
+
+/*--------------------------------------------------------------
+## Footer
+--------------------------------------------------------------*/
+@import "footer/site-footer";
+

wp-content/themes/twentynineteen/sass/site/footer/_site-footer.scss

@@ -0,0 +1,53 @@
+/* Site footer */
+
+#colophon {
+
+	.widget-area,
+	.site-info {
+		margin: calc(2 * #{$size__spacing-unit}) $size__spacing-unit;
+
+		@include media(tablet) {
+			margin: calc(3 * #{$size__spacing-unit}) $size__site-margins;
+		}
+	}
+
+	.widget-column {
+		display: flex;
+		flex-wrap: wrap;
+		.widget {
+			-webkit-hyphens: auto;
+			-moz-hyphens: auto;
+			-ms-hyphens: auto;
+			hyphens: auto;
+			width: 100%;
+			word-wrap: break-word;
+			@include media(desktop) {
+				margin-right: calc(3 * #{$size__spacing-unit});
+				width: calc(50% - (3 * #{$size__spacing-unit}));
+			}
+		}
+	}
+
+	.site-info {
+		color: $color__text-light;
+		-webkit-hyphens: auto;
+		-moz-hyphens: auto;
+		-ms-hyphens: auto;
+		hyphens: auto;
+		word-wrap: break-word;
+
+		a {
+			color: inherit;
+
+			&:hover {
+				text-decoration: none;
+				color: $color__link;
+			}
+		}
+
+		.imprint,
+		.privacy-policy-link {
+			margin-right: $size__spacing-unit;
+		}
+	}
+}

wp-content/themes/twentynineteen/sass/site/header/_site-featured-image.scss

@@ -0,0 +1,301 @@
+// Featured image styles
+
+.site-header.featured-image {
+
+	/* Hide overflow for overflowing featured image */
+	overflow: hidden;
+
+	/* Need relative positioning to properly align layers. */
+	position: relative;
+
+	/* Add text shadow to text, to increase readability. */
+	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
+
+	/* Set white text color when featured image is set. */
+	.site-branding .site-title,
+	.site-branding .site-description,
+	.main-navigation a:after,
+	.main-navigation .main-menu > li.menu-item-has-children:after,
+	.main-navigation li,
+	.social-navigation li,
+	.entry-meta,
+	.entry-title {
+		color: $color__background-body;
+	}
+
+	.main-navigation a,
+	.main-navigation a + svg,
+	.social-navigation a,
+	.site-title a,
+	.site-featured-image a {
+		color: $color__background-body;
+		transition: opacity $link_transition ease-in-out;
+
+		&:hover,
+		&:active,
+		&:hover + svg,
+		&:active + svg {
+			color: $color__background-body;
+			opacity: 0.6;
+		}
+
+		&:focus,
+		&:focus + svg {
+			color: $color__background-body;
+		}
+	}
+
+	.main-navigation .sub-menu a {
+		opacity: inherit;
+	}
+
+	/* add focus state to social media icons */
+	.social-navigation a {
+		&:focus {
+			color: $color__background-body;
+			opacity: 1;
+			border-bottom: 1px solid $color__background-body;
+		}
+	}
+
+	.social-navigation svg,
+	.site-featured-image svg {
+		/* Use -webkit- only if supporting: Chrome < 54, iOS < 9.3, Android < 4.4.4 */
+		-webkit-filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.35) );
+				filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.35) );
+	}
+
+	/* Entry header */
+	.site-featured-image {
+
+		/* First layer: grayscale. */
+		.post-thumbnail img {
+			height: auto;
+			left: 50%;
+			max-width: 1000%;
+			min-height: 100%;
+			min-width: 100vw;
+			position: absolute;
+			top: 50%;
+			transform: translateX(-50%) translateY(-50%);
+			width: auto;
+			z-index: 1;
+
+			@supports ( object-fit: cover ) {
+				height: 100%;
+				left: 0;
+				object-fit: cover;
+				top: 0;
+				transform: none;
+				width: 100%;
+			}
+
+			/* When image filters are active, make it grayscale to colorize it blue. */
+			.image-filters-enabled & {
+				filter: grayscale(100%);
+			}
+		}
+
+		.entry-header {
+
+			margin-top: calc( 4 * #{$size__spacing-unit});
+			margin-bottom: 0;
+			margin-left: 0;
+			margin-right: 0;
+
+			@include media (tablet) {
+
+				margin-left: $size__site-margins;
+				margin-right: $size__site-margins;
+			}
+
+			.entry-title {
+
+				&:before {
+					background: $color__background-body;
+				}
+			}
+
+			/* Entry meta */
+
+			.entry-meta {
+
+				font-weight: 500;
+
+				> span {
+
+					margin-right: $size__spacing-unit;
+					display: inline-block;
+
+					&:last-child {
+						margin-right: 0;
+					}
+				}
+
+				a {
+
+					@include link-transition;
+					color: currentColor;
+
+					&:hover {
+						text-decoration: none;
+					}
+				}
+
+				.svg-icon {
+					position: relative;
+					display: inline-block;
+					vertical-align: middle;
+					margin-right: 0.5em;
+				}
+
+				.discussion-avatar-list {
+					display: none;
+				}
+			}
+
+			&.has-discussion {
+
+				@include media (tablet) {
+
+					.entry-meta {
+						display: flex;
+						position: relative;
+					}
+
+					.entry-title {
+						padding-right: calc(1 * (100vw / 12) + #{$size__spacing-unit});
+					}
+
+					.entry-meta .comment-count {
+						position: absolute;
+						right: 0;
+					}
+
+					.entry-meta .discussion-avatar-list {
+						display: block;
+						position: absolute;
+						bottom: 100%;
+					}
+				}
+			}
+		}
+	}
+
+	/* Custom Logo Link */
+
+	.custom-logo-link {
+
+		background: $color__background-body;
+		box-shadow: 0 0 0 0 rgba($color__background-body, 0);
+
+		&:hover,
+		&:active,
+		&:focus {
+			box-shadow: 0 0 0 2px rgba($color__background-body, 1);
+		}
+	}
+
+	/* Make sure important elements are above pseudo elements used for effects. */
+	.site-branding {
+		position: relative;
+		z-index: 10;
+	}
+
+	.site-featured-image .entry-header {
+		position: relative;
+		z-index: 9;
+	}
+
+	/* Set up image filter layer positioning */
+	.site-branding-container:after,
+	.site-featured-image:before,
+	.site-featured-image:after,
+	&:after {
+		display: block;
+		position: absolute;
+		top: 0; left: 0;
+		content: "\020";
+		width: 100%;
+		height: 100%;
+	}
+
+	/* Background & Effects */
+	/* Shared background settings between pseudo elements. */
+	background-position: center;
+	background-repeat: no-repeat;
+	background-size: cover;
+
+	/* The intensity of each blend mode is controlled via layer opacity. */
+
+	/* Second layer: screen. */
+	.image-filters-enabled & .site-featured-image:before {
+		background: $color__link;
+		mix-blend-mode: screen;
+		opacity: 0.1;
+	}
+
+	/* Third layer: multiply. */
+	/* When image filters are inactive, a black overlay is added. */
+	.site-featured-image:after {
+		background: #000;
+		mix-blend-mode: multiply;
+		opacity: .7;
+
+		/* When image filters are active, a blue overlay is added. */
+		.image-filters-enabled & {
+			background: $color__link;
+			opacity: .8;
+			z-index: 3;
+
+			/* Browsers supporting mix-blend-mode don't need opacity < 1 */
+			@supports (mix-blend-mode: multiply) {
+				opacity: 1;
+			}
+		}
+	}
+
+	/* Fourth layer: overlay. */
+	.image-filters-enabled & .site-branding-container:after {
+		background: rgba(0, 0, 0, 0.35);
+		mix-blend-mode: overlay;
+		opacity: 0.5;
+		z-index: 4;
+
+		/* Browsers supporting mix-blend-mode can have a light overlay */
+		@supports (mix-blend-mode: overlay) {
+			background: rgba($color__background-body, 0.35);
+		}
+	}
+
+	/* Fifth layer: readability overlay */
+	&:after {
+		background: #000;
+		/**
+		 * Add a transition to the readability overlay, to add a subtle
+		 * but smooth effect when resizing the screen.
+		 */
+		transition: opacity 1200ms ease-in-out;
+		opacity: 0.7;
+		z-index: 5;
+
+		/* When image filters are active, a blue overlay is added. */
+		.image-filters-enabled & {
+			background: mix($color__link, black, 12%);
+			opacity: 0.38;
+
+			@include media(tablet) {
+				opacity: 0.18;
+			}
+		}
+	}
+
+
+	::-moz-selection {
+		background: rgba($color__background-body, 0.17);
+	}
+
+	::selection {
+		background: rgba($color__background-body, 0.17);
+	}
+}

wp-content/themes/twentynineteen/sass/site/header/_site-header.scss

@@ -0,0 +1,139 @@
+// Site header
+
+.site-header {
+	padding: 1em;
+
+	&.featured-image {
+		display: flex;
+		flex-direction: column;
+		justify-content: space-between;
+		min-height: 90vh;
+
+		.site-branding-container {
+			margin-bottom: auto;
+		}
+	}
+
+	@include media(tablet) {
+		margin: 0;
+		padding: 3rem 0;
+
+		&.featured-image {
+			min-height: 100vh;
+			margin-bottom: 3rem;
+		}
+	}
+}
+
+// Site branding
+
+.site-branding {
+
+	color: $color__text-light;
+	-webkit-hyphens: auto;
+	-moz-hyphens: auto;
+	-ms-hyphens: auto;
+	hyphens: auto;
+	position: relative;
+	word-wrap: break-word;
+
+	@include media(tablet) {
+		margin: 0 $size__site-margins;
+	}
+}
+
+// Site logo
+
+.site-logo {
+
+	position: relative;
+	z-index: 999;
+	margin-bottom: calc(.66 * #{$size__spacing-unit});
+
+	@include media(tablet) {
+		margin-bottom: 0;
+		position: absolute;
+		right: calc(100% + (1.25 * #{$size__spacing-unit}));
+		top: 4px; // Accounts for box-shadow widths
+		z-index: 999;
+	}
+
+	.custom-logo-link {
+		border-radius: 100%;
+		box-sizing: content-box;
+		box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
+		display: block;
+		width: 50px;
+		height: 50px;
+		overflow: hidden;
+		transition: box-shadow $background_transition ease-in-out;
+
+		.custom-logo {
+			min-height: inherit;
+		}
+
+		&:hover,
+		&:active,
+		&:focus {
+			box-shadow: 0 0 0 2px rgba(0, 0, 0, 1);
+		}
+
+		@include media(tablet) {
+			width: 64px;
+			height: 64px;
+		}
+	}
+}
+
+// Site title
+
+.site-title {
+	margin: auto;
+	display: inline;
+	color: $color__text-main;
+
+	a {
+		color: $color__text-main;
+
+		&:link,
+		&:visited {
+			color: $color__text-main;
+		}
+
+		&:hover {
+			color: $color__text-hover;
+		}
+	}
+
+	.featured-image & {
+		margin: 0;
+
+		@include media(tablet) {
+			display: inline-block;
+		}
+	}
+
+	/* When there is no description set, make sure navigation appears below title. */
+	+ .main-navigation {
+		display: block;
+	}
+
+	@include media(tablet) {
+		display: inline;
+	}
+
+	&:not(:empty) + .site-description:not(:empty):before {
+		content: "\2014";
+		margin: 0 .2em;
+	}
+}
+
+// Site description
+
+.site-description {
+
+	display: inline;
+	color: $color__text-light;
+	font-weight: normal;
+	margin: 0;
+}

wp-content/themes/twentynineteen/sass/site/primary/_archives.scss

@@ -0,0 +1,65 @@
+.archive .page-header,
+.search .page-header,
+.error404 .page-header {
+
+	margin: $size__spacing-unit $size__spacing-unit calc(3 * #{$size__spacing-unit});
+
+	@include media(tablet) {
+		margin: 0 $size__site-margins calc(3 * #{$size__spacing-unit});
+	}
+
+	.page-title {
+
+		color: $color__text-light;
+		display: inline;
+		letter-spacing: normal;
+
+		&:before {
+			display: none;
+		}
+	}
+
+	.search-term,
+	.page-description {
+		display: inherit;
+		clear: both;
+	}
+}
+
+.archive .page-header .page-description,
+.search .page-header .page-description {
+	display: block;
+	color: $color__text-main;
+	font-size: 1em;
+}
+
+.hfeed .entry .entry-header {
+
+	@include media(tablet) {
+		margin: calc(3 * #{$size__spacing-unit}) $size__site-margins calc(#{ $size__spacing-unit } / 2);
+	}
+}
+
+/* 404 & Not found */
+
+.error-404.not-found,
+.no-results.not-found {
+
+	.page-content {
+
+		margin: calc(3 * #{$size__spacing-unit}) #{$size__spacing-unit};
+
+		@include media(tablet) {
+			margin: calc(3 * #{$size__spacing-unit}) $size__site-margins calc(#{ $size__spacing-unit } / 2);
+		}
+	}
+
+	.search-submit {
+		vertical-align: middle;
+		margin: $size__spacing-unit 0;
+	}
+
+	.search-field {
+		width: 100%;
+	}
+}

wp-content/themes/twentynineteen/sass/site/primary/_comments.scss

@@ -0,0 +1,405 @@
+.comment-content a {
+	word-wrap: break-word;
+}
+
+.bypostauthor {
+	display: block;
+}
+
+.comments-area {
+	-webkit-hyphens: auto;
+	-moz-hyphens: auto;
+	-ms-hyphens: auto;
+	hyphens: auto;
+	margin: calc(2 * #{$size__spacing-unit}) $size__spacing-unit;
+	word-wrap: break-word;
+	@include postContentMaxWidth();
+
+	@include media(tablet) {
+		margin: calc(3 * #{$size__spacing-unit}) $size__site-margins;
+	}
+
+	& > * {
+		margin-top: calc(2 * #{$size__spacing-unit});
+		margin-bottom: calc(2 * #{$size__spacing-unit});
+
+		@include media(tablet) {
+			margin-top: calc(3 * #{$size__spacing-unit});
+			margin-bottom: calc(3 * #{$size__spacing-unit});
+		}
+	}
+
+	/* Add extra margin when the comments section is located immediately after the
+	 * post itself (this happens on pages).
+	 */
+	.entry + & {
+		margin-top: calc(3 * #{$size__spacing-unit});
+	}
+
+	.comments-title-wrap {
+
+		@include media(tablet) {
+			align-items: baseline;
+			display: flex;
+			justify-content: space-between;
+		}
+
+		.comments-title {
+			@include post-section-dash;
+			margin: 0;
+
+			@include media(tablet) {
+				flex: 1 0 calc(3 * (100vw / 12));
+			}
+		}
+
+		.discussion-meta {
+			@include media(tablet) {
+				flex: 0 0 calc(2 * (100vw / 12));
+				margin-left: #{$size__spacing-unit};
+			}
+		}
+	}
+}
+
+#comment {
+	max-width: 100%;
+	box-sizing: border-box;
+}
+
+#respond {
+	position: relative;
+
+	.comment-user-avatar {
+		margin: $size__spacing-unit 0 -#{$size__spacing-unit};
+	}
+
+	.comment .comment-form {
+		padding-left: 0;
+	}
+
+	> small {
+		display: block;
+		font-size: $font__size_base;
+		position: absolute;
+		left: calc(#{$size__spacing-unit} + 100%);
+		top: calc(-3.5 * #{$size__spacing-unit});
+		width: calc(100vw / 12 );
+	}
+}
+
+#comments {
+
+	> .comments-title:last-child {
+		display: none;
+	}
+}
+
+.comment-form-flex {
+	display: flex;
+	flex-direction: column;
+
+	.comments-title {
+		display: none;
+		margin: 0;
+		order: 1;
+	}
+
+	#respond {
+		order: 2;
+
+		+ .comments-title {
+			display: block;
+		}
+	}
+}
+
+.comment-list {
+	list-style: none;
+	padding: 0;
+
+	.children {
+		margin: 0;
+		padding: 0 0 0 $size__spacing-unit;
+	}
+
+	> .comment:first-child {
+		margin-top: 0;
+	}
+
+	.pingback,
+	.trackback {
+
+		.comment-body {
+			color: $color__text-light;
+			@include font-family( $font__heading );
+			font-size: $font__size-xs;
+			font-weight: 500;
+			margin-top: $size__spacing-unit;
+			margin-bottom: $size__spacing-unit;
+
+			a:not(.comment-edit-link) {
+				font-weight: bold;
+				font-size: $font__size-base / (1 * $font__size-ratio);
+				line-height: 1.5;
+				padding-right: #{0.5 * $size__spacing-unit};
+				display: block;
+			}
+
+			.comment-edit-link {
+				color: $color__text-light;
+				@include font-family( $font__heading );
+				font-weight: 500;
+			}
+		}
+	}
+}
+
+.comment-reply {
+
+	#respond + & {
+		display: none;
+	}
+
+	.comment-reply-link {
+		display: inline-block;
+	}
+}
+
+.comment {
+	list-style: none;
+	position: relative;
+
+	@include media(tablet) {
+		padding-left: calc(.5 * (#{$size__spacing-unit} + calc(100vw / 12 )));
+
+		&.depth-1,
+		.children {
+			padding-left: 0;
+		}
+
+		&.depth-1 {
+			margin-left: calc(3.25 * #{$size__spacing-unit});
+		}
+	}
+
+	.comment-body {
+		margin: calc(2 * #{$size__spacing-unit}) 0 0;
+	}
+
+
+	.comment-meta {
+		position: relative;
+	}
+
+	.comment-author {
+
+		.avatar {
+			float: left;
+			margin-right: $size__spacing-unit;
+			position: relative;
+
+			@include media(tablet) {
+				float: inherit;
+				margin-right: inherit;
+				position: absolute;
+				top: 0;
+				right: calc(100% + #{$size__spacing-unit});
+			}
+		}
+
+		.fn {
+			position: relative;
+			display: block;
+
+			a {
+				color: inherit;
+
+				&:hover {
+					color: $color__link-hover;
+				}
+			}
+		}
+
+		.post-author-badge {
+			border-radius: 100%;
+			display: block;
+			height: 18px;
+			position: absolute;
+			background: lighten( $color__link, 8% );
+			right: calc(100% - #{$size__spacing-unit * 2.5});
+			top: -3px;
+			width: 18px;
+
+			@include media(tablet) {
+				right: calc(100% + #{$size__spacing-unit * .75});
+			}
+
+			svg {
+				width: inherit;
+				height: inherit;
+				display: block;
+				fill: white;
+				transform: scale(0.875);
+			}
+		}
+	}
+
+	.comment-metadata {
+
+		> a,
+		.comment-edit-link {
+			display: inline;
+			font-weight: 500;
+			color: $color__text-light;
+			vertical-align: baseline;
+
+			time {
+				vertical-align: baseline;
+			}
+
+			&:hover {
+				color: $color__link-hover;
+				text-decoration: none;
+			}
+		}
+
+		> * {
+			display: inline-block;
+		}
+
+		.edit-link-sep {
+			color: $color__text-light;
+			margin: 0 0.2em;
+			vertical-align: baseline;
+		}
+
+		.edit-link {
+			color: $color__text-light;
+
+			svg {
+				transform: scale(0.8);
+				vertical-align: baseline;
+				margin-right: 0.1em;
+			}
+		}
+
+		.comment-edit-link {
+			position: relative;
+			padding-left: $size__spacing-unit;
+			margin-left: -#{$size__spacing-unit};
+			z-index: 1;
+
+			&:hover {
+				color: $color__link;
+			}
+		}
+	}
+
+	.comment-content {
+
+		margin: $size__spacing-unit 0;
+
+		@include media(desktop) {
+			padding-right: $size__spacing-unit;
+		}
+
+		> *:first-child {
+			margin-top: 0;
+		}
+
+		> *:last-child {
+			margin-bottom: 0;
+		}
+
+		blockquote {
+			margin-left: 0;
+		}
+
+		a {
+			text-decoration: underline;
+
+			&:hover {
+				text-decoration: none;
+			}
+		}
+	}
+}
+
+.comment-reply-link,
+#cancel-comment-reply-link {
+	font-weight: 500;
+
+	&:hover {
+		color: $color__link-hover;
+	}
+}
+
+.discussion-avatar-list {
+	@include clearfix;
+
+	margin: 0;
+	padding: 0;
+
+	li {
+		position: relative;
+		list-style: none;
+		margin: 0 -8px 0 0;
+		padding: 0;
+		float: left;
+	}
+
+	.comment-user-avatar {
+
+		img {
+			height: calc(1.5 * #{$size__spacing-unit});
+			width: calc(1.5 * #{$size__spacing-unit});
+		}
+	}
+}
+
+.discussion-meta {
+
+	.discussion-meta-info {
+		margin: 0;
+
+		.svg-icon {
+			vertical-align: middle;
+			fill: currentColor;
+			transform: scale( 0.6 ) scaleX(-1) translateY(-0.1em);
+			margin-left: -#{.25 * $size__spacing-unit}; // Align icon with avatars above.
+		}
+	}
+
+}
+
+.comment-form {
+
+	.comment-notes,
+	label {
+		@include font-family( $font__heading );
+		font-size: $font__size-xs;
+		color: $color__text-light;
+	}
+
+	.comment-form-author,
+	.comment-form-email {
+		@include media(tablet) {
+			width: calc(50% - #{$size__spacing-unit / 2});
+			float: left;
+		}
+	}
+
+	.comment-form-email {
+		@include media(tablet) {
+			margin-left: $size__spacing-unit;
+		}
+	}
+
+	input[name="author"],
+	input[name="email"],
+	input[name="url"] {
+		display: block;
+		width: 100%;
+	}
+}

wp-content/themes/twentynineteen/sass/site/primary/_posts-and-pages.scss

@@ -0,0 +1,304 @@
+.sticky {
+	display: block;
+}
+
+.sticky-post {
+	background: $color__background-button;
+	color: #fff;
+	display: inline-block;
+	font-weight: bold;
+	line-height: 1;
+	padding: .25rem;
+	position: absolute;
+	text-transform: uppercase;
+	top: -$size__spacing-unit;
+	z-index: 1;
+}
+
+.updated:not(.published) {
+	display: none;
+}
+
+.page-links {
+	clear: both;
+	margin: 0 0 calc(1.5 * #{$size__spacing-unit});
+}
+
+.entry {
+
+	margin-top: calc(6 * #{$size__spacing-unit});
+
+	&:first-of-type {
+		margin-top: 0;
+	}
+
+	.entry-header {
+
+		margin: calc(3 * #{ $size__spacing-unit}) $size__spacing-unit $size__spacing-unit;
+		position: relative;
+
+		@include media(tablet) {
+			margin: calc(3 * #{ $size__spacing-unit}) $size__site-margins $size__spacing-unit;
+		}
+	}
+
+	.entry-title {
+
+		@include post-section-dash;
+		margin: 0;
+
+		a {
+			color: inherit;
+
+			&:hover {
+				color: $color__text-hover;
+			}
+		}
+	}
+
+	.entry-meta,
+	.entry-footer {
+
+		color: $color__text-light;
+		font-weight: 500;
+
+		> span {
+
+			margin-right: $size__spacing-unit;
+			display: inline-block;
+
+			&:last-child {
+				margin-right: 0;
+			}
+		}
+
+		a {
+
+			@include link-transition;
+			color: currentColor;
+
+			&:hover {
+				text-decoration: none;
+				color: $color__link;
+			}
+		}
+
+		.svg-icon {
+			position: relative;
+			display: inline-block;
+			vertical-align: middle;
+			margin-right: 0.5em;
+		}
+	}
+
+	.entry-meta {
+		margin: $size__spacing-unit 0;
+	}
+
+	.entry-footer {
+
+		margin: calc(2 * #{$size__spacing-unit}) $size__spacing-unit $size__spacing-unit;
+
+		@include media(tablet) {
+			margin: $size__spacing-unit $size__site-margins calc(3 * #{$size__spacing-unit});
+			max-width: $size__site-tablet-content;
+		}
+
+		@include media(tablet) {
+			max-width: $size__site-desktop-content;
+		}
+	}
+
+	.post-thumbnail {
+
+		margin: $size__spacing-unit;
+
+		@include media(tablet) {
+			margin: $size__spacing-unit $size__site-margins;
+		}
+
+		&:focus {
+			outline: none;
+		}
+
+		.post-thumbnail-inner {
+			display: block;
+
+			img {
+				position: relative;
+				display: block;
+				width: 100%;
+			}
+		}
+	}
+
+	.image-filters-enabled & {
+
+		.post-thumbnail {
+			position: relative;
+			display: block;
+
+			.post-thumbnail-inner {
+				filter: grayscale(100%);
+
+				&:after {
+					background: rgba(0, 0, 0, 0.35);
+					content: "";
+					display: block;
+					height: 100%;
+					opacity: .5;
+					pointer-events: none;
+					position: absolute;
+					top: 0;
+					width: 100%;
+					z-index: 4;
+
+					@supports (mix-blend-mode: multiply) {
+						display: none;
+					}
+				}
+			}
+
+			&:before,
+			&:after {
+				position: absolute;
+				display: block;
+				width: 100%;
+				height: 100%;
+				top: 0; left: 0;
+				content: "\020";
+				pointer-events: none;
+			}
+
+			@include filter-duotone;
+
+		}
+	}
+
+	.entry-content,
+	.entry-summary {
+		max-width: calc(100% - (2 * #{ $size__spacing-unit }));
+		margin: 0 $size__spacing-unit;
+
+		@include media(tablet) {
+			max-width: 80%;
+			margin: 0 10%;
+			padding: 0 60px;
+		}
+	}
+
+	.entry-content {
+
+		p {
+			word-wrap: break-word;
+		}
+
+		.more-link {
+			@include link-transition;
+			display: inline;
+			color: inherit;
+
+			&:after {
+				content: "\02192";
+				display: inline-block;
+				margin-left: 0.5em;
+			}
+
+			&:hover {
+				color: $color__link;
+				text-decoration: none;
+			}
+		}
+
+		a {
+			text-decoration: underline;
+
+			&.button,
+			&:hover {
+				text-decoration: none;
+			}
+
+			&.button {
+				display: inline-block;
+			}
+
+			&.button:hover {
+				background: $color__background-button-hover;
+				color: $color__background-body;
+				cursor: pointer;
+			}
+		}
+
+		// Overwrite iframe embeds that have inline styles.
+		> iframe[style] {
+
+			margin: 32px 0 !important;
+			max-width: 100% !important;
+
+			@include media(tablet) {
+				max-width: $size__site-tablet-content !important;
+			}
+
+			@include media(desktop) {
+				max-width: $size__site-desktop-content !important;
+			}
+		}
+
+		// Page links
+		.page-links a {
+			margin: calc(0.5 * #{$size__spacing-unit});
+			text-decoration: none;
+		}
+
+		// Classic editor audio embeds.
+		.wp-audio-shortcode {
+			max-width: calc(100vw - (2 * #{ $size__spacing-unit }));
+
+			@include media(tablet) {
+				max-width: $size__site-tablet-content;
+			}
+
+			@include media(desktop) {
+				max-width: $size__site-desktop-content;
+			}
+		}
+	}
+}
+
+/* Author description */
+
+.author-bio {
+	margin: calc(2 * #{$size__spacing-unit}) $size__spacing-unit $size__spacing-unit;
+
+	@include postContentMaxWidth();
+
+	@include media(tablet) {
+		margin: calc(3 * #{$size__spacing-unit}) $size__site-margins;
+	}
+
+	@include media(desktop) {
+		margin: calc(3 * #{$size__spacing-unit}) $size__site-margins;
+	}
+
+	.author-title {
+		@include post-section-dash;
+		display: inline;
+	}
+
+	.author-description {
+
+		display: inline;
+		color: $color__text-light;
+		font-size: $font__size-md;
+		line-height: $font__line-height-heading;
+
+		.author-link {
+			display: inline-block;
+
+			&:hover {
+				color: $color__link-hover;
+				text-decoration: none;
+			}
+		}
+	}
+}

wp-content/themes/twentynineteen/sass/site/secondary/_widgets.scss

@@ -0,0 +1,81 @@
+.widget {
+	margin: 0 0 #{$size__spacing-unit};
+
+	/* Make sure select elements fit in widgets. */
+	select {
+		max-width: 100%;
+	}
+
+	a {
+		color: $color__link;
+
+		&:hover {
+			color: $color__link-hover;
+		}
+	}
+}
+
+.widget_archive,
+.widget_categories,
+.widget_meta,
+.widget_nav_menu,
+.widget_pages,
+.widget_recent_comments,
+.widget_recent_entries,
+.widget_rss {
+
+	ul {
+		padding: 0;
+		list-style: none;
+
+		li {
+			color: $color__text-light;
+			@include font-family( $font__heading );
+			font-size: calc(#{$font__size_base} * #{$font__size-ratio});
+			font-weight: 700;
+			line-height: $font__line-height-heading;
+			margin-top: #{0.5 * $size__spacing-unit};
+			margin-bottom: #{0.5 * $size__spacing-unit};
+		}
+
+		@include nestedSubMenuPadding();
+	}
+}
+
+.widget_tag_cloud {
+
+	.tagcloud {
+		@include font-family( $font__heading );
+		font-weight: 700;
+	}
+}
+
+
+.widget_search {
+
+	.search-field {
+		width: 100%;
+
+		@include media(mobile) {
+			width: auto;
+		}
+	}
+
+	.search-submit {
+		display: block;
+		margin-top: $size__spacing-unit;
+	}
+}
+
+.widget_calendar .calendar_wrap {
+	text-align: center;
+
+	table td,
+	table th {
+		border: none;
+	}
+
+	a {
+		text-decoration: underline;
+	}
+}

wp-content/themes/twentynineteen/sass/typography/_copy.scss

@@ -0,0 +1,62 @@
+p {
+	-webkit-font-smoothing: antialiased;
+	-moz-osx-font-smoothing: grayscale;
+}
+
+dfn,
+cite,
+em,
+i {
+	font-style: italic;
+}
+
+blockquote {
+
+	cite {
+		font-size: $font__size-xs;
+		font-style: normal;
+		@include font-family( $font__heading );
+	}
+}
+
+pre {
+	font-size: $font__size-sm;
+	font-family: $font__pre;
+	line-height: $font__line-height-body;
+	overflow: auto;
+}
+
+code,
+kbd,
+tt,
+var {
+	font-size: $font__size-sm;
+	font-family: $font__code;
+}
+
+abbr, acronym {
+	border-bottom: 1px dotted #666;
+	cursor: help;
+}
+
+mark,
+ins {
+	background: #fff9c0;
+	text-decoration: none;
+}
+
+big {
+	font-size: 125%;
+}
+
+a {
+	text-decoration: none;
+
+	&:hover {
+		text-decoration: none;
+	}
+
+	&:focus {
+		text-decoration: underline;
+	}
+}

wp-content/themes/twentynineteen/sass/typography/_headings.scss

@@ -0,0 +1,164 @@
+.author-description .author-link,
+.comment-metadata,
+.comment-reply-link,
+.comments-title,
+.comment-author .fn,
+.discussion-meta-info,
+.entry-meta,
+.entry-footer,
+.main-navigation,
+.no-comments,
+.not-found .page-title,
+.error-404 .page-title,
+.post-navigation .post-title,
+.page-links,
+.page-description,
+.pagination .nav-links,
+.sticky-post,
+.site-title,
+.site-info,
+#cancel-comment-reply-link,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+	@include font-family( $font__heading );
+}
+
+.main-navigation,
+.page-description,
+.author-description .author-link,
+.not-found .page-title,
+.error-404 .page-title,
+.post-navigation .post-title,
+.pagination .nav-links,
+.comments-title,
+.comment-author .fn,
+.no-comments,
+.site-title,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+	font-weight: 700;
+	letter-spacing: -0.02em;
+	line-height: $font__line-height-heading;
+	-webkit-font-smoothing: antialiased;
+	-moz-osx-font-smoothing: grayscale;
+}
+
+.page-title {
+	@include font-family( $font__body );
+}
+
+.site-branding,
+.main-navigation ul.main-menu > li,
+.social-navigation,
+.author-description .author-bio,
+.nav-links {
+	line-height: 1.25;
+}
+
+h1 {
+	font-size: $font__size-xl;
+
+	@include media(tablet) {
+		font-size: $font__size-xxl;
+	}
+}
+
+.entry-title,
+.not-found .page-title,
+.error-404 .page-title,
+.has-larger-font-size,
+h2 {
+	font-size: $font__size-lg;
+
+	@include media(tablet) {
+		font-size: $font__size-xl;
+	}
+}
+
+.has-regular-font-size,
+.has-large-font-size,
+.comments-title,
+h3 {
+	font-size: $font__size-lg;
+}
+
+.site-title,
+.site-description,
+.main-navigation,
+.nav-links,
+.page-title,
+.page-description,
+.comment-author .fn,
+.no-comments,
+h2.author-title,
+p.author-bio,
+h4 {
+	font-size: $font__size-md;
+}
+
+.pagination .nav-links,
+.comment-content,
+h5 {
+	font-size: $font__size-sm;
+}
+
+.entry-meta,
+.entry-footer,
+.discussion-meta-info,
+.site-info,
+.has-small-font-size,
+.comment-reply-link,
+.comment-metadata,
+.comment-notes,
+.sticky-post,
+#cancel-comment-reply-link,
+img:after,
+h6 {
+	font-size: $font__size-xs;
+}
+
+.site-title,
+.page-title {
+	font-weight: normal;
+}
+
+.page-description,
+.page-links a {
+	font-weight: bold;
+}
+
+.site-description {
+	letter-spacing: -0.01em;
+}
+
+.post-navigation .post-title,
+.entry-title,
+.not-found .page-title,
+.error-404 .page-title,
+.comments-title,
+blockquote {
+	-webkit-hyphens: auto;
+	-moz-hyphens: auto;
+	-ms-hyphens: auto;
+	hyphens: auto;
+	word-break: break-word;
+	word-wrap: break-word;
+}
+
+/* Do not hyphenate entry title on tablet view and bigger. */
+.entry-title {
+	@include media(tablet) {
+		-webkit-hyphens: none;
+		-moz-hyphens: none;
+		-ms-hyphens: none;
+		hyphens: none;
+	}
+}

wp-content/themes/twentynineteen/sass/typography/_typography.scss

@@ -0,0 +1,32 @@
+
+html {
+	font-size: $font__size_base;
+}
+
+body {
+	-webkit-font-smoothing: antialiased;
+	-moz-osx-font-smoothing: grayscale;
+	color: $color__text-main;
+	@include font-family( $font__body );
+	font-weight: 400;
+	font-size: 1em;
+	line-height: $font__line-height-body;
+	margin: 0;
+	text-rendering: optimizeLegibility;
+}
+
+button,
+input,
+select,
+optgroup,
+textarea {
+	color: $color__text-main;
+	@include font-family( $font__body );
+	font-weight: 400;
+	line-height: $font__line-height-body;
+	text-rendering: optimizeLegibility;
+}
+
+@import "headings";
+
+@import "copy";

wp-content/themes/twentynineteen/sass/variables-site/_colors.scss

@@ -0,0 +1,34 @@
+
+// Backgrounds
+$color__background-body: #fff;
+$color__background-input: #fff;
+$color__background-screen: #f1f1f1;
+$color__background-hr: #ccc;
+$color__background-button: #0073aa;
+$color__background-button-hover: #111;
+$color__background-pre: #eee;
+$color__background-ins: #fff9c0;
+$color__background_selection: mix( $color__background-body, $color__background-button, 75% ); // lighten( salmon, 22.5% ); // lighten( #0999d4, 48% );
+
+// Text
+$color__text-main: #111;
+$color__text-light: #767676;
+$color__text-hover: lighten( #111, 22.5% );
+$color__text-screen: #21759b;
+$color__text-input: #666;
+$color__text-input-focus: #111;
+
+// Links
+$color__link: #0073aa;
+$color__link-visited: #0073aa;
+$color__link-hover: darken( $color__link, 10% );
+
+// Borders
+$color__border: #ccc;
+$color__border-link: #0073aa;
+$color__border-link-hover: darken( $color__link, 10% );
+$color__border-button: #ccc #ccc #bbb;
+$color__border-button-hover: #ccc #bbb #aaa;
+$color__border-button-focus: #aaa #bbb #bbb;
+$color__border-input: $color__border;
+$color__border-abbr: #666;

wp-content/themes/twentynineteen/sass/variables-site/_columns.scss

@@ -0,0 +1,16 @@
+$columns: (
+	1: calc(1 * (100vw / 12)),
+	2: calc(2 * (100vw / 12)),
+	3: calc(3 * (100vw / 12)),
+	4: calc(4 * (100vw / 12)),
+	5: calc(5 * (100vw / 12)),
+	6: calc(6 * (100vw / 12)),
+	7: calc(7 * (100vw / 12)),
+	8: calc(8 * (100vw / 12)),
+	9: calc(9 * (100vw / 12)),
+	10: calc(10 * (100vw / 12)),
+	11: calc(11 * (100vw / 12)),
+	12: calc(12 * (100vw / 12))
+);
+
+$columns__margin: $size__spacing-unit;

wp-content/themes/twentynineteen/sass/variables-site/_structure.scss

@@ -0,0 +1,16 @@
+// Responsive widths.
+
+$size__spacing-unit: 1rem;
+$size__site-main: 100%;
+$size__site-sidebar: 25%;
+$size__site-margins: calc(10% + 60px);
+$size__site-tablet-content: calc(8 * (100vw / 12) - 28px);
+$size__site-desktop-content: calc(6 * (100vw / 12) - 28px);
+
+// Responsive widths.
+
+$mobile_width: 600px;
+$tablet_width: 768px;
+$desktop_width: 1168px;
+$wide_width: 1379px;
+

wp-content/themes/twentynineteen/sass/variables-site/_transitions.scss

@@ -0,0 +1,6 @@
+// Transition timeouts.
+
+$link_transition: 110ms;
+$icon_transition: 120ms;
+$button_transition: 150ms;
+$background_transition: 200ms;

wp-content/themes/twentynineteen/sass/variables-site/_variables-site.scss

@@ -0,0 +1,5 @@
+@import "colors";
+@import "fonts";
+@import "structure";
+@import "columns";
+@import "transitions";

wp-content/themes/twentynineteen/search.php

@@ -0,0 +1,55 @@
+<?php
+/**
+ * The template for displaying search results pages
+ *
+ * @link https://developer.wordpress.org/themes/basics/template-hierarchy/#search-result
+ *
+ * @package WordPress
+ * @subpackage Twenty_Nineteen
+ * @since 1.0.0
+ */
+
+get_header();
+?>
+
+	<div id="primary" class="content-area">
+		<main id="main" class="site-main">
+
+		<?php if ( have_posts() ) : ?>
+
+			<header class="page-header">
+				<h1 class="page-title">
+					<?php _e( 'Search results for: ', 'twentynineteen' ); ?>
+					<span class="page-description"><?php echo get_search_query(); ?></span>
+				</h1>
+			</header><!-- .page-header -->
+
+			<?php
+			// Start the Loop.
+			while ( have_posts() ) :
+				the_post();
+
+				/*
+				 * Include the Post-Format-specific template for the content.
+				 * If you want to override this in a child theme, then include a file
+				 * called content-___.php (where ___ is the Post Format name) and that will be used instead.
+				 */
+				get_template_part( 'template-parts/content/content', 'excerpt' );
+
+				// End the loop.
+			endwhile;
+
+			// Previous/next page navigation.
+			twentynineteen_the_posts_navigation();
+
+			// If no content, include the "No posts found" template.
+		else :
+			get_template_part( 'template-parts/content/content', 'none' );
+
+		endif;
+		?>
+		</main><!-- #main -->
+	</div><!-- #primary -->
+
+<?php
+get_footer();

wp-content/themes/twentynineteen/single.php

@@ -0,0 +1,60 @@
+<?php
+/**
+ * The template for displaying all single posts
+ *
+ * @link https://developer.wordpress.org/themes/basics/template-hierarchy/#single-post
+ *
+ * @package WordPress
+ * @subpackage Twenty_Nineteen
+ * @since 1.0.0
+ */
+
+get_header();
+?>
+
+	<div id="primary" class="content-area">
+		<main id="main" class="site-main">
+
+			<?php
+
+			/* Start the Loop */
+			while ( have_posts() ) :
+				the_post();
+
+				get_template_part( 'template-parts/content/content', 'single' );
+
+				if ( is_singular( 'attachment' ) ) {
+					// Parent post navigation.
+					the_post_navigation(
+						array(
+							/* translators: %s: Parent post link. */
+							'prev_text' => sprintf( __( '<span class="meta-nav">Published in</span><span class="post-title">%s</span>', 'twentynineteen' ), '%title' ),
+						)
+					);
+				} elseif ( is_singular( 'post' ) ) {
+					// Previous/next post navigation.
+					the_post_navigation(
+						array(
+							'next_text' => '<span class="meta-nav" aria-hidden="true">' . __( 'Next Post', 'twentynineteen' ) . '</span> ' .
+								'<span class="screen-reader-text">' . __( 'Next post:', 'twentynineteen' ) . '</span> <br/>' .
+								'<span class="post-title">%title</span>',
+							'prev_text' => '<span class="meta-nav" aria-hidden="true">' . __( 'Previous Post', 'twentynineteen' ) . '</span> ' .
+								'<span class="screen-reader-text">' . __( 'Previous post:', 'twentynineteen' ) . '</span> <br/>' .
+								'<span class="post-title">%title</span>',
+						)
+					);
+				}
+
+				// If comments are open or we have at least one comment, load up the comment template.
+				if ( comments_open() || get_comments_number() ) {
+					comments_template();
+				}
+
+			endwhile; // End of the loop.
+			?>
+
+		</main><!-- #main -->
+	</div><!-- #primary -->
+
+<?php
+get_footer();

wp-content/themes/twentynineteen/style-editor-customizer.css

@@ -0,0 +1,5 @@
+/*!
+Twenty Nineteen Customizer Styles
+
+NOTE: This file is automatically populated with styles if the user selects a custom primary color in the customzier.
+*/

wp-content/themes/twentynineteen/style-editor-customizer.scss

@@ -0,0 +1,5 @@
+/*!
+Twenty Nineteen Customizer Styles
+
+NOTE: This file is automatically populated with styles if the user selects a custom primary color in the customzier.
+*/

wp-content/themes/twentynineteen/style-editor.scss

@@ -0,0 +1,948 @@
+/*!
+Twenty Nineteen Editor Styles
+*/
+
+/** === Includes === */
+
+@import "sass/variables-site/variables-site";
+@import "sass/mixins/mixins-master";
+
+/** === Editor Frame === */
+
+body {
+
+	.wp-block[data-align="full"] {
+		width: 100%;
+	}
+
+	@include media(mobile) {
+
+		.wp-block[data-align="full"] {
+			width: calc( 100% + 90px );
+			max-width: calc( 100% + 90px );
+		}
+	}
+
+	@include media(tablet) {
+
+		.editor-writing-flow {
+			max-width: 80%;
+			margin: 0 10%;
+		}
+
+		.editor-post-title__block,
+		.editor-default-block-appender,
+		.editor-block-list__block {
+			margin-left: 0;
+			margin-right: 0;
+		}
+
+		.wp-block[data-align="wide"] {
+			width: 100%;
+		}
+
+		.wp-block[data-align="full"] {
+			position: relative;
+			left: calc( -12.5% - 14px );
+			width: calc( 125% + 116px );
+			max-width: calc( 125% + 115px ); // Subtract 1px here to avoid the rounding errors that happen due to the usage of percentages.
+		}
+
+		.wp-block[data-align="right"] {
+			max-width: 125%;
+		}
+	}
+}
+
+/** === Content Width === */
+
+.wp-block {
+	width: calc(100vw - (2 * #{$size__spacing-unit}));
+	max-width: 100%;
+
+	@include media(tablet) {
+		width: calc(8 * (100vw / 12));
+	}
+
+	@include media(desktop) {
+		width: calc(6 * (100vw / 12 ));
+	}
+
+	// Only the top level blocks need specific widths, therefore override for every nested block.
+	.wp-block {
+		width: 100%;
+	}
+}
+
+/** === Base Typography === */
+
+body {
+	font-size: $font__size_base;
+	@include font-family( $font__body );
+	line-height: $font__line-height-body;
+	color: $color__text-main;
+}
+
+p {
+	font-size: $font__size_base;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+	@include font-family( $font__heading );
+	font-weight: 700;
+}
+
+h1 {
+	font-size: $font__size-xl;
+	@include post-section-dash;
+
+	@include media(tablet) {
+		font-size: $font__size-xxl;
+	}
+}
+
+h2 {
+	font-size: $font__size-lg;
+	@include post-section-dash;
+
+	@include media(tablet) {
+		font-size: $font__size-xl;
+	}
+}
+
+h3 {
+	font-size: $font__size-lg;
+}
+
+h4 {
+	font-size: $font__size-md;
+}
+
+h5 {
+	font-size: $font__size-sm;
+}
+
+h6 {
+	font-size: $font__size-xs;
+}
+
+a {
+	@include link-transition;
+	color: $color__link;
+
+	*:visited {
+
+	}
+
+	&:hover,
+	&:active {
+		color: $color__link-hover;
+		outline: 0;
+		text-decoration: none;
+	}
+
+	&:focus {
+		outline: 0;
+		text-decoration: underline;
+	}
+}
+
+// Use white text against these backgrounds by default.
+.has-primary-background-color,
+.has-secondary-background-color,
+.has-dark-gray-background-color,
+.has-light-gray-background-color {
+	color: $color__background-body;
+
+	p,
+	h1,
+	h2,
+	h3,
+	h4,
+	h5,
+	h6,
+	a {
+		color: $color__background-body;
+	}
+}
+
+// Use dark gray text against this background by default.
+.has-white-background-color {
+	color: $color__text-main;
+
+	p,
+	h1,
+	h2,
+	h3,
+	h4,
+	h5,
+	h6,
+	a {
+		color: $color__text-main;
+	}
+}
+
+figcaption,
+.gallery-caption {
+	@include font-family( $font__heading );
+	font-size: $font__size-xs;
+	line-height: 1.6;
+	color: $color__text-light;
+}
+
+/** === Post Title === */
+
+.editor-post-title__block {
+	@include post-section-dash;
+
+	&:before {
+		width: $font__size-xxl;
+		margin-top: 0;
+		margin-bottom: 0;
+		margin-left: 1em;
+		position: relative;
+		top: 0.5em;
+	}
+
+	.editor-post-title__input {
+		@include font-family( $font__heading );
+		font-size: $font__size-xxl;
+		font-weight: 700;
+	}
+}
+
+/** === Default Appender === */
+
+.editor-default-block-appender .editor-default-block-appender__content {
+	@include font-family( $font__body );
+	font-size: $font__size_base;
+}
+
+/** === Heading === */
+
+.wp-block-heading {
+	strong {
+		font-weight: bolder;
+	}
+}
+/** === Paragraph === */
+
+.wp-block-paragraph {
+
+	&.has-drop-cap:not(:focus)::first-letter {
+		@include font-family( $font__heading );
+		font-size: $font__size-xxxl;
+		line-height: 1;
+		font-weight: bold;
+		margin: 0 0.25em 0 0;
+	}
+}
+
+/** === Table === */
+
+.wp-block-table {
+	@include font-family( $font__heading );
+}
+
+/** === Cover === */
+
+.wp-block-cover {
+
+	h2,
+	.wp-block-cover-text {
+		@include font-family( $font__heading );
+		font-size: $font__size-lg;
+		font-weight: bold;
+		line-height: 1.4;
+		padding-left: $size__spacing-unit;
+		padding-right: $size__spacing-unit;
+
+		strong {
+			font-weight: bolder;
+		}
+
+		@include media(tablet) {
+			margin-left: auto;
+			margin-right: auto;
+			padding: 0;
+		}
+	}
+
+	@include media(tablet) {
+		padding-left: 10%;
+		padding-right: 10%;
+
+		h2,
+		.wp-block-cover-text {
+			font-size: $font__size-xl;
+		}
+	}
+}
+
+.wp-block[data-type="core/cover"][data-align="left"],
+.wp-block[data-type="core/cover"][data-align="right"] {
+
+	.editor-block-list__block-edit {
+		width: calc(4 * (100vw / 12));
+	}
+
+	.wp-block-cover {
+		width: 100%;
+		max-width: 100%;
+		padding: calc(1.375 * #{$size__spacing-unit});
+
+		p {
+			padding-left: 0;
+			padding-right: 0;
+		}
+
+		@include media(tablet) {
+			padding: calc(2.75 * #{$size__spacing-unit}) calc(2.75 * #{$size__spacing-unit}) calc(3.125 * #{$size__spacing-unit});
+		}
+	}
+}
+
+.wp-block[data-type="core/cover"][data-align="wide"],
+.wp-block[data-type="core/cover"][data-align="full"] {
+
+	@include media(tablet) {
+
+		h2,
+		.wp-block-cover-text {
+			max-width: calc(8 * (100vw / 12));
+		}
+	}
+
+	@include media(desktop) {
+
+		h2,
+		.wp-block-cover-text {
+			max-width: calc(6 * (100vw / 12));
+		}
+	}
+}
+
+.wp-block[data-type="core/cover"][data-align="full"] {
+
+	@include media(tablet) {
+
+		.wp-block-cover {
+			padding-left: calc(10% + 64px);
+			padding-right: calc(10% + 64px);
+		}
+	}
+}
+
+/** === Gallery === */
+
+.wp-block-gallery {
+
+	.blocks-gallery-image figcaption,
+	.blocks-gallery-item figcaption,
+	.gallery-item .gallery-caption {
+		font-size: $font__size-xs;
+		line-height: 1.6;
+	}
+}
+
+/** === Button === */
+
+.wp-block-button {
+
+	.wp-block-button__link {
+		line-height: 1.8;
+		@include font-family( $font__heading );
+		font-size: $font__size-sm;
+		font-weight: bold;
+	}
+
+	&:not(.is-style-outline) .wp-block-button__link {
+		background: $color__background-button;
+	}
+
+	&:not(.is-style-squared) .wp-block-button__link {
+		border-radius: 5px;
+	}
+
+	&.is-style-outline,
+	&.is-style-outline:hover,
+	&.is-style-outline:focus,
+	&.is-style-outline:active {
+		background: transparent;
+		color: $color__background-button;
+
+		.wp-block-button__link {
+			background: transparent;
+
+			&:not(.has-text-color) {
+				color: $color__background-button;
+			}
+		}
+	}
+}
+
+/** === Blockquote === */
+
+.wp-block-quote {
+
+	&:not(.is-large):not(.is-style-large) {
+		border-width: 2px;
+		border-color: $color__link;
+	}
+
+	&.is-large,
+	&.is-style-large {
+		margin-top: $font__size-xxl;
+		margin-bottom: $font__size-xxl;
+	}
+
+	&.is-large p,
+	&.is-style-large p {
+		font-size: $font__size-lg;
+		line-height: 1.3;
+		margin-bottom: 0.5em;
+		margin-top: 0.5em;
+	}
+
+	cite,
+	footer,
+	.wp-block-quote__citation {
+		@include font-family( $font__heading );
+		font-size: $font__size-xs;
+		line-height: 1.6;
+		color: $color__text-light;
+	}
+}
+
+/** === Pullquote === */
+
+.wp-block-pullquote {
+	border-color: transparent;
+	border-width: 2px;
+	color: #000;
+
+	blockquote {
+		margin-top: calc(3 * #{ $size__spacing-unit});
+		margin-bottom: calc(3.33 * #{ $size__spacing-unit});
+		hyphens: auto;
+		word-break: break-word;
+	}
+
+	&:not(.is-style-solid-color) .wp-block-pullquote__citation {
+		color: $color__text-light;
+	}
+
+	&.is-style-solid-color {
+
+		blockquote {
+			width: calc(100% - (2 * #{ $size__spacing-unit}));
+			max-width: calc( 100% - (2 * #{ $size__spacing-unit}));
+
+			a,
+			&.has-text-color p,
+			&.has-text-color a {
+				color: inherit;
+			}
+
+			&:not(.has-text-color) {
+				color: $color__background-body;
+			}
+
+			@include media(tablet) {
+				max-width: 80%;
+			}
+		}
+
+		&:not(.has-background-color) {
+			background-color: $color__link;
+		}
+	}
+}
+
+.wp-block[data-type="core/pullquote"],
+.wp-block[data-type="core/pullquote"][data-align="left"],
+.wp-block[data-type="core/pullquote"][data-align="right"] {
+
+	blockquote > .block-library-pullquote__content .editor-rich-text__tinymce[data-is-empty="true"]::before,
+	blockquote > .editor-rich-text p,
+	p {
+		font-size: $font__size-lg;
+		font-style: italic;
+		line-height: 1.3;
+		margin-bottom: 0.5em;
+		margin-top: 0.5em;
+
+		@include media(tablet) {
+			font-size: $font__size-xl;
+		}
+	}
+
+	.wp-block-pullquote__citation {
+		@include font-family( $font__heading );
+		font-size: $font__size-xs;
+		line-height: 1.6;
+		text-transform: none;
+	}
+
+	em {
+		font-style: normal;
+	}
+}
+
+.wp-block[data-type="core/pullquote"][data-align="left"],
+.wp-block[data-type="core/pullquote"][data-align="right"] {
+
+	.editor-block-list__block-edit {
+		width: calc(4 * (100vw / 12));
+		max-width: 50%;
+
+		.wp-block-pullquote:not(.is-style-solid-color) {
+			padding: 0;
+		}
+
+		.wp-block-pullquote.is-style-solid-color {
+			padding: 1em;
+		}
+	}
+
+	blockquote > .block-library-pullquote__content .editor-rich-text__tinymce[data-is-empty="true"]::before,
+	blockquote > .editor-rich-text p,
+	p,
+	.wp-block-pullquote__citation {
+		text-align: left;
+	}
+}
+
+.wp-block[data-type="core/pullquote"][data-align="full"] {
+
+	@include media(tablet) {
+
+		.wp-block-pullquote blockquote {
+			max-width: calc(80% - 128px);
+		}
+	}
+}
+
+
+/** === File === */
+
+.wp-block-file {
+	@include font-family( $font__heading );
+
+	.wp-block-file__textlink {
+		text-decoration: underline;
+		color: $color__link;
+
+		&:hover {
+			color: $color__link-hover;
+			text-decoration: none;
+		}
+	}
+
+	.wp-block-file__button {
+		display: table;
+		line-height: 1.8;
+		font-size: $font__size-sm;
+		font-weight: bold;
+		background-color: $color__link;
+		border-radius: 5px;
+	}
+
+	.wp-block-file__button-richtext-wrapper {
+		display: block;
+		margin-top: calc(0.75 * #{$size__spacing-unit});
+		margin-left: 0;
+	}
+
+}
+
+/** === Verse === */
+
+.wp-block-verse,
+.wp-block-verse pre {
+	padding: 0;
+}
+
+/** === Code === */
+
+.wp-block-code {
+	border-radius: 0;
+}
+
+/** === Table === */
+
+.wp-block-table {
+
+	td, th {
+		border-color: $color__text-light;
+	}
+}
+
+/** === Separator === */
+
+.wp-block-separator {
+
+	&:not(.is-style-dots) {
+		background-color: $color__text-light;
+		height: 2px;
+	}
+
+	&:not(.is-style-wide):not(.is-style-dots) {
+		width: $font__size-xl;
+		margin-left: 0;
+	}
+
+	&.is-style-dots {
+		color: $color__text-light;
+	}
+
+	&.is-style-dots:before {
+		font-size: $font__size-lg;
+		letter-spacing: calc(2 * #{$size__spacing-unit});
+		padding-left: calc(2 * #{$size__spacing-unit});
+	}
+}
+
+/* Remove duplicate rule-line when a separator
+ * is followed by an H1, or H2 */
+.wp-block[data-type="core/separator"] + .wp-block[data-type="core/heading"] h1:before,
+.wp-block[data-type="core/separator"] + .wp-block[data-type="core/heading"] h2:before {
+	display: none;
+}
+
+/** === Latest Posts, Archives, Categories === */
+
+ul.wp-block-archives,
+.wp-block-categories,
+.wp-block-latest-posts {
+	padding: 0;
+	list-style-type: none;
+
+	ul {
+		padding: 0;
+		list-style-type: none;
+	}
+
+	li {
+
+		> a {
+			@include font-family( $font__heading );
+			font-size: calc(#{$font__size_base} * #{$font__size-ratio});
+			font-weight: bold;
+			line-height: $font__line-height-heading;
+			text-decoration: none;
+		}
+
+		ul {
+			padding-left: $size__spacing-unit;
+		}
+	}
+}
+
+.wp-block-categories {
+
+	ul {
+		padding-top: ( .75 * $size__spacing-unit );
+		@include nestedSubMenuPadding();
+	}
+
+	li ul {
+		list-style: none;
+		padding-left: 0;
+		margin-bottom: ( -.75 * $size__spacing-unit );
+	}
+
+}
+
+/** === Latest Posts === */
+.wp-block-latest-posts {
+
+	.wp-block-latest-posts__post-date {
+		@include font-family( $font__heading );
+		font-size: $font__size-xs;
+		color: $color__text-light;
+		line-height: 1.2;
+	}
+
+	.wp-block-latest-posts__post-full-content,
+	.wp-block-latest-posts__post-excerpt {
+		margin-top: $font__size_base;
+		margin-bottom: $font__size_base;
+
+		> div > p:first-child {
+			margin-top: $font__size_base;
+		}
+	}
+
+	li {
+		padding-bottom: ( .5 * $size__spacing-unit );
+
+		&.menu-item-has-children,
+		&:last-child {
+			padding-bottom: 0;
+		}
+
+		:not(:last-child) .wp-block-latest-posts__post-excerpt {
+			padding-bottom: ( .5 * $size__spacing-unit );
+		}
+	}
+
+	&.is-grid {
+		li {
+			border-top: 2px solid $color__border;
+			padding-top: (1 * $size__spacing-unit);
+			margin-bottom: (2 * $size__spacing-unit);
+			a {
+				&:after {
+					content: '';
+				}
+			}
+			&:last-child {
+				margin-bottom: auto;
+				a:after {
+					content: '';
+				}
+			}
+		}
+	}
+}
+
+/** === Latest Comments === */
+
+.wp-block-latest-comments {
+
+	.wp-block-latest-comments__comment-meta {
+		@include font-family( $font__heading );
+		font-weight: bold;
+
+		.wp-block-latest-comments__comment-date {
+			font-weight: normal;
+		}
+	}
+
+	.wp-block-latest-comments__comment,
+	.wp-block-latest-comments__comment-date,
+	.wp-block-latest-comments__comment-excerpt p {
+		font-size: inherit;
+	}
+
+	.wp-block-latest-comments__comment-date {
+		font-size: $font__size-xs;
+	}
+}
+
+/** === Classic Editor === */
+
+/* Properly center-align captions in the classic-editor block */
+.wp-caption {
+	dd {
+		color: $color__text-light;
+ 		font-size: $font__size-xs;
+ 		@include font-family( $font__heading );
+ 		line-height: $font__line-height-pre;
+ 		margin: 0;
+ 		padding: ( $size__spacing-unit * .5 );
+ 		text-align: left;
+		text-align: center;
+		-webkit-margin-start: 0px;
+		margin-inline-start: 0px;
+	}
+}
+
+.wp-block-freeform {
+
+	/* Add style for galleries in classic-editor block */
+	blockquote {
+		border-left: 2px solid $color__link;
+
+		cite {
+			@include font-family( $font__heading );
+			font-size: $font__size-xs;
+			font-style: normal;
+			line-height: 1.6;
+			color: $color__text-light;
+		}
+	}
+}
+
+/** === Group Block === */
+
+// This matches the 22px value for 1rem that used on the front end.
+// It must be specified in pixels for the editor, since the root font 
+// size is different here. 
+$group-block-background__padding: $font__size_base;
+
+.wp-block[data-type="core/group"] {
+
+	// Group block base styles
+	> .editor-block-list__block-edit > div > .wp-block-group {
+
+		// Child: Full alignment
+		> .wp-block-group__inner-container > .editor-inner-blocks > .editor-block-list__layout > .wp-block[data-align="full"] {
+			left: 0;
+		}
+	}
+
+	// Group block with background color
+	> .editor-block-list__block-edit > div > .wp-block-group.has-background {
+		padding: $group-block-background__padding;
+
+		// Child: Full alignment
+		> .wp-block-group__inner-container > .editor-inner-blocks > .editor-block-list__layout > .wp-block[data-align="full"] {
+			margin-left: -$group-block-background__padding;
+			width: calc(100% + #{$group-block-background__padding * 2});
+			max-width: calc(100% + #{$group-block-background__padding * 2});
+		}
+	}
+
+	// Wide and full alignments
+	&[data-align="wide"] {
+
+		// Group block base styles.
+		> .editor-block-list__block-edit > div > .wp-block-group {
+
+			// Child blocks: Default alignments
+			> .wp-block-group__inner-container > .editor-inner-blocks > .editor-block-list__layout > .wp-block:not([data-align="wide"]):not([data-align="full"]) {
+				@include media(tablet) {
+					width: calc(8 * (100vw / 12));
+				}
+
+				@include media(desktop) {
+					width: calc(6 * (100vw / 12 ));
+				}
+			}
+		}
+
+		// Group block with background color
+		> .editor-block-list__block-edit > div > .wp-block-group.has-background {
+			
+			// Child blocks: Default alignments
+			> .wp-block-group__inner-container > .editor-inner-blocks > .editor-block-list__layout > .wp-block:not([data-align="wide"]):not([data-align="full"]) {
+				@include media(tablet) {
+					width: calc(8 * (100vw / 12) - #{$group-block-background__padding * 2});
+				}
+
+				@include media(desktop) {
+					width: calc(6 * (100vw / 12 ) - #{$group-block-background__padding * 2});
+				}
+			}
+		}
+	}
+
+	// Full alignment
+	&[data-align="full"] {
+
+		// Max-width needs to be a pixel narrower than usual to prevent horizontal scrolling.
+		@include media(mobile) {
+			max-width: calc(100% + 89px);
+		}
+		@include media(tablet) {
+			max-width: calc(125% + 114px);
+		}
+
+		// Group block base styles
+		> .editor-block-list__block-edit > div > .wp-block-group {
+
+			// Margins & padding are added to this container to mimic 
+			// the style + spacing of the .editor-writing-flow global 
+			// container. This way, child items sync up with the placement 
+			// and size of other top-level blocks. 
+			> .wp-block-group__inner-container > .editor-inner-blocks > .editor-block-list__layout {
+
+				@include media(mobile) {
+					padding-left: 46px;
+					padding-right: 46px;
+				}
+
+				// 2px of extra padding are added to each side here
+				// To better match up with the spacing of the whole 
+				// document. 
+				@include media(tablet) {
+					width: 80%;
+					margin-left: 10%;
+					margin-right: 10%;
+					padding-left: 48px;
+					padding-right: 48px; 
+				}
+
+				// Child blocks: All alignments except full
+				 > .wp-block:not([data-align="full"]) {
+					max-width: calc(100vw - (2 * 1rem));
+
+					@include media(tablet) {
+						max-width: calc(8 * (100vw / 12));
+					}
+
+					@include media(desktop) {
+						max-width: calc(6 * (100vw / 12));
+					}
+				}
+
+				// Child blocks: Right alignments
+				> .wp-block[data-align="right"] {
+
+					@include media(tablet) {
+						max-width: 125%;
+					}
+				}
+
+				// Child blocks: Wide alignments
+				> .wp-block[data-align="wide"] {
+
+					@include media(tablet) {
+						width: calc(100% + 4px);
+						max-width: calc(100% + 4px);
+					}
+				}
+
+				// Child blocks: Full alignments
+				> .wp-block[data-align=full] {
+					max-width: calc(100vw + (2 * 1rem));
+
+					@include media(mobile) {
+						width: calc(100% + 92px);
+						left: -46px;
+					}
+
+					@include media(tablet) {
+						left: calc(-12.5% - 58px);
+						width: calc(125% + 120px);
+						max-width: calc(125% + 119px);
+					}
+				}
+			}
+		}
+
+		// Group block with background color
+		> .editor-block-list__block-edit > div > .wp-block-group.has-background {
+
+			// When the Group block is full width, we can remove the left/right padding
+			// and let this inherit the 
+			padding: $group-block-background__padding 0;
+
+			@include media(mobile) {
+				padding-left: 0;
+				padding-right: 0;
+			}
+
+			// Child blocks: Full alignment
+			> .wp-block-group__inner-container > .editor-inner-blocks > .editor-block-list__layout > .wp-block[data-align="full"] {
+				margin-left: 0;
+				width: 100%;
+
+				@include media(mobile) {
+					width: calc(100% + 92px);
+				}
+
+				@include media(tablet) {
+					width: calc(125% + 120px);
+				}
+			}
+		}
+	}
+}

wp-content/themes/twentynineteen/template-parts/content/content-excerpt.php

@@ -0,0 +1,33 @@
+<?php
+/**
+ * Template part for displaying post archives and search results
+ *
+ * @link https://developer.wordpress.org/themes/basics/template-hierarchy/
+ *
+ * @package WordPress
+ * @subpackage Twenty_Nineteen
+ * @since 1.0.0
+ */
+
+?>
+
+<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
+	<header class="entry-header">
+		<?php
+		if ( is_sticky() && is_home() && ! is_paged() ) {
+			printf( '<span class="sticky-post">%s</span>', _x( 'Featured', 'post', 'twentynineteen' ) );
+		}
+		the_title( sprintf( '<h2 class="entry-title"><a href="%s" rel="bookmark">', esc_url( get_permalink() ) ), '</a></h2>' );
+		?>
+	</header><!-- .entry-header -->
+
+	<?php twentynineteen_post_thumbnail(); ?>
+
+	<div class="entry-content">
+		<?php the_excerpt(); ?>
+	</div><!-- .entry-content -->
+
+	<footer class="entry-footer">
+		<?php twentynineteen_entry_footer(); ?>
+	</footer><!-- .entry-footer -->
+</article><!-- #post-<?php the_ID(); ?> -->

wp-content/themes/twentynineteen/template-parts/content/content-none.php

@@ -0,0 +1,53 @@
+<?php
+/**
+ * Template part for displaying a message that posts cannot be found
+ *
+ * @link https://developer.wordpress.org/themes/basics/template-hierarchy/
+ *
+ * @package WordPress
+ * @subpackage Twenty_Nineteen
+ * @since 1.0.0
+ */
+
+?>
+
+<section class="no-results not-found">
+	<header class="page-header">
+		<h1 class="page-title"><?php _e( 'Nothing Found', 'twentynineteen' ); ?></h1>
+	</header><!-- .page-header -->
+
+	<div class="page-content">
+		<?php
+		if ( is_home() && current_user_can( 'publish_posts' ) ) :
+
+			printf(
+				'<p>' . wp_kses(
+					/* translators: 1: Link to WP admin new post page. */
+					__( 'Ready to publish your first post? <a href="%1$s">Get started here</a>.', 'twentynineteen' ),
+					array(
+						'a' => array(
+							'href' => array(),
+						),
+					)
+				) . '</p>',
+				esc_url( admin_url( 'post-new.php' ) )
+			);
+
+		elseif ( is_search() ) :
+			?>
+
+			<p><?php _e( 'Sorry, but nothing matched your search terms. Please try again with some different keywords.', 'twentynineteen' ); ?></p>
+			<?php
+			get_search_form();
+
+		else :
+			?>
+
+			<p><?php _e( 'It seems we can&rsquo;t find what you&rsquo;re looking for. Perhaps searching can help.', 'twentynineteen' ); ?></p>
+			<?php
+			get_search_form();
+
+		endif;
+		?>
+	</div><!-- .page-content -->
+</section><!-- .no-results -->

wp-content/themes/twentynineteen/template-parts/content/content-page.php

@@ -0,0 +1,56 @@
+<?php
+/**
+ * Template part for displaying page content in page.php
+ *
+ * @link https://developer.wordpress.org/themes/basics/template-hierarchy/
+ *
+ * @package WordPress
+ * @subpackage Twenty_Nineteen
+ * @since 1.0.0
+ */
+
+?>
+
+<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
+	<?php if ( ! twentynineteen_can_show_post_thumbnail() ) : ?>
+	<header class="entry-header">
+		<?php get_template_part( 'template-parts/header/entry', 'header' ); ?>
+	</header>
+	<?php endif; ?>
+
+	<div class="entry-content">
+		<?php
+		the_content();
+
+		wp_link_pages(
+			array(
+				'before' => '<div class="page-links">' . __( 'Pages:', 'twentynineteen' ),
+				'after'  => '</div>',
+			)
+		);
+		?>
+	</div><!-- .entry-content -->
+
+	<?php if ( get_edit_post_link() ) : ?>
+		<footer class="entry-footer">
+			<?php
+			edit_post_link(
+				sprintf(
+					wp_kses(
+						/* translators: %s: Post title. Only visible to screen readers. */
+						__( 'Edit <span class="screen-reader-text">%s</span>', 'twentynineteen' ),
+						array(
+							'span' => array(
+								'class' => array(),
+							),
+						)
+					),
+					get_the_title()
+				),
+				'<span class="edit-link">' . twentynineteen_get_icon_svg( 'edit', 16 ),
+				'</span>'
+			);
+			?>
+		</footer><!-- .entry-footer -->
+	<?php endif; ?>
+</article><!-- #post-<?php the_ID(); ?> -->

wp-content/themes/twentynineteen/template-parts/content/content-single.php

@@ -0,0 +1,55 @@
+<?php
+/**
+ * Template part for displaying posts
+ *
+ * @link https://developer.wordpress.org/themes/basics/template-hierarchy/
+ *
+ * @package WordPress
+ * @subpackage Twenty_Nineteen
+ * @since 1.0.0
+ */
+
+?>
+
+<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
+	<?php if ( ! twentynineteen_can_show_post_thumbnail() ) : ?>
+	<header class="entry-header">
+		<?php get_template_part( 'template-parts/header/entry', 'header' ); ?>
+	</header>
+	<?php endif; ?>
+
+	<div class="entry-content">
+		<?php
+		the_content(
+			sprintf(
+				wp_kses(
+					/* translators: %s: Post title. Only visible to screen readers. */
+					__( 'Continue reading<span class="screen-reader-text"> "%s"</span>', 'twentynineteen' ),
+					array(
+						'span' => array(
+							'class' => array(),
+						),
+					)
+				),
+				get_the_title()
+			)
+		);
+
+		wp_link_pages(
+			array(
+				'before' => '<div class="page-links">' . __( 'Pages:', 'twentynineteen' ),
+				'after'  => '</div>',
+			)
+		);
+		?>
+	</div><!-- .entry-content -->
+
+	<footer class="entry-footer">
+		<?php twentynineteen_entry_footer(); ?>
+	</footer><!-- .entry-footer -->
+
+	<?php if ( ! is_singular( 'attachment' ) ) : ?>
+		<?php get_template_part( 'template-parts/post/author', 'bio' ); ?>
+	<?php endif; ?>
+
+</article><!-- #post-<?php the_ID(); ?> -->

wp-content/themes/twentynineteen/template-parts/content/content.php

@@ -0,0 +1,59 @@
+<?php
+/**
+ * Template part for displaying posts
+ *
+ * @link https://developer.wordpress.org/themes/basics/template-hierarchy/
+ *
+ * @package WordPress
+ * @subpackage Twenty_Nineteen
+ * @since 1.0.0
+ */
+
+?>
+
+<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
+	<header class="entry-header">
+		<?php
+		if ( is_sticky() && is_home() && ! is_paged() ) {
+			printf( '<span class="sticky-post">%s</span>', _x( 'Featured', 'post', 'twentynineteen' ) );
+		}
+		if ( is_singular() ) :
+			the_title( '<h1 class="entry-title">', '</h1>' );
+		else :
+			the_title( sprintf( '<h2 class="entry-title"><a href="%s" rel="bookmark">', esc_url( get_permalink() ) ), '</a></h2>' );
+		endif;
+		?>
+	</header><!-- .entry-header -->
+
+	<?php twentynineteen_post_thumbnail(); ?>
+
+	<div class="entry-content">
+		<?php
+		the_content(
+			sprintf(
+				wp_kses(
+					/* translators: %s: Post title. Only visible to screen readers. */
+					__( 'Continue reading<span class="screen-reader-text"> "%s"</span>', 'twentynineteen' ),
+					array(
+						'span' => array(
+							'class' => array(),
+						),
+					)
+				),
+				get_the_title()
+			)
+		);
+
+		wp_link_pages(
+			array(
+				'before' => '<div class="page-links">' . __( 'Pages:', 'twentynineteen' ),
+				'after'  => '</div>',
+			)
+		);
+		?>
+	</div><!-- .entry-content -->
+
+	<footer class="entry-footer">
+		<?php twentynineteen_entry_footer(); ?>
+	</footer><!-- .entry-footer -->
+</article><!-- #post-<?php the_ID(); ?> -->

wp-content/themes/twentynineteen/template-parts/footer/footer-widgets.php

@@ -0,0 +1,24 @@
+<?php
+/**
+ * Displays the footer widget area
+ *
+ * @package WordPress
+ * @subpackage Twenty_Nineteen
+ * @since 1.0.0
+ */
+
+if ( is_active_sidebar( 'sidebar-1' ) ) : ?>
+
+	<aside class="widget-area" role="complementary" aria-label="<?php esc_attr_e( 'Footer', 'twentynineteen' ); ?>">
+		<?php
+		if ( is_active_sidebar( 'sidebar-1' ) ) {
+			?>
+					<div class="widget-column footer-widget-1">
+					<?php dynamic_sidebar( 'sidebar-1' ); ?>
+					</div>
+				<?php
+		}
+		?>
+	</aside><!-- .widget-area -->
+
+<?php endif; ?>

wp-content/themes/twentynineteen/template-parts/header/entry-header.php

@@ -0,0 +1,46 @@
+<?php
+/**
+ * Displays the post header
+ *
+ * @package WordPress
+ * @subpackage Twenty_Nineteen
+ * @since 1.0.0
+ */
+
+$discussion = ! is_page() && twentynineteen_can_show_post_thumbnail() ? twentynineteen_get_discussion_data() : null; ?>
+
+<?php the_title( '<h1 class="entry-title">', '</h1>' ); ?>
+
+<?php if ( ! is_page() ) : ?>
+<div class="entry-meta">
+	<?php twentynineteen_posted_by(); ?>
+	<?php twentynineteen_posted_on(); ?>
+	<span class="comment-count">
+		<?php
+		if ( ! empty( $discussion ) ) {
+			twentynineteen_discussion_avatars_list( $discussion->authors );
+		}
+		?>
+		<?php twentynineteen_comment_count(); ?>
+	</span>
+	<?php
+	// Edit post link.
+		edit_post_link(
+			sprintf(
+				wp_kses(
+					/* translators: %s: Post title. Only visible to screen readers. */
+					__( 'Edit <span class="screen-reader-text">%s</span>', 'twentynineteen' ),
+					array(
+						'span' => array(
+							'class' => array(),
+						),
+					)
+				),
+				get_the_title()
+			),
+			'<span class="edit-link">' . twentynineteen_get_icon_svg( 'edit', 16 ),
+			'</span>'
+		);
+	?>
+</div><!-- .entry-meta -->
+<?php endif; ?>

wp-content/themes/twentynineteen/template-parts/header/site-branding.php

@@ -0,0 +1,60 @@
+<?php
+/**
+ * Displays header site branding
+ *
+ * @package WordPress
+ * @subpackage Twenty_Nineteen
+ * @since 1.0.0
+ */
+?>
+<div class="site-branding">
+
+	<?php if ( has_custom_logo() ) : ?>
+		<div class="site-logo"><?php the_custom_logo(); ?></div>
+	<?php endif; ?>
+	<?php $blog_info = get_bloginfo( 'name' ); ?>
+	<?php if ( ! empty( $blog_info ) ) : ?>
+		<?php if ( is_front_page() && is_home() ) : ?>
+			<h1 class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></h1>
+		<?php else : ?>
+			<p class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></p>
+		<?php endif; ?>
+	<?php endif; ?>
+
+	<?php
+	$description = get_bloginfo( 'description', 'display' );
+	if ( $description || is_customize_preview() ) :
+		?>
+			<p class="site-description">
+				<?php echo $description; ?>
+			</p>
+	<?php endif; ?>
+	<?php if ( has_nav_menu( 'menu-1' ) ) : ?>
+		<nav id="site-navigation" class="main-navigation" aria-label="<?php esc_attr_e( 'Top Menu', 'twentynineteen' ); ?>">
+			<?php
+			wp_nav_menu(
+				array(
+					'theme_location' => 'menu-1',
+					'menu_class'     => 'main-menu',
+					'items_wrap'     => '<ul id="%1$s" class="%2$s">%3$s</ul>',
+				)
+			);
+			?>
+		</nav><!-- #site-navigation -->
+	<?php endif; ?>
+	<?php if ( has_nav_menu( 'social' ) ) : ?>
+		<nav class="social-navigation" aria-label="<?php esc_attr_e( 'Social Links Menu', 'twentynineteen' ); ?>">
+			<?php
+			wp_nav_menu(
+				array(
+					'theme_location' => 'social',
+					'menu_class'     => 'social-links-menu',
+					'link_before'    => '<span class="screen-reader-text">',
+					'link_after'     => '</span>' . twentynineteen_get_icon_svg( 'link' ),
+					'depth'          => 1,
+				)
+			);
+			?>
+		</nav><!-- .social-navigation -->
+	<?php endif; ?>
+</div><!-- .site-branding -->

wp-content/themes/twentynineteen/template-parts/post/author-bio.php

@@ -0,0 +1,30 @@
+<?php
+/**
+ * The template for displaying Author info
+ *
+ * @package WordPress
+ * @subpackage Twenty_Nineteen
+ * @since 1.0.0
+ */
+
+if ( (bool) get_the_author_meta( 'description' ) ) : ?>
+<div class="author-bio">
+	<h2 class="author-title">
+		<span class="author-heading">
+			<?php
+			printf(
+				/* translators: %s: Post author. */
+				__( 'Published by %s', 'twentynineteen' ),
+				esc_html( get_the_author() )
+			);
+			?>
+		</span>
+	</h2>
+	<p class="author-description">
+		<?php the_author_meta( 'description' ); ?>
+		<a class="author-link" href="<?php echo esc_url( get_author_posts_url( get_the_author_meta( 'ID' ) ) ); ?>" rel="author">
+			<?php _e( 'View more posts', 'twentynineteen' ); ?>
+		</a>
+	</p><!-- .author-description -->
+</div><!-- .author-bio -->
+<?php endif; ?>

wp-content/themes/twentynineteen/template-parts/post/discussion-meta.php

@@ -0,0 +1,32 @@
+<?php
+/**
+ * The template for displaying Current Discussion on posts
+ *
+ * @package WordPress
+ * @subpackage Twenty_Nineteen
+ * @since 1.0.0
+ */
+
+/* Get data from current discussion on post. */
+$discussion    = twentynineteen_get_discussion_data();
+$has_responses = $discussion->responses > 0;
+
+if ( $has_responses ) {
+	/* translators: %d: Number of comments. */
+	$meta_label = sprintf( _n( '%d Comment', '%d Comments', $discussion->responses, 'twentynineteen' ), $discussion->responses );
+} else {
+	$meta_label = __( 'No comments', 'twentynineteen' );
+}
+?>
+
+<div class="discussion-meta">
+	<?php
+	if ( $has_responses ) {
+		twentynineteen_discussion_avatars_list( $discussion->authors );
+	}
+	?>
+	<p class="discussion-meta-info">
+		<?php echo twentynineteen_get_icon_svg( 'comment', 24 ); ?>
+		<span><?php echo esc_html( $meta_label ); ?></span>
+	</p>
+</div><!-- .discussion-meta -->

wp-content/themes/twentyseventeen/404.php

@@ -0,0 +1,35 @@
+<?php
+/**
+ * The template for displaying 404 pages (not found)
+ *
+ * @link https://codex.wordpress.org/Creating_an_Error_404_Page
+ *
+ * @package WordPress
+ * @subpackage Twenty_Seventeen
+ * @since 1.0
+ * @version 1.0
+ */
+
+get_header(); ?>
+
+<div class="wrap">
+	<div id="primary" class="content-area">
+		<main id="main" class="site-main" role="main">
+
+			<section class="error-404 not-found">
+				<header class="page-header">
+					<h1 class="page-title"><?php _e( 'Oops! That page can&rsquo;t be found.', 'twentyseventeen' ); ?></h1>
+				</header><!-- .page-header -->
+				<div class="page-content">
+					<p><?php _e( 'It looks like nothing was found at this location. Maybe try a search?', 'twentyseventeen' ); ?></p>
+
+					<?php get_search_form(); ?>
+
+				</div><!-- .page-content -->
+			</section><!-- .error-404 -->
+		</main><!-- #main -->
+	</div><!-- #primary -->
+</div><!-- .wrap -->
+
+<?php
+get_footer();

wp-content/themes/twentyseventeen/archive.php

@@ -0,0 +1,67 @@
+<?php
+/**
+ * The template for displaying archive pages
+ *
+ * @link https://developer.wordpress.org/themes/basics/template-hierarchy/
+ *
+ * @package WordPress
+ * @subpackage Twenty_Seventeen
+ * @since 1.0
+ * @version 1.0
+ */
+
+get_header(); ?>
+
+<div class="wrap">
+
+	<?php if ( have_posts() ) : ?>
+		<header class="page-header">
+			<?php
+				the_archive_title( '<h1 class="page-title">', '</h1>' );
+				the_archive_description( '<div class="taxonomy-description">', '</div>' );
+			?>
+		</header><!-- .page-header -->
+	<?php endif; ?>
+
+	<div id="primary" class="content-area">
+		<main id="main" class="site-main" role="main">
+
+		<?php
+		if ( have_posts() ) :
+			?>
+			<?php
+			/* Start the Loop */
+			while ( have_posts() ) :
+				the_post();
+
+				/*
+				 * Include the Post-Format-specific template for the content.
+				 * If you want to override this in a child theme, then include a file
+				 * called content-___.php (where ___ is the Post Format name) and that will be used instead.
+				 */
+				get_template_part( 'template-parts/post/content', get_post_format() );
+
+			endwhile;
+
+			the_posts_pagination(
+				array(
+					'prev_text'          => twentyseventeen_get_svg( array( 'icon' => 'arrow-left' ) ) . '<span class="screen-reader-text">' . __( 'Previous page', 'twentyseventeen' ) . '</span>',
+					'next_text'          => '<span class="screen-reader-text">' . __( 'Next page', 'twentyseventeen' ) . '</span>' . twentyseventeen_get_svg( array( 'icon' => 'arrow-right' ) ),
+					'before_page_number' => '<span class="meta-nav screen-reader-text">' . __( 'Page', 'twentyseventeen' ) . ' </span>',
+				)
+			);
+
+		else :
+
+			get_template_part( 'template-parts/post/content', 'none' );
+
+		endif;
+		?>
+
+		</main><!-- #main -->
+	</div><!-- #primary -->
+	<?php get_sidebar(); ?>
+</div><!-- .wrap -->
+
+<?php
+get_footer();

wp-content/themes/twentyseventeen/assets/css/blocks.css

@@ -0,0 +1,451 @@
+/*
+Theme Name: Twenty Seventeen
+Description: Used to style blocks.
+*/
+
+/*--------------------------------------------------------------
+>>> TABLE OF CONTENTS:
+----------------------------------------------------------------
+1.0 General Block Styles
+2.0 Blocks - Common Blocks
+3.0 Blocks - Formatting
+4.0 Blocks - Layout Elements
+5.0 Blocks - Widgets
+6.0 Blocks - Colors
+--------------------------------------------------------------*/
+
+/*--------------------------------------------------------------
+1.0 General Block Styles
+--------------------------------------------------------------*/
+
+/* Captions */
+
+[class^="wp-block-"]:not(.wp-block-gallery) figcaption {
+	font-style: italic;
+	margin-bottom: 1.5em;
+	text-align: left;
+}
+
+.rtl [class^="wp-block-"]:not(.wp-block-gallery) figcaption {
+	text-align: right;
+}
+
+/*--------------------------------------------------------------
+2.0 Blocks - Common Blocks
+--------------------------------------------------------------*/
+
+/* Paragraph */
+
+p.has-drop-cap:not(:focus)::first-letter {
+	font-size: 5em;
+	margin-top: 0.075em;
+}
+
+/* Image */
+
+.wp-block-image {
+	margin-bottom: 1.5em;
+}
+
+.wp-block-image figure {
+	margin-bottom: 0;
+	margin-top: 0;
+}
+
+.wp-block-image figure.alignleft {
+	margin-right: 1.5em;
+}
+
+.wp-block-image figure.alignright {
+	margin-left: 1.5em;
+}
+
+/* Gallery */
+
+.wp-block-gallery {
+	margin-bottom: 1.5em;
+}
+
+.wp-block-gallery figcaption {
+	font-style: italic;
+}
+
+.wp-block-gallery.aligncenter {
+	display: flex;
+	margin: 0 -8px;
+}
+
+/* Quote */
+
+.wp-block-quote:not(.is-large):not(.is-style-large) {
+	border: 0;
+	padding: 0;
+}
+
+.wp-block-quote.alignleft p:last-of-type,
+.wp-block-quote.alignright p:last-of-type {
+	margin-bottom: 0;
+}
+
+.wp-block-quote cite {
+	color: inherit;
+	font-size: inherit;
+}
+
+/* Audio */
+
+.wp-block-audio audio {
+	display: block;
+	width: 100%;
+}
+
+/* Cover */
+
+.wp-block-cover-image.alignright,
+.wp-block-cover.alignright,
+.wp-block-cover-image.alignleft,
+.wp-block-cover.alignleft,
+.wp-block-cover-image.aligncenter,
+.wp-block-cover.aligncenter {
+	display: flex;
+}
+
+/* File */
+
+.wp-block-file .wp-block-file__button {
+	background-color: #222;
+	-webkit-border-radius: 2px;
+	border-radius: 2px;
+	-webkit-box-shadow: none;
+	box-shadow: none;
+	color: #fff;
+	display: inline-block;
+	font-size: 14px;
+	font-size: 0.875rem;
+	font-weight: 800;
+	margin-top: 2em;
+	padding: 0.7em 2em;
+	-webkit-transition: background-color 0.2s ease-in-out;
+	transition: background-color 0.2s ease-in-out;
+	white-space: nowrap;
+}
+
+.wp-block-file .wp-block-file__button:hover,
+.wp-block-file .wp-block-file__button:focus {
+	background-color: #767676;
+	-webkit-box-shadow: none;
+	box-shadow: none;
+}
+
+/*--------------------------------------------------------------
+3.0 Blocks - Formatting
+--------------------------------------------------------------*/
+
+/* Code */
+
+.wp-block-code {
+	background: transparent;
+	border: 0;
+	padding: 0;
+}
+
+/* Pullquote */
+
+.wp-block-pullquote {
+	border: 0;
+}
+
+.wp-block-pullquote__citation,
+.wp-block-pullquote cite {
+	font-size: inherit;
+	text-transform: none;
+}
+
+/* Table */
+
+.wp-block-table thead th {
+	border-bottom: 2px solid #bbb;
+	padding-bottom: 0.5em;
+}
+
+.wp-block-table tr {
+	border-bottom: 1px solid #eee;
+}
+
+.wp-block-table th,
+.wp-block-table td {
+	border: 0;
+}
+
+.rtl .wp-block-table th,
+.rtl .wp-block-table td {
+	text-align: right;
+}
+
+/*--------------------------------------------------------------
+4.0 Blocks - Layout Elements
+--------------------------------------------------------------*/
+
+/* Buttons */
+
+.wp-block-button .wp-block-button__link {
+	-webkit-box-shadow: none;
+	box-shadow: none;
+	display: inline-block;
+	font-size: 14px;
+	font-size: 0.875rem;
+	font-weight: 800;
+	line-height: 1.66;
+	margin-top: 2em;
+	padding: 0.7em 2em;
+	-webkit-transition: background-color 0.2s ease-in-out;
+	transition: background-color 0.2s ease-in-out;
+	white-space: nowrap;
+}
+
+.entry-content .wp-block-button__link {
+	background-color: #222;
+	color: #fff;
+}
+
+.entry-content .is-style-outline .wp-block-button__link:not(.has-background) {
+	background-color: transparent;
+}
+
+.entry-content .is-style-outline .wp-block-button__link:not(.has-text-color) {
+	color: #222;
+}
+
+.colors-dark .wp-block-button__link {
+	background-color: #fff;
+	color: #000;
+}
+
+.entry-content .wp-block-button__link:hover,
+.entry-content .wp-block-button__link:focus,
+.entry-content .is-style-outline .wp-block-button__link:not(.has-background):hover,
+.entry-content .is-style-outline .wp-block-button__link:not(.has-background):focus {
+	background-color: #767676;
+	-webkit-box-shadow: none;
+	box-shadow: none;
+	color: #fff;
+}
+
+.colors-dark .entry-content .wp-block-button__link:hover,
+.colors-dark .entry-content .wp-block-button__link:focus,
+.colors-dark .entry-content .is-style-outline .wp-block-button__link:not(.has-background):hover,
+.colors-dark .entry-content .is-style-outline .wp-block-button__link:not(.has-background):focus {
+	background-color: #bbb;
+	color: #000;
+}
+
+.colors-dark .entry-content .is-style-outline .wp-block-button__link:not(.has-text-color) {
+	color: #fff;
+}
+
+.colors-dark .entry-content .is-style-outline .wp-block-button__link:not(.has-text-color):hover,
+.colors-dark .entry-content .is-style-outline .wp-block-button__link:not(.has-text-color):focus {
+	color: #222;
+}
+
+.colors-custom .entry-content .wp-block-button__link,
+.colors-custom .entry-content .wp-block-button__link:hover,
+.colors-custom .entry-content .wp-block-button__link:focus,
+.colors-dark .entry-content .wp-block-button__link,
+.colors-dark .entry-content .wp-block-button__link:hover,
+.colors-dark .entry-content .wp-block-button__link:focus {
+	-webkit-box-shadow: none;
+	box-shadow: none;
+}
+
+.colors-custom .entry-content .wp-block-button__link:hover,
+.colors-custom .entry-content .wp-block-button__link:focus {
+	color: #fff;
+}
+
+/* Separator */
+
+.wp-block-separator {
+	border: 0;
+}
+
+.wp-block-separator:not(.is-style-wide):not(.is-style-dots) {
+	max-width: 100px;
+}
+
+/* Media & Text */
+
+.wp-block-media-text {
+	margin-bottom: 1.5em;
+}
+
+.wp-block-media-text *:last-child {
+	margin-bottom: 0;
+}
+
+/*--------------------------------------------------------------
+5.0 Blocks - Widgets
+--------------------------------------------------------------*/
+
+/* Archives, Categories & Latest Posts */
+
+.wp-block-archives.aligncenter,
+.wp-block-categories.aligncenter,
+.wp-block-latest-posts.aligncenter {
+	list-style-position: inside;
+	text-align: center;
+}
+
+/* Comments */
+
+.wp-block-latest-comments article {
+	margin-bottom: 4em;
+}
+
+.blog:not(.has-sidebar) #primary .wp-block-latest-comments article,
+.archive:not(.page-one-column):not(.has-sidebar) #primary .wp-block-latest-comments article,
+.search:not(.has-sidebar) #primary .wp-block-latest-comments article {
+	float: none;
+	width: 100%;
+}
+
+.wp-block-latest-comments .avatar,
+.wp-block-latest-comments__comment-avatar {
+	border-radius: 0;
+}
+
+.wp-block-latest-comments a {
+	-webkit-box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 1);
+	box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 1);
+
+}
+
+.wp-block-latest-comments__comment-meta {
+	font-size: 16px;
+	font-size: 1rem;
+	margin-bottom: 0.4em;
+}
+
+.wp-block-latest-comments__comment-author,
+.wp-block-latest-comments__comment-link {
+	font-weight: 700;
+	text-decoration: none;
+}
+
+.wp-block-latest-comments__comment-date {
+	color: #767676;
+	font-size: 10px;
+	font-size: 0.625rem;
+	font-weight: 800;
+	letter-spacing: 0.1818em;
+	margin-top: 0.4em;
+	text-transform: uppercase;
+}
+
+.editor-block-list__block .wp-block-latest-comments__comment-excerpt p {
+	font-size: 14px;
+	font-size: 0.875rem;
+}
+
+/*--------------------------------------------------------------
+6.0 Blocks - Colors
+--------------------------------------------------------------*/
+
+.entry-content .has-pale-pink-color {
+	color: #f78da7;
+}
+
+.entry-content .has-pale-pink-background-color,
+.wp-block-button.is-style-outline .has-pale-pink-background-color:link {
+	background-color: #f78da7;
+}
+
+.entry-content .has-vivid-red-color {
+	color: #cf2e2e;
+}
+
+.entry-content .has-vivid-red-background-color,
+.wp-block-button.is-style-outline .has-vivid-red-background-color:link {
+	background-color: #cf2e2e;
+}
+
+.entry-content .has-luminous-vivid-orange-color {
+	color: #ff6900;
+}
+
+.entry-content .has-luminous-vivid-orange-background-color,
+.wp-block-button.is-style-outline .has-luminous-vivid-orange-background-color:link {
+	background-color: #ff6900;
+}
+
+.entry-content .has-luminous-vivid-amber-color {
+	color: #fcb900;
+}
+
+.entry-content .has-luminous-vivid-amber-background-color,
+.wp-block-button.is-style-outline .has-luminous-vivid-amber-background-color:link {
+	background-color: #fcb900;
+}
+
+.entry-content .has-light-green-cyan-color {
+	color: #7bdcb5;
+}
+
+.entry-content .has-light-green-cyan-background-color,
+.wp-block-button.is-style-outline .has-light-green-cyan-background-color:link {
+	background-color: #7bdcb5;
+}
+
+.entry-content .has-vivid-green-cyan-color {
+	color: #00d084;
+}
+
+.entry-content .has-vivid-green-cyan-background-color,
+.wp-block-button.is-style-outline .has-vivid-green-cyan-background-color:link {
+	background-color: #00d084;
+}
+
+.entry-content .has-pale-cyan-blue-color {
+	color: #8ed1fc;
+}
+
+.entry-content .has-pale-cyan-blue-background-color,
+.wp-block-button.is-style-outline .has-pale-cyan-blue-background-color:link {
+	background-color: #8ed1fc;
+}
+
+.entry-content .has-vivid-cyan-blue-color {
+	color: #0693e3;
+}
+
+.entry-content .has-vivid-cyan-blue-background-color,
+.wp-block-button.is-style-outline .has-vivid-cyan-blue-background-color:link {
+	background-color: #0693e3;
+}
+
+.entry-content .has-very-light-gray-color {
+	color: #eee;
+}
+
+.entry-content .has-very-light-gray-background-color,
+.wp-block-button.is-style-outline .has-very-light-gray-background-color:link {
+	background-color: #eee;
+}
+
+.entry-content .has-cyan-bluish-gray-color {
+	color: #abb8c3;
+}
+
+.entry-content .has-cyan-bluish-gray-background-color,
+.wp-block-button.is-style-outline .has-cyan-bluish-gray-background-color:link {
+	background-color: #abb8c3;
+}
+
+.entry-content .has-very-dark-gray-color {
+	color: #313131;
+}
+
+.entry-content .has-very-dark-gray-background-color,
+.wp-block-button.is-style-outline .has-very-dark-gray-background-color:link {
+	background-color: #313131;
+}

wp-content/themes/twentyseventeen/assets/css/colors-dark.css

@@ -0,0 +1,566 @@
+/**
+ * Twenty Seventeen: Dark Color Scheme
+ *
+ * See inc/color-patterns.php for dynamic color overrides for the theme.
+ *
+ * Colors are ordered from light to dark.
+ */
+
+.colors-dark button,
+.colors-dark input[type="button"],
+.colors-dark input[type="submit"],
+.colors-dark .entry-footer .edit-link a.post-edit-link {
+	background-color: #fff;
+}
+
+.colors-dark a:hover,
+.colors-dark a:active,
+.colors-dark .entry-content a:focus,
+.colors-dark .entry-content a:hover,
+.colors-dark .entry-summary a:focus,
+.colors-dark .entry-summary a:hover,
+.colors-dark .comment-content a:focus,
+.colors-dark .comment-content a:hover,
+.colors-dark .widget a:focus,
+.colors-dark .widget a:hover,
+.colors-dark .site-footer .widget-area a:focus,
+.colors-dark .site-footer .widget-area a:hover,
+.colors-dark .posts-navigation a:focus,
+.colors-dark .posts-navigation a:hover,
+.colors-dark .comment-metadata a:focus,
+.colors-dark .comment-metadata a:hover,
+.colors-dark .comment-metadata a.comment-edit-link:focus,
+.colors-dark .comment-metadata a.comment-edit-link:hover,
+.colors-dark .comment-reply-link:focus,
+.colors-dark .comment-reply-link:hover,
+.colors-dark .widget_authors a:focus strong,
+.colors-dark .widget_authors a:hover strong,
+.colors-dark .entry-title a:focus,
+.colors-dark .entry-title a:hover,
+.colors-dark .entry-meta a:focus,
+.colors-dark .entry-meta a:hover,
+.colors-dark.blog .entry-meta a.post-edit-link:focus,
+.colors-dark.blog .entry-meta a.post-edit-link:hover,
+.colors-dark.archive .entry-meta a.post-edit-link:focus,
+.colors-dark.archive .entry-meta a.post-edit-link:hover,
+.colors-dark.search .entry-meta a.post-edit-link:focus,
+.colors-dark.search .entry-meta a.post-edit-link:hover,
+.colors-dark .page-links a:focus .page-number,
+.colors-dark .page-links a:hover .page-number,
+.colors-dark .entry-footer .cat-links a:focus,
+.colors-dark .entry-footer .cat-links a:hover,
+.colors-dark .entry-footer .tags-links a:focus,
+.colors-dark .entry-footer .tags-links a:hover,
+.colors-dark .post-navigation a:focus,
+.colors-dark .post-navigation a:hover,
+.colors-dark .pagination a:not(.prev):not(.next):focus,
+.colors-dark .pagination a:not(.prev):not(.next):hover,
+.colors-dark .comments-pagination a:not(.prev):not(.next):focus,
+.colors-dark .comments-pagination a:not(.prev):not(.next):hover,
+.colors-dark .logged-in-as a:focus,
+.colors-dark .logged-in-as a:hover,
+.colors-dark a:focus .nav-title,
+.colors-dark a:hover .nav-title,
+.colors-dark .edit-link a:focus,
+.colors-dark .edit-link a:hover,
+.colors-dark .site-info a:focus,
+.colors-dark .site-info a:hover,
+.colors-dark .widget .widget-title a:focus,
+.colors-dark .widget .widget-title a:hover,
+.colors-dark .widget ul li a:focus,
+.colors-dark .widget ul li a:hover {
+	color: #fff;
+}
+
+.colors-dark .entry-content a:focus,
+.colors-dark .entry-content a:hover,
+.colors-dark .entry-summary a:focus,
+.colors-dark .entry-summary a:hover,
+.colors-dark .comment-content a:focus,
+.colors-dark .comment-content a:hover,
+.colors-dark .widget a:focus,
+.colors-dark .widget a:hover,
+.colors-dark .site-footer .widget-area a:focus,
+.colors-dark .site-footer .widget-area a:hover,
+.colors-dark .posts-navigation a:focus,
+.colors-dark .posts-navigation a:hover,
+.colors-dark .comment-metadata a:focus,
+.colors-dark .comment-metadata a:hover,
+.colors-dark .comment-metadata a.comment-edit-link:focus,
+.colors-dark .comment-metadata a.comment-edit-link:hover,
+.colors-dark .comment-reply-link:focus,
+.colors-dark .comment-reply-link:hover,
+.colors-dark .widget_authors a:focus strong,
+.colors-dark .widget_authors a:hover strong,
+.colors-dark .entry-title a:focus,
+.colors-dark .entry-title a:hover,
+.colors-dark .entry-meta a:focus,
+.colors-dark .entry-meta a:hover,
+.colors-dark.blog .entry-meta a.post-edit-link:focus,
+.colors-dark.blog .entry-meta a.post-edit-link:hover,
+.colors-dark.archive .entry-meta a.post-edit-link:focus,
+.colors-dark.archive .entry-meta a.post-edit-link:hover,
+.colors-dark.search .entry-meta a.post-edit-link:focus,
+.colors-dark.search .entry-meta a.post-edit-link:hover,
+.colors-dark .page-links a:focus .page-number,
+.colors-dark .page-links a:hover .page-number,
+.colors-dark .entry-footer .cat-links a:focus,
+.colors-dark .entry-footer .cat-links a:hover,
+.colors-dark .entry-footer .tags-links a:focus,
+.colors-dark .entry-footer .tags-links a:hover,
+.colors-dark .post-navigation a:focus,
+.colors-dark .post-navigation a:hover,
+.colors-dark .pagination a:not(.prev):not(.next):focus,
+.colors-dark .pagination a:not(.prev):not(.next):hover,
+.colors-dark .comments-pagination a:not(.prev):not(.next):focus,
+.colors-dark .comments-pagination a:not(.prev):not(.next):hover,
+.colors-dark .logged-in-as a:focus,
+.colors-dark .logged-in-as a:hover,
+.colors-dark a:focus .nav-title,
+.colors-dark a:hover .nav-title,
+.colors-dark .edit-link a:focus,
+.colors-dark .edit-link a:hover,
+.colors-dark .site-info a:focus,
+.colors-dark .site-info a:hover,
+.colors-dark .widget .widget-title a:focus,
+.colors-dark .widget .widget-title a:hover,
+.colors-dark .widget ul li a:focus,
+.colors-dark .widget ul li a:hover {
+	-webkit-box-shadow: inset 0 0 0 rgba(255, 255, 255, 0), 0 3px 0 rgba(255, 255, 255, 1); /* Equivalant to #fff */
+	box-shadow: inset 0 0 0 rgba(255, 255, 255, 0), 0 3px 0 rgba(255, 255, 255, 1); /* Equivalant to #fff */
+}
+
+.colors-dark .entry-content a,
+.colors-dark .entry-summary a,
+.colors-dark .comment-content a,
+.colors-dark .widget a,
+.colors-dark .site-footer .widget-area a,
+.colors-dark .posts-navigation a,
+.colors-dark .widget_authors a strong {
+	-webkit-box-shadow: inset 0 -1px 0 rgba(240, 240, 240, 1); /* Equivalant to #f0f0f0 */
+	box-shadow: inset 0 -1px 0 rgba(240, 240, 240, 1); /* Equivalant to #f0f0f0 */
+}
+
+body.colors-dark,
+.colors-dark button,
+.colors-dark input,
+.colors-dark select,
+.colors-dark textarea,
+.colors-dark h3,
+.colors-dark h4,
+.colors-dark h6,
+.colors-dark label,
+.colors-dark .entry-title a,
+.colors-dark.twentyseventeen-front-page .panel-content .recent-posts article,
+.colors-dark .entry-footer .cat-links a,
+.colors-dark .entry-footer .tags-links a,
+.colors-dark .format-quote blockquote,
+.colors-dark .nav-title,
+.colors-dark .comment-body {
+	color: #eee;
+}
+
+/* Placeholder text color -- selectors need to be separate to work. */
+.colors-dark ::-webkit-input-placeholder {
+	color: #ddd;
+}
+
+.colors-dark :-moz-placeholder {
+	color: #ddd;
+}
+
+.colors-dark ::-moz-placeholder {
+	color: #ddd;
+}
+
+.colors-dark :-ms-input-placeholder {
+	color: #ddd;
+}
+
+.colors-dark input[type="text"]:focus,
+.colors-dark input[type="email"]:focus,
+.colors-dark input[type="url"]:focus,
+.colors-dark input[type="password"]:focus,
+.colors-dark input[type="search"]:focus,
+.colors-dark input[type="number"]:focus,
+.colors-dark input[type="tel"]:focus,
+.colors-dark input[type="range"]:focus,
+.colors-dark input[type="date"]:focus,
+.colors-dark input[type="month"]:focus,
+.colors-dark input[type="week"]:focus,
+.colors-dark input[type="time"]:focus,
+.colors-dark input[type="datetime"]:focus,
+.colors-dark input[type="datetime-local"]:focus,
+.colors-dark input[type="color"]:focus,
+.colors-dark textarea:focus,
+.bypostauthor > .comment-body > .comment-meta > .comment-author .avatar {
+	border-color: #eee;
+}
+
+.colors-dark input[type="text"]:focus,
+.colors-dark input[type="email"]:focus,
+.colors-dark input[type="url"]:focus,
+.colors-dark input[type="password"]:focus,
+.colors-dark input[type="search"]:focus,
+.colors-dark input[type="number"]:focus,
+.colors-dark input[type="tel"]:focus,
+.colors-dark input[type="range"]:focus,
+.colors-dark input[type="date"]:focus,
+.colors-dark input[type="month"]:focus,
+.colors-dark input[type="week"]:focus,
+.colors-dark input[type="time"]:focus,
+.colors-dark input[type="datetime"]:focus,
+.colors-dark input[type="datetime-local"]:focus,
+.colors-dark input[type="color"]:focus,
+.colors-dark textarea:focus,
+.colors-dark button.secondary,
+.colors-dark input[type="reset"],
+.colors-dark input[type="button"].secondary,
+.colors-dark input[type="reset"].secondary,
+.colors-dark input[type="submit"].secondary,
+.colors-dark a,
+.colors-dark .site-title,
+.colors-dark .site-title a,
+.colors-dark .navigation-top a,
+.colors-dark .dropdown-toggle,
+.colors-dark .menu-toggle,
+.colors-dark .page .panel-content .entry-title,
+.colors-dark .page-title,
+.colors-dark.page:not(.twentyseventeen-front-page) .entry-title,
+.colors-dark .page-links a .page-number,
+.colors-dark .comment-metadata a.comment-edit-link,
+.colors-dark .comment-reply-link .icon,
+.colors-dark h2.widget-title,
+.colors-dark mark,
+.colors-dark .post-navigation a:focus .icon,
+.colors-dark .post-navigation a:hover .icon,
+.colors-dark.blog .entry-meta a.post-edit-link,
+.colors-dark.archive .entry-meta a.post-edit-link,
+.colors-dark.search .entry-meta a.post-edit-link,
+.colors-custom .twentyseventeen-panel .recent-posts .entry-header .edit-link {
+	color: #ddd;
+}
+
+.colors-dark h2,
+.colors-dark blockquote,
+.colors-dark input[type="text"],
+.colors-dark input[type="email"],
+.colors-dark input[type="url"],
+.colors-dark input[type="password"],
+.colors-dark input[type="search"],
+.colors-dark input[type="number"],
+.colors-dark input[type="tel"],
+.colors-dark input[type="range"],
+.colors-dark input[type="date"],
+.colors-dark input[type="month"],
+.colors-dark input[type="week"],
+.colors-dark input[type="time"],
+.colors-dark input[type="datetime"],
+.colors-dark input[type="datetime-local"],
+.colors-dark input[type="color"],
+.colors-dark textarea,
+.colors-dark .navigation-top .current-menu-item > a,
+.colors-dark .navigation-top .current_page_item > a,
+.colors-dark .entry-content blockquote.alignleft,
+.colors-dark .entry-content blockquote.alignright,
+.colors-dark .taxonomy-description,
+.colors-dark .site-info a,
+.colors-dark .wp-caption {
+	color: #ccc;
+}
+
+.colors-dark abbr,
+.colors-dark acronym {
+	border-bottom-color: #ccc;
+}
+
+.colors-dark h5,
+.main-navigation a:hover,
+.colors-dark .entry-meta,
+.colors-dark .entry-meta a,
+.colors-dark .nav-subtitle,
+.colors-dark .comment-metadata,
+.colors-dark .comment-metadata a,
+.colors-dark .no-comments,
+.colors-dark .comment-awaiting-moderation,
+.colors-dark .page-numbers.current,
+.colors-dark .page-links .page-number,
+.colors-dark .site-description {
+	color: #bbb;
+}
+
+.colors-dark :not( .mejs-button ) > button:hover,
+.colors-dark :not( .mejs-button ) > button:focus,
+.colors-dark input[type="button"]:hover,
+.colors-dark input[type="button"]:focus,
+.colors-dark input[type="submit"]:hover,
+.colors-dark input[type="submit"]:focus,
+.colors-dark .prev.page-numbers:focus,
+.colors-dark .prev.page-numbers:hover,
+.colors-dark .next.page-numbers:focus,
+.colors-dark .next.page-numbers:hover,
+.colors-dark .entry-footer .edit-link a.post-edit-link:focus,
+.colors-dark .entry-footer .edit-link a.post-edit-link:hover {
+	background: #bbb;
+}
+
+.colors-dark .social-navigation a:hover,
+.colors-dark .social-navigation a:focus {
+	background: #999;
+	color: #222;
+}
+
+.colors-dark .entry-footer .cat-links .icon,
+.colors-dark .entry-footer .tags-links .icon {
+	color: #666;
+}
+
+.colors-dark button.secondary:hover,
+.colors-dark button.secondary:focus,
+.colors-dark input[type="reset"]:hover,
+.colors-dark input[type="reset"]:focus,
+.colors-dark input[type="button"].secondary:hover,
+.colors-dark input[type="button"].secondary:focus,
+.colors-dark input[type="reset"].secondary:hover,
+.colors-dark input[type="reset"].secondary:focus,
+.colors-dark input[type="submit"].secondary:hover,
+.colors-dark input[type="submit"].secondary:focus,
+.colors-dark .social-navigation a,
+.colors-dark hr {
+	background: #555;
+}
+
+.colors-dark input[type="text"],
+.colors-dark input[type="email"],
+.colors-dark input[type="url"],
+.colors-dark input[type="password"],
+.colors-dark input[type="search"],
+.colors-dark input[type="number"],
+.colors-dark input[type="tel"],
+.colors-dark input[type="range"],
+.colors-dark input[type="date"],
+.colors-dark input[type="month"],
+.colors-dark input[type="week"],
+.colors-dark input[type="time"],
+.colors-dark input[type="datetime"],
+.colors-dark input[type="datetime-local"],
+.colors-dark input[type="color"],
+.colors-dark textarea,
+.colors-dark select,
+.colors-dark fieldset,
+.colors-dark .widget .tagcloud a:hover,
+.colors-dark .widget .tagcloud a:focus,
+.colors-dark .widget.widget_tag_cloud a:hover,
+.colors-dark .widget.widget_tag_cloud a:focus,
+.colors-dark .wp_widget_tag_cloud a:hover,
+.colors-dark .wp_widget_tag_cloud a:focus {
+	border-color: #555;
+}
+
+.colors-dark button.secondary,
+.colors-dark input[type="reset"],
+.colors-dark input[type="button"].secondary,
+.colors-dark input[type="reset"].secondary,
+.colors-dark input[type="submit"].secondary,
+.colors-dark .prev.page-numbers,
+.colors-dark .next.page-numbers {
+	background-color: #444;
+}
+
+.colors-dark .widget .tagcloud a,
+.colors-dark .widget.widget_tag_cloud a,
+.colors-dark .wp_widget_tag_cloud a {
+	border-color: #444;
+}
+
+.colors-dark.twentyseventeen-front-page article:not(.has-post-thumbnail):not(:first-child),
+.colors-dark .widget ul li {
+	border-top-color: #444;
+}
+
+.colors-dark .widget ul li {
+	border-bottom-color: #444;
+}
+
+.colors-dark pre,
+.colors-dark mark,
+.colors-dark ins,
+.colors-dark input[type="text"],
+.colors-dark input[type="email"],
+.colors-dark input[type="url"],
+.colors-dark input[type="password"],
+.colors-dark input[type="search"],
+.colors-dark input[type="number"],
+.colors-dark input[type="tel"],
+.colors-dark input[type="range"],
+.colors-dark input[type="date"],
+.colors-dark input[type="month"],
+.colors-dark input[type="week"],
+.colors-dark input[type="time"],
+.colors-dark input[type="datetime"],
+.colors-dark input[type="datetime-local"],
+.colors-dark input[type="color"],
+.colors-dark textarea,
+.colors-dark select,
+.colors-dark fieldset {
+	background: #333;
+}
+
+.colors-dark tr,
+.colors-dark thead th {
+	border-color: #333;
+}
+
+.colors-dark .navigation-top,
+.colors-dark .main-navigation > div > ul,
+.colors-dark .pagination,
+.colors-dark .comment-navigation,
+.colors-dark .entry-footer,
+.colors-dark .site-footer {
+	border-top-color: #333;
+}
+
+.colors-dark .single-featured-image-header,
+.colors-dark .navigation-top,
+.colors-dark .main-navigation li,
+.colors-dark .entry-footer,
+.colors-dark #comments {
+	border-bottom-color: #333;
+}
+
+.colors-dark .site-header,
+.colors-dark .single-featured-image-header {
+	background-color: #262626;
+}
+
+.colors-dark button,
+.colors-dark input[type="button"],
+.colors-dark input[type="submit"],
+.colors-dark .prev.page-numbers:focus,
+.colors-dark .prev.page-numbers:hover,
+.colors-dark .next.page-numbers:focus,
+.colors-dark .next.page-numbers:hover {
+	color: #222;
+}
+
+body.colors-dark,
+.colors-dark .site-content-contain,
+.colors-dark .navigation-top,
+.colors-dark .main-navigation ul {
+	background: #222;
+}
+
+.colors-dark .entry-title a,
+.colors-dark .entry-meta a,
+.colors-dark.blog .entry-meta a.post-edit-link,
+.colors-dark.archive .entry-meta a.post-edit-link,
+.colors-dark.search .entry-meta a.post-edit-link,
+.colors-dark .page-links a,
+.colors-dark .page-links a .page-number,
+.colors-dark .entry-footer a,
+.colors-dark .entry-footer .cat-links a,
+.colors-dark .entry-footer .tags-links a,
+.colors-dark .edit-link a,
+.colors-dark .post-navigation a,
+.colors-dark .logged-in-as a,
+.colors-dark .comment-navigation a,
+.colors-dark .comment-metadata a,
+.colors-dark .comment-metadata a.comment-edit-link,
+.colors-dark .comment-reply-link,
+.colors-dark a .nav-title,
+.colors-dark .pagination a,
+.colors-dark .comments-pagination a,
+.colors-dark .widget .widget-title a,
+.colors-dark .widget ul li a,
+.colors-dark .site-footer .widget-area ul li a,
+.colors-dark .site-info a {
+	-webkit-box-shadow: inset 0 -1px 0 rgba(34, 34, 34, 1); /* Equivalant to #222 */
+	box-shadow: inset 0 -1px 0 rgba(34, 34, 34, 1); /* Equivalant to #222 */
+}
+
+/* Fixes linked images */
+.colors-dark .entry-content a img,
+.colors-dark .comment-content a img,
+.colors-dark .widget a img {
+	-webkit-box-shadow: 0 0 0 8px #222;
+	box-shadow: 0 0 0 8px #222;
+}
+
+.colors-dark .entry-footer .edit-link a.post-edit-link {
+	color: #000;
+}
+
+.colors-dark .menu-toggle,
+.colors-dark .menu-toggle:hover,
+.colors-dark .menu-toggle:focus,
+.colors-dark .dropdown-toggle,
+.colors-dark .dropdown-toggle:hover,
+.colors-dark .dropdown-toggle:focus,
+.colors-dark .menu-scroll-down,
+.colors-dark .menu-scroll-down:hover,
+.colors-dark .menu-scroll-down:focus {
+	background-color: transparent;
+}
+
+.colors-dark .gallery-item a,
+.colors-dark .gallery-item a:hover,
+.colors-dark .gallery-item a:focus,
+.colors-dark .widget .tagcloud a,
+.colors-dark .widget .tagcloud a:focus,
+.colors-dark .widget .tagcloud a:hover,
+.colors-dark .widget.widget_tag_cloud a,
+.colors-dark .widget.widget_tag_cloud a:focus,
+.colors-dark .widget.widget_tag_cloud a:hover,
+.colors-dark .wp_widget_tag_cloud a,
+.colors-dark .wp_widget_tag_cloud a:focus,
+.colors-dark .wp_widget_tag_cloud a:hover,
+.colors-dark .entry-footer .edit-link a.post-edit-link:focus,
+.colors-dark .entry-footer .edit-link a.post-edit-link:hover {
+	-webkit-box-shadow: none;
+	box-shadow: none;
+}
+
+@media screen and (min-width: 48em) {
+
+	.colors-dark .nav-links .nav-previous .nav-title .icon,
+	.colors-dark .nav-links .nav-next .nav-title .icon {
+		color: #eee;
+	}
+
+	.colors-dark .main-navigation li li:hover,
+	.colors-dark .main-navigation li li.focus {
+		background: #999;
+	}
+
+	.colors-dark .menu-scroll-down {
+		color: #999;
+	}
+
+	.colors-dark .main-navigation ul ul {
+		border-color: #333;
+		background: #222;
+	}
+
+	.colors-dark .main-navigation ul li.menu-item-has-children:before,
+	.colors-dark .main-navigation ul li.page_item_has_children:before {
+		border-bottom-color: #333;
+	}
+
+	.main-navigation ul li.menu-item-has-children:after,
+	.main-navigation ul li.page_item_has_children:after {
+		border-bottom-color: #222;
+	}
+
+	.colors-dark .main-navigation li li.focus > a,
+	.colors-dark .main-navigation li li:focus > a,
+	.colors-dark .main-navigation li li:hover > a,
+	.colors-dark .main-navigation li li a:hover,
+	.colors-dark .main-navigation li li a:focus,
+	.colors-dark .main-navigation li li.current_page_item a:hover,
+	.colors-dark .main-navigation li li.current-menu-item a:hover,
+	.colors-dark .main-navigation li li.current_page_item a:focus,
+	.colors-dark .main-navigation li li.current-menu-item a:focus {
+		color: #222;
+	}
+
+}

wp-content/themes/twentyseventeen/assets/css/editor-blocks.css

@@ -0,0 +1,808 @@
+/*
+Theme Name: Twenty Seventeen
+Description: Used to style blocks in the editor.
+*/
+
+/*--------------------------------------------------------------
+>>> TABLE OF CONTENTS:
+----------------------------------------------------------------
+1.0 General Typography
+2.0 General Block Settings
+3.0 Blocks - Common Blocks
+4.0 Blocks - Formatting
+5.0 Blocks - Layout Elements
+6.0 Blocks - Widgets
+
+--------------------------------------------------------------*/
+
+/*--------------------------------------------------------------
+1.0 General Typography
+--------------------------------------------------------------*/
+
+.edit-post-visual-editor .editor-block-list__block,
+.editor-default-block-appender textarea.editor-default-block-appender__content {
+	font-size: 15px;
+	font-size: 0.9375rem;
+}
+
+.editor-default-block-appender textarea.editor-default-block-appender__content {
+	font-family: "Libre Franklin", "Helvetica Neue", helvetica, arial, sans-serif;
+}
+
+.edit-post-visual-editor .editor-block-list__block {
+	color: #333;
+}
+
+.editor-post-title__block .editor-post-title__input {
+	color: #333;
+	font-family: "Libre Franklin", "Helvetica Neue", helvetica, arial, sans-serif;
+	font-size: 20px;
+	font-size: 1.25rem;
+	font-weight: 300;
+}
+
+@media screen and (min-width: 30em) {
+
+	.edit-post-visual-editor .editor-block-list__block {
+		font-size: 18px;
+		font-size: 1.125rem;
+	}
+
+	.editor-post-title__block .editor-post-title__input {
+		font-size: 26px;
+		font-size: 1.625rem;
+	}
+
+	.edit-post-visual-editor .editor-block-list__block h1 {
+		font-size: 30px;
+		font-size: 1.875rem;
+	}
+
+	.edit-post-visual-editor .editor-block-list__block h2 {
+		font-size: 26px;
+		font-size: 1.625rem;
+	}
+
+	.edit-post-visual-editor .editor-block-list__block h3 {
+		font-size: 22px;
+		font-size: 1.375rem;
+	}
+
+	.edit-post-visual-editor .editor-block-list__block h4 {
+		font-size: 18px;
+		font-size: 1.125rem;
+	}
+
+	.edit-post-visual-editor .editor-block-list__block h5 {
+		font-size: 13px;
+		font-size: 0.8125rem;
+	}
+
+	.edit-post-visual-editor .editor-block-list__block h6 {
+		font-size: 16px;
+		font-size: 1rem;
+	}
+}
+
+@media screen and (min-width: 48em) {
+
+	.edit-post-visual-editor .editor-block-list__block {
+		font-size: 16px;
+		font-size: 1rem;
+	}
+
+	.editor-rich-text__tinymce.mce-content-body {
+		line-height: 1.5;
+	}
+}
+
+/* Typography for Arabic Font */
+
+html[lang="ar"] .edit-post-visual-editor .editor-block-list__block,
+html[lang="ary"] .edit-post-visual-editor .editor-block-list__block,
+html[lang="azb"] .edit-post-visual-editor .editor-block-list__block,
+html[lang="fa-IR"] .edit-post-visual-editor .editor-block-list__block,
+html[lang="haz"] .edit-post-visual-editor .editor-block-list__block,
+html[lang="ps"] .edit-post-visual-editor .editor-block-list__block,
+html[lang="ur"] .edit-post-visual-editor .editor-block-list__block {
+	font-family: Tahoma, Arial, sans-serif;
+}
+
+html[lang="ar"] .edit-post-visual-editor h1,
+html[lang="ar"] .edit-post-visual-editor h2,
+html[lang="ar"] .edit-post-visual-editor h3,
+html[lang="ar"] .edit-post-visual-editor h4,
+html[lang="ar"] .edit-post-visual-editor h5,
+html[lang="ar"] .edit-post-visual-editor h6,
+html[lang="ary"] .edit-post-visual-editor h1,
+html[lang="ary"] .edit-post-visual-editor h2,
+html[lang="ary"] .edit-post-visual-editor h3,
+html[lang="ary"] .edit-post-visual-editor h4,
+html[lang="ary"] .edit-post-visual-editor h5,
+html[lang="ary"] .edit-post-visual-editor h6,
+html[lang="azb"] .edit-post-visual-editor h1,
+html[lang="azb"] .edit-post-visual-editor h2,
+html[lang="azb"] .edit-post-visual-editor h3,
+html[lang="azb"] .edit-post-visual-editor h4,
+html[lang="azb"] .edit-post-visual-editor h5,
+html[lang="azb"] .edit-post-visual-editor h6,
+html[lang="fa-IR"] .edit-post-visual-editor h1,
+html[lang="fa-IR"] .edit-post-visual-editor h2,
+html[lang="fa-IR"] .edit-post-visual-editor h3,
+html[lang="fa-IR"] .edit-post-visual-editor h4,
+html[lang="fa-IR"] .edit-post-visual-editor h5,
+html[lang="fa-IR"] .edit-post-visual-editor h6,
+html[lang="haz"] .edit-post-visual-editor h1,
+html[lang="haz"] .edit-post-visual-editor h2,
+html[lang="haz"] .edit-post-visual-editor h3,
+html[lang="haz"] .edit-post-visual-editor h4,
+html[lang="haz"] .edit-post-visual-editor h5,
+html[lang="haz"] .edit-post-visual-editor h6,
+html[lang="ps"] .edit-post-visual-editor h1,
+html[lang="ps"] .edit-post-visual-editor h2,
+html[lang="ps"] .edit-post-visual-editor h3,
+html[lang="ps"] .edit-post-visual-editor h4,
+html[lang="ps"] .edit-post-visual-editor h5,
+html[lang="ps"] .edit-post-visual-editor h6,
+html[lang="ur"] .edit-post-visual-editor h1,
+html[lang="ur"] .edit-post-visual-editor h2,
+html[lang="ur"] .edit-post-visual-editor h3,
+html[lang="ur"] .edit-post-visual-editor h4,
+html[lang="ur"] .edit-post-visual-editor h5,
+html[lang="ur"] .edit-post-visual-editor h6 {
+	font-weight: 700;
+}
+
+/* Typography for Chinese Font */
+
+html[lang^="zh-"] .edit-post-visual-editor .editor-block-list__block {
+	font-family: "PingFang TC", "Helvetica Neue", Helvetica, STHeitiTC-Light, Arial, sans-serif;
+}
+
+html[lang="zh-CN"] .edit-post-visual-editor .editor-block-list__block {
+	font-family: "PingFang SC", "Helvetica Neue", Helvetica, STHeitiSC-Light, Arial, sans-serif;
+}
+
+html[lang^="zh-"] .edit-post-visual-editor h1,
+html[lang^="zh-"] .edit-post-visual-editor h2,
+html[lang^="zh-"] .edit-post-visual-editor h3,
+html[lang^="zh-"] .edit-post-visual-editor h4,
+html[lang^="zh-"] .edit-post-visual-editor h5,
+html[lang^="zh-"] .edit-post-visual-editor h6 {
+	font-weight: 700;
+}
+
+/* Typography for Cyrillic Font */
+
+html[lang="bg-BG"] .edit-post-visual-editor .editor-block-list__block,
+html[lang="ru-RU"] .edit-post-visual-editor .editor-block-list__block,
+html[lang="uk"] .edit-post-visual-editor .editor-block-list__block {
+	font-family: "Helvetica Neue", Helvetica, "Segoe UI", Arial, sans-serif;
+}
+
+html[lang="bg-BG"] .edit-post-visual-editor h1,
+html[lang="bg-BG"] .edit-post-visual-editor h2,
+html[lang="bg-BG"] .edit-post-visual-editor h3,
+html[lang="bg-BG"] .edit-post-visual-editor h4,
+html[lang="bg-BG"] .edit-post-visual-editor h5,
+html[lang="bg-BG"] .edit-post-visual-editor h6,
+html[lang="ru-RU"] .edit-post-visual-editor h1,
+html[lang="ru-RU"] .edit-post-visual-editor h2,
+html[lang="ru-RU"] .edit-post-visual-editor h3,
+html[lang="ru-RU"] .edit-post-visual-editor h4,
+html[lang="ru-RU"] .edit-post-visual-editor h5,
+html[lang="ru-RU"] .edit-post-visual-editor h6,
+html[lang="uk"] .edit-post-visual-editor h1,
+html[lang="uk"] .edit-post-visual-editor h2,
+html[lang="uk"] .edit-post-visual-editor h3,
+html[lang="uk"] .edit-post-visual-editor h4,
+html[lang="uk"] .edit-post-visual-editor h5,
+html[lang="uk"] .edit-post-visual-editor h6 {
+	font-weight: 700;
+	line-height: 1.2;
+}
+
+/* Typography for Devanagari Font */
+
+html[lang="bn-BD"] .edit-post-visual-editor .editor-block-list__block,
+html[lang="hi-IN"] .edit-post-visual-editor .editor-block-list__block,
+html[lang="mr-IN"] .edit-post-visual-editor .editor-block-list__block {
+	font-family: Arial, sans-serif;
+}
+
+html[lang="bn-BD"] .edit-post-visual-editor h1,
+html[lang="bn-BD"] .edit-post-visual-editor h2,
+html[lang="bn-BD"] .edit-post-visual-editor h3,
+html[lang="bn-BD"] .edit-post-visual-editor h4,
+html[lang="bn-BD"] .edit-post-visual-editor h5,
+html[lang="bn-BD"] .edit-post-visual-editor h6,
+html[lang="hi-IN"] .edit-post-visual-editor h1,
+html[lang="hi-IN"] .edit-post-visual-editor h2,
+html[lang="hi-IN"] .edit-post-visual-editor h3,
+html[lang="hi-IN"] .edit-post-visual-editor h4,
+html[lang="hi-IN"] .edit-post-visual-editor h5,
+html[lang="hi-IN"] .edit-post-visual-editor h6,
+html[lang="mr-IN"] .edit-post-visual-editor h1,
+html[lang="mr-IN"] .edit-post-visual-editor h2,
+html[lang="mr-IN"] .edit-post-visual-editor h3,
+html[lang="mr-IN"] .edit-post-visual-editor h4,
+html[lang="mr-IN"] .edit-post-visual-editor h5,
+html[lang="mr-IN"] .edit-post-visual-editor h6 {
+	font-weight: 700;
+}
+
+/* Typography for Greek Font */
+
+html[lang="el"] .edit-post-visual-editor .editor-block-list__block {
+	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+}
+
+html[lang="el"] .edit-post-visual-editor h1,
+html[lang="el"] .edit-post-visual-editor h2,
+html[lang="el"] .edit-post-visual-editor h3,
+html[lang="el"] .edit-post-visual-editor h4,
+html[lang="el"] .edit-post-visual-editor h5,
+html[lang="el"] .edit-post-visual-editor h6 {
+	font-weight: 700;
+	line-height: 1.3;
+}
+
+/* Typography for Gujarati Font */
+
+html[lang="gu-IN"] .edit-post-visual-editor .editor-block-list__block {
+	font-family: Arial, sans-serif;
+}
+
+html[lang="gu-IN"] .edit-post-visual-editor h1,
+html[lang="gu-IN"] .edit-post-visual-editor h2,
+html[lang="gu-IN"] .edit-post-visual-editor h3,
+html[lang="gu-IN"] .edit-post-visual-editor h4,
+html[lang="gu-IN"] .edit-post-visual-editor h5,
+html[lang="gu-IN"] .edit-post-visual-editor h6 {
+	font-weight: 700;
+}
+
+/* Typography for Hebrew Font */
+
+html[lang="he-IL"] .edit-post-visual-editor .editor-block-list__block {
+	font-family: "Arial Hebrew", Arial, sans-serif;
+}
+
+html[lang="he-IL"] .edit-post-visual-editor h1,
+html[lang="he-IL"] .edit-post-visual-editor h2,
+html[lang="he-IL"] .edit-post-visual-editor h3,
+html[lang="he-IL"] .edit-post-visual-editor h4,
+html[lang="he-IL"] .edit-post-visual-editor h5,
+html[lang="he-IL"] .edit-post-visual-editor h6 {
+	font-weight: 700;
+}
+
+/* Typography for Japanese Font */
+
+html[lang="ja"] .edit-post-visual-editor .editor-block-list__block {
+	font-family: "Hiragino Kaku Gothic Pro", Meiryo, sans-serif;
+}
+
+html[lang="ja"] .edit-post-visual-editor h1,
+html[lang="ja"] .edit-post-visual-editor h2,
+html[lang="ja"] .edit-post-visual-editor h3,
+html[lang="ja"] .edit-post-visual-editor h4,
+html[lang="ja"] .edit-post-visual-editor h5,
+html[lang="ja"] .edit-post-visual-editor h6 {
+	font-weight: 700;
+}
+
+/* Typography for Korean font */
+
+html[lang="ko-KR"] .edit-post-visual-editor .editor-block-list__block {
+	font-family: "Apple SD Gothic Neo", "Malgun Gothic", "Nanum Gothic", Dotum, sans-serif;
+}
+
+html[lang="ko-KR"] .edit-post-visual-editor h1,
+html[lang="ko-KR"] .edit-post-visual-editor h2,
+html[lang="ko-KR"] .edit-post-visual-editor h3,
+html[lang="ko-KR"] .edit-post-visual-editor h4,
+html[lang="ko-KR"] .edit-post-visual-editor h5,
+html[lang="ko-KR"] .edit-post-visual-editor h6 {
+	font-weight: 600;
+}
+
+/* Typography for Thai Font */
+
+html[lang="th"] .edit-post-visual-editor .editor-block-list__block {
+	line-height: 1.8;
+	font-family: "Sukhumvit Set", "Helvetica Neue", Helvetica, Arial, sans-serif;
+}
+
+html[lang="th"] .edit-post-visual-editor h1,
+html[lang="th"] .edit-post-visual-editor h2,
+html[lang="th"] .edit-post-visual-editor h3,
+html[lang="th"] .edit-post-visual-editor h4,
+html[lang="th"] .edit-post-visual-editor h5,
+html[lang="th"] .edit-post-visual-editor h6 {
+	line-height: 1.65;
+	font-family: "Sukhumvit Set", "Helvetica Neue", Helvetica, Arial, sans-serif;
+}
+
+/* Remove letter-spacing for all non-latin alphabets */
+
+html[lang="ar"] .edit-post-visual-editor *,
+html[lang="ary"] .edit-post-visual-editor *,
+html[lang="azb"] .edit-post-visual-editor *,
+html[lang="haz"] .edit-post-visual-editor *,
+html[lang="ps"] .edit-post-visual-editor *,
+html[lang^="zh-"] .edit-post-visual-editor *,
+html[lang="bg-BG"] .edit-post-visual-editor *,
+html[lang="ru-RU"] .edit-post-visual-editor *,
+html[lang="uk"] .edit-post-visual-editor *,
+html[lang="bn-BD"] .edit-post-visual-editor *,
+html[lang="hi-IN"] .edit-post-visual-editor *,
+html[lang="mr-IN"] .edit-post-visual-editor *,
+html[lang="el"] .edit-post-visual-editor *,
+html[lang="gu-IN"] .edit-post-visual-editor *,
+html[lang="he-IL"] .edit-post-visual-editor *,
+html[lang="ja"] .edit-post-visual-editor *,
+html[lang="ko-KR"] .edit-post-visual-editor *,
+html[lang="th"] .edit-post-visual-editor * {
+	letter-spacing: 0 !important;
+}
+
+/*--------------------------------------------------------------
+2.0 General Block Settings
+--------------------------------------------------------------*/
+
+/* Main column width */
+
+.editor-styles-wrapper {
+	max-width: 100% !important; /* Override where editor-style.css is affecting this. */
+}
+
+.wp-block {
+	max-width: 674px; /* Based on one-column post width; 644px + 30px to account for padding. */
+}
+
+/* Alignments */
+
+.edit-post-visual-editor .alignleft {
+	margin-right: 1.5em;
+}
+
+.edit-post-visual-editor .alignright {
+	margin-left: 1.5em;
+}
+
+/* Link styles */
+
+.edit-post-visual-editor a,
+.editor-block-list__block a,
+.wp-block-freeform.block-library-rich-text__tinymce a {
+	color: #222;
+}
+
+/* List styles */
+
+.edit-post-visual-editor ul:not(.wp-block-gallery),
+.editor-block-list__block ul:not(.wp-block-gallery),
+.block-library-list ul,
+.edit-post-visual-editor ol,
+.editor-block-list__block ol,
+.block-library-list ol,
+.block-library-list .editor-rich-text__tinymce {
+	margin: 0 0 1.5em 1.5em;
+	padding: 0;
+}
+
+.edit-post-visual-editor ul:not(.wp-block-gallery),
+.editor-block-list__block ul:not(.wp-block-gallery),
+.block-library-list ul {
+	list-style: disc;
+}
+
+.edit-post-visual-editor ol,
+.editor-block-list__block ol,
+.block-library-list ol {
+	list-style: decimal;
+}
+
+.edit-post-visual-editor li > ul:not(.wp-block-gallery),
+.editor-block-list__block li > ul:not(.wp-block-gallery),
+.block-library-list li > ul:not(.wp-block-gallery),
+.edit-post-visual-editor li > ol,
+.editor-block-list__block li > ol,
+.block-library-list li > ol {
+	margin-bottom: 0;
+	margin-left: 1.5em;
+}
+
+.edit-post-visual-editor li,
+.editor-block-list__block li,
+.block-library-list li {
+	margin: 0;
+}
+
+.rtl .edit-post-visual-editor ul:not(.wp-block-gallery),
+.rtl .editor-block-list__block ul:not(.wp-block-gallery),
+.rtl .block-library-list ul,
+.rtl .edit-post-visual-editor ol,
+.rtl .editor-block-list__block ol,
+.rtl .block-library-list ol,
+.rtl .block-library-list .editor-rich-text__tinymce,
+.rtl .edit-post-visual-editor li > ul:not(.wp-block-gallery),
+.rtl .editor-block-list__block li > ul:not(.wp-block-gallery),
+.rtl .block-library-list li > ul:not(.wp-block-gallery),
+.rtl .edit-post-visual-editor li > ol,
+.rtl .editor-block-list__block li > ol,
+.rtl .block-library-list li > ol {
+	margin-left: 1.5em;
+	margin-right: 1.5em;
+}
+
+/* Quote styles */
+
+.editor-block-list__block blockquote p {
+	font-size: 18px;
+	font-size: 1.125rem;
+}
+
+.editor-block-list__block blockquote.alignright p,
+.editor-block-list__block blockquote.alignleft p {
+	font-size: 13px;
+	font-size: 0.8125rem;
+}
+
+.editor-block-list__block blockquote cite {
+	display: block;
+	font-style: normal;
+	font-weight: 600;
+	margin-top: 0.5em;
+}
+
+/* Caption styles*/
+
+[class^="wp-block-"]:not(.wp-block-gallery) figcaption {
+	font-style: italic;
+	margin-bottom: 1.5em;
+	text-align: left;
+}
+
+.rtl [class^="wp-block-"]:not(.wp-block-gallery) figcaption {
+	text-align: right;
+}
+
+/* Code styles */
+
+.wp-block-freeform.block-library-rich-text__tinymce code {
+	background: transparent;
+}
+
+/* Table styles */
+
+.rtl .editor-block-list__block th {
+	text-align: right;
+}
+
+/*--------------------------------------------------------------
+3.0 Blocks - Common Blocks
+--------------------------------------------------------------*/
+
+/* Paragraph */
+
+.wp-block-paragraph.has-drop-cap:not(:focus)::first-letter {
+	font-size: 5em;
+	margin-top: 0.075em;
+}
+
+.wp-block-paragraph.has-background {
+	padding: 20px 30px;
+}
+
+/* Gallery */
+
+.wp-block-gallery figcaption {
+	font-style: italic;
+}
+
+/* Quote */
+
+.wp-block-quote {
+	color: #666;
+	font-size: 18px;
+	font-size: 1.125rem;
+	font-style: italic;
+	line-height: 1.7;
+}
+
+.wp-block-quote:not(.is-large):not(.is-style-large) {
+	border: 0;
+	padding: 0;
+}
+
+.editor-block-list__block .wp-block-quote .wp-block-quote__citation {
+	color: inherit;
+	display: block;
+	font-size: inherit;
+	font-style: normal;
+	font-weight: 600;
+	margin-top: 0.5em;
+}
+
+.wp-block-quote.alignleft,
+.wp-block-quote.alignright {
+	color: #666;
+	width: 48%;
+}
+
+.editor-block-list__block .wp-block-quote.alignleft p,
+.editor-block-list__block .wp-block-quote.alignright p,
+.editor-block-list__block .wp-block-quote.alignleft .wp-block-quote__citation,
+.editor-block-list__block .wp-block-quote.alignright .wp-block-quote__citation {
+	font-size: 13px;
+	font-size: 0.8125rem;
+}
+
+.editor-block-list__block .wp-block-quote.alignleft p:last-of-type,
+.editor-block-list__block .wp-block-quote.alignright p:last-of-type {
+	margin-bottom: 0;
+}
+
+.wp-block-quote.is-large .wp-block-quote__citation,
+.wp-block-quote.is-style-large .wp-block-quote__citation {
+	text-align: right;
+}
+
+.rtl .wp-block-quote.is-large .wp-block-quote__citation,
+.rtl .wp-block-quote.is-style-large .wp-block-quote__citation {
+	text-align: left;
+}
+
+@media screen and (min-width: 30em) {
+	.editor-block-list__block .wp-block-quote.alignleft p,
+	.editor-block-list__block .wp-block-quote.alignright p,
+	.editor-block-list__block .wp-block-quote.alignleft .wp-block-quote__citation,
+	.editor-block-list__block .wp-block-quote.alignright .wp-block-quote__citation,
+	.editor-block-list__block .wp-block-quote footer {
+		font-size: 14px;
+		font-size: 0.875rem;
+	}
+}
+
+@media screen and (min-width: 48em) {
+	.editor-block-list__block .wp-block-quote.alignleft p,
+	.editor-block-list__block .wp-block-quote.alignright p,
+	.editor-block-list__block .wp-block-quote.alignleft .wp-block-quote__citation,
+	.editor-block-list__block .wp-block-quote.alignright .wp-block-quote__citation {
+		font-size: 13px;
+		font-size: 0.8125rem;
+	}
+
+	.editor-block-list__block .wp-block-quote.alignleft {
+		margin-left: -17.5%;
+		width: 48%;
+	}
+
+	.editor-block-list__block .wp-block-quote.alignright {
+		margin-right: -17.5%;
+		width: 48%;
+	}
+}
+
+/* File */
+
+.wp-block-file .wp-block-file__textlink {
+	-webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0), 0 1px 0 rgba(0, 0, 0, 1);
+	box-shadow: inset 0 0 0 rgba(0, 0, 0, 0), 0 1px 0 rgba(0, 0, 0, 1);
+}
+
+.wp-block-file .wp-block-file__button {
+	background-color: #222;
+	-webkit-border-radius: 2px;
+	border-radius: 2px;
+	-webkit-box-shadow: none;
+	box-shadow: none;
+	color: #fff;
+	display: inline-block;
+	font-size: 14px;
+	font-size: 0.875rem;
+	font-weight: 800;
+	padding: 0.7em 2em;
+	-webkit-transition: background-color 0.2s ease-in-out;
+	transition: background-color 0.2s ease-in-out;
+	white-space: nowrap;
+}
+
+/*--------------------------------------------------------------
+4.0 Blocks - Formatting
+--------------------------------------------------------------*/
+
+/* Code */
+
+.wp-block-code {
+	border: 0;
+	padding: 0;
+}
+
+/* Classic */
+
+.wp-block-freeform.block-library-rich-text__tinymce li,
+.wp-block-freeform.block-library-rich-text__tinymce p {
+	line-height: 1.5;
+}
+
+.wp-block-freeform.block-library-rich-text__tinymce blockquote {
+	border: 0;
+	padding: 0;
+}
+
+/* Pullquote */
+
+.wp-block-pullquote {
+	border: 0;
+}
+
+.wp-block-pullquote.alignleft blockquote > .editor-rich-text p,
+.wp-block-pullquote.alignright blockquote > .editor-rich-text p {
+	font-size: 20px;
+}
+
+
+.wp-block-pullquote .wp-block-pullquote__citation {
+	font-size: inherit;
+	font-weight: 600;
+	text-transform: none;
+}
+
+/* Table */
+
+table.wp-block-table {
+	border-collapse: collapse;
+	margin: 0 0 1.5em;
+	width: 100%;
+}
+
+table.wp-block-table thead th {
+	border: 0;
+	border-bottom: 2px solid #bbb;
+	padding-bottom: 0.5em;
+}
+
+table.wp-block-table th {
+	padding: 0.4em;
+	text-align: left;
+}
+
+table.wp-block-table tr {
+	border-bottom: 1px solid #eee;
+}
+
+table.wp-block-table th,
+table.wp-block-table td {
+	border: 0;
+	padding: 0.4em;
+}
+
+table.wp-block-table th:first-child,
+table.wp-block-table td:first-child {
+	padding-left: 0;
+}
+
+table.wp-block-table th:last-child,
+table.wp-block-table td:last-child {
+	padding-right: 0;
+}
+
+.wp-block-table__cell-content {
+	padding: 0;
+}
+
+.rtl table.wp-block-table th,
+.rtl table.wp-block-table td {
+	text-align: right;
+}
+
+/*--------------------------------------------------------------
+5.0 Blocks - Layout Elements
+--------------------------------------------------------------*/
+
+/* Separator */
+
+.edit-post-visual-editor .wp-block-separator {
+	border: 0;
+}
+
+/* Buttons */
+
+.wp-block-button .wp-block-button__link {
+	-webkit-box-shadow: none;
+	box-shadow: none;
+	display: inline-block;
+	font-size: 14px;
+	font-size: 0.875rem;
+	font-weight: 800;
+	line-height: 1.66;
+	margin-top: 2em;
+	padding: 0.7em 2em;
+	-webkit-transition: background-color 0.2s ease-in-out;
+	transition: background-color 0.2s ease-in-out;
+	white-space: nowrap;
+}
+
+.wp-block-button .wp-block-button__link[data-is-placeholder-visible="true"] {
+	height: auto;
+}
+
+.wp-block-button__link {
+	background-color: #222;
+	color: #fff;
+}
+
+.is-style-outline .wp-block-button__link {
+	color: #222;
+}
+
+/* Media & Text */
+
+.wp-block-media-text *:last-child {
+	margin-bottom: 0;
+}
+
+/*--------------------------------------------------------------
+6.0 Blocks - Widgets
+--------------------------------------------------------------*/
+
+/* Archives, Categories & Latest Posts */
+
+[data-align="center"] .wp-block-archives ul,
+[data-align="center"] .wp-block-categories ul,
+[data-align="center"] .wp-block-latest-posts ul {
+	list-style-position: inside;
+}
+
+/* Latest Comments */
+
+.editor-block-list__block ol.wp-block-latest-comments > li:before {
+	content: '';
+}
+
+.wp-block-latest-comments article {
+	margin-bottom: 4em;
+}
+
+.wp-block-latest-comments .avatar,
+.wp-block-latest-comments__comment-avatar {
+	border-radius: 0;
+}
+
+.wp-block-latest-comments__comment-meta {
+	font-size: 16px;
+	font-size: 1rem;
+	margin-bottom: 0.4em;
+}
+
+.editor-block-list__block .wp-block-latest-comments__comment-meta a {
+	-webkit-box-shadow: none;
+	box-shadow: none;
+	font-weight: 700;
+}
+
+.wp-block-latest-comments__comment-date {
+	color: #767676;
+	font-size: 10px;
+	font-size: 0.625rem;
+	font-weight: 800;
+	letter-spacing: 0.1818em;
+	margin-top: 0.4em;
+	text-transform: uppercase;
+}
+
+.editor-block-list__block .wp-block-latest-comments__comment-excerpt p {
+	font-size: 14px;
+	font-size: 0.875rem;
+}
+
+/* Latest Posts */
+
+.edit-post-visual-editor .wp-block-latest-posts.is-grid {
+	list-style: none;
+	margin-left: 0;
+	margin-right: 0;
+}

wp-content/themes/twentyseventeen/assets/css/editor-style.css

@@ -0,0 +1,582 @@
+/*
+Theme Name: Twenty Seventeen
+Description: Used to style the TinyMCE editor.
+*/
+
+
+/**
+ * Table of Contents:
+ *
+ * 1.0 - Body
+ * 2.0 - Typography
+ * 3.0 - Elements
+ * 4.0 - Alignment
+ * 5.0 - Caption
+ * 6.0 - Galleries
+ * 7.0 - Media Elements
+ * 8.0 - RTL
+ */
+
+/**
+ * 1.0 - Body
+ */
+
+body {
+	background-color: #fff;
+	color: #333;
+	margin: 20px 40px;
+	max-width: 580px;
+}
+
+/**
+ * 2.0 - Typography
+ */
+
+body,
+button,
+input,
+select,
+textarea {
+	font-family: "Libre Franklin", "Helvetica Neue", helvetica, arial, sans-serif;
+	font-size: 16px;
+	font-size: 1rem;
+	font-weight: 400;
+	line-height: 1.66;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+	clear: both;
+	line-height: 1.4;
+	margin: 0 0 0.75em;
+	padding: 1.5em 0 0;
+}
+
+h1:first-child,
+h2:first-child,
+h3:first-child,
+h4:first-child,
+h5:first-child,
+h6:first-child {
+	padding-top: 0;
+}
+
+h1 {
+	font-size: 24px;
+	font-size: 1.5rem;
+	font-weight: 300;
+}
+
+h2 {
+	color: #666;
+	font-size: 20px;
+	font-size: 1.25rem;
+	font-weight: 300;
+}
+
+h3 {
+	color: #333;
+	font-size: 18px;
+	font-size: 1.125rem;
+	font-weight: 300;
+}
+
+h4 {
+	color: #333;
+	font-size: 16px;
+	font-size: 1rem;
+	font-weight: 800;
+}
+
+h5 {
+	color: #767676;
+	font-size: 13px;
+	font-size: 0.8125rem;
+	font-weight: 800;
+	letter-spacing: 0.15em;
+	text-transform: uppercase;
+}
+
+h6 {
+	color: #333;
+	font-size: 15px;
+	font-size: 0.9375rem;
+	font-weight: 800;
+}
+
+p {
+	margin: 0 0 1.5em;
+	padding: 0;
+}
+
+dfn,
+cite,
+em,
+i {
+	font-style: italic;
+}
+
+blockquote {
+	color: #666;
+	font-size: 18px;
+	font-size: 1.125rem;
+	font-style: italic;
+	line-height: 1.7;
+	margin: 0;
+	overflow: hidden;
+	padding: 0;
+}
+
+blockquote.alignleft,
+blockquote.alignright {
+	font-size: 14px;
+	font-size: 0.875rem;
+	width: 34%;
+}
+
+address {
+	margin: 0 0 1.5em;
+}
+
+pre {
+	background: #eee;
+	font-family: "Courier 10 Pitch", Courier, monospace;
+	font-size: 15px;
+	font-size: 0.9375rem;
+	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;
+	font-size: 0.9375rem;
+}
+
+abbr,
+acronym {
+	border-bottom: 1px dotted #666;
+	cursor: help;
+}
+
+mark,
+ins {
+	background: #eee;
+	text-decoration: none;
+}
+
+big {
+	font-size: 125%;
+}
+
+blockquote,
+q {
+	quotes: "" "";
+}
+
+blockquote:before,
+blockquote:after,
+q:before,
+q:after {
+	content: "";
+}
+
+/* Typography for Thai Font */
+
+html[lang="th"] h1,
+html[lang="th"] h2,
+html[lang="th"] h3,
+html[lang="th"] h4,
+html[lang="th"] h5,
+html[lang="th"] h6 {
+	letter-spacing: 0;
+	line-height: 1.65;
+}
+
+html[lang="th"] body,
+html[lang="th"] button,
+html[lang="th"] input,
+html[lang="th"] select,
+html[lang="th"] textarea {
+	line-height: 1.8;
+}
+
+/**
+ * 3.0 - Elements
+ */
+
+hr {
+	background-color: #bbb;
+	border: 0;
+	height: 1px;
+	margin-bottom: 1.5em;
+}
+
+ul,
+ol {
+	margin: 0 0 1.5em;
+	padding: 0;
+}
+
+ul {
+	list-style: disc;
+}
+
+ol > li {
+	position: relative;
+}
+
+li > ul,
+li > ol {
+	margin-bottom: 0;
+	margin-left: 1.5em;
+}
+
+dt {
+	font-weight: 700;
+}
+
+dd {
+	margin: 0 1.5em 1.5em;
+}
+
+table {
+	border-collapse: collapse;
+	margin: 0 0 1.5em;
+	width: 100%;
+}
+
+thead th {
+	border-bottom: 2px solid #bbb;
+	padding-bottom: 0.5em;
+}
+
+th {
+	padding: 0.4em;
+	text-align: left;
+}
+
+tr {
+	border-bottom: 1px solid #eee;
+}
+
+td {
+	padding: 0.4em;
+}
+
+th:first-child,
+td:first-child {
+	padding-left: 0;
+}
+
+th:last-child,
+td:last-child {
+	padding-right: 0;
+}
+
+a {
+	-webkit-box-shadow: inset 0 -1px 0 rgba(15, 15, 15, 1);
+	box-shadow: inset 0 -1px 0 rgba(15, 15, 15, 1);
+	color: #222;
+	text-decoration: none;
+	-webkit-transition: color 80ms ease-in, -webkit-box-shadow 130ms ease-in-out;
+	transition: color 80ms ease-in, -webkit-box-shadow 130ms ease-in-out;
+	transition: color 80ms ease-in, box-shadow 130ms ease-in-out;
+	transition: color 80ms ease-in, box-shadow 130ms ease-in-out, -webkit-box-shadow 130ms ease-in-out;
+}
+
+a:focus {
+	outline: thin dotted;
+}
+
+a:hover,
+a:focus {
+	color: #000;
+	-webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0), 0 3px 0 rgba(0, 0, 0, 1);
+	box-shadow: inset 0 0 0 rgba(0, 0, 0, 0), 0 3px 0 rgba(0, 0, 0, 1);
+}
+
+/* Fixes linked images */
+
+a img {
+	background: #fff;
+	-webkit-box-shadow: 0 0 0 6px #fff;
+	box-shadow: 0 0 0 6px #fff;
+}
+
+/**
+ * 4.0 - Alignment
+ */
+
+img {
+	height: auto; /* Make sure images are scaled correctly. */
+	max-width: 100%; /* Adhere to container width. */
+}
+
+embed,
+iframe,
+object {
+	margin-bottom: 1.5em;
+	max-width: 100%;
+}
+
+/**
+ * 5.0 - Caption
+ */
+
+.wp-caption {
+	color: #666;
+	font-size: 13px;
+	font-size: 0.8125rem;
+	font-style: italic;
+	margin-bottom: 1.5em;
+	max-width: 100%;
+}
+
+.wp-caption img[class*="wp-image-"] {
+	display: block;
+	margin-left: auto;
+	margin-right: auto;
+}
+
+.wp-caption .wp-caption-text {
+	margin: 0.8075em 0;
+}
+
+/**
+ * 6.0 - Galleries
+ */
+
+.gallery {
+	margin-bottom: 1.5em;
+}
+
+.gallery-item {
+	display: inline-block;
+	text-align: center;
+	vertical-align: top;
+	width: 100%;
+}
+
+.gallery-item a,
+.gallery-item a:hover,
+.gallery-item a:focus {
+	-webkit-box-shadow: none;
+	box-shadow: none;
+	background: none;
+	display: inline-block;
+}
+
+.gallery-columns-2 .gallery-item {
+	max-width: 50%;
+}
+
+.gallery-columns-3 .gallery-item {
+	max-width: 33.33%;
+}
+
+.gallery-columns-4 .gallery-item {
+	max-width: 25%;
+}
+
+.gallery-columns-5 .gallery-item {
+	max-width: 20%;
+}
+
+.gallery-columns-6 .gallery-item {
+	max-width: 16.66%;
+}
+
+.gallery-columns-7 .gallery-item {
+	max-width: 14.28%;
+}
+
+.gallery-columns-8 .gallery-item {
+	max-width: 12.5%;
+}
+
+.gallery-columns-9 .gallery-item {
+	max-width: 11.11%;
+}
+
+.gallery-caption {
+	display: block;
+}
+
+/**
+ * 7.0 - Media Elements
+ */
+
+.mejs-container {
+	margin-bottom: 1.5em;
+}
+
+/* Audio Player */
+
+.mejs-controls a.mejs-horizontal-volume-slider,
+.mejs-controls a.mejs-horizontal-volume-slider:focus,
+.mejs-controls a.mejs-horizontal-volume-slider:hover {
+	background: transparent;
+	border: 0;
+}
+
+/* Playlist Color Overrides: Light */
+
+.wp-playlist-light {
+	border-color: #eee;
+	color: #222;
+}
+
+.wp-playlist-light .wp-playlist-current-item .wp-playlist-item-album {
+	color: #333;
+}
+
+.wp-playlist-light .wp-playlist-current-item .wp-playlist-item-artist {
+	color: #767676;
+}
+
+.wp-playlist-light .wp-playlist-item {
+	border-bottom: 1px dotted #eee;
+	-webkit-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
+	transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
+}
+
+.wp-playlist-light .wp-playlist-item:hover,
+.wp-playlist-light .wp-playlist-item:focus {
+	border-bottom-color: rgba(0, 0, 0, 0);
+	background-color: #767676;
+	color: #fff;
+}
+
+.wp-playlist-light a.wp-playlist-caption:hover,
+.wp-playlist-light .wp-playlist-item:hover a,
+.wp-playlist-light .wp-playlist-item:focus a {
+	color: #fff;
+}
+
+/* Playlist Color Overrides: Dark */
+
+.wp-playlist-dark {
+	background: #222;
+	border-color: #333;
+}
+
+.wp-playlist-dark .mejs-container .mejs-controls {
+	background-color: #333;
+}
+
+.wp-playlist-dark .wp-playlist-caption {
+	color: #fff;
+}
+
+.wp-playlist-dark .wp-playlist-current-item .wp-playlist-item-album {
+	color: #eee;
+}
+
+.wp-playlist-dark .wp-playlist-current-item .wp-playlist-item-artist {
+	color: #aaa;
+}
+
+.wp-playlist-dark .wp-playlist-playing {
+	background-color: #333;
+}
+
+.wp-playlist-dark .wp-playlist-item {
+	border-bottom: 1px dotted #555;
+	-webkit-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
+	transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
+}
+
+.wp-playlist-dark .wp-playlist-item:hover,
+.wp-playlist-dark .wp-playlist-item:focus {
+	border-bottom-color: rgba(0, 0, 0, 0);
+	background-color: #aaa;
+	color: #222;
+}
+
+.wp-playlist-dark a.wp-playlist-caption:hover,
+.wp-playlist-dark .wp-playlist-item:hover a,
+.wp-playlist-dark .wp-playlist-item:focus a {
+	color: #222;
+}
+
+/* Playlist Style Overrides */
+
+.wp-playlist {
+	padding: 0.625em 0.625em 0.3125em;
+}
+
+.wp-playlist-current-item .wp-playlist-item-title {
+	font-weight: 700;
+}
+
+.wp-playlist-current-item .wp-playlist-item-album {
+	font-style: normal;
+}
+
+.wp-playlist-current-item .wp-playlist-item-artist {
+	font-size: 10px;
+	font-size: 0.625rem;
+	font-weight: 800;
+	letter-spacing: 0.1818em;
+	text-transform: uppercase;
+}
+
+.wp-playlist-item {
+	padding: 0 0.3125em;
+	cursor: pointer;
+}
+
+.wp-playlist-item:last-of-type {
+	border-bottom: none;
+}
+
+.wp-playlist-item a {
+	padding: 0.3125em 0;
+	border-bottom: none;
+}
+
+.wp-playlist-item a,
+.wp-playlist-item a:focus,
+.wp-playlist-item a:hover {
+	-webkit-box-shadow: none;
+	box-shadow: none;
+	background: transparent;
+}
+
+.wp-playlist-item-length {
+	top: 5px;
+}
+
+/**
+ * 8.0 - RTL
+ */
+
+.rtl th {
+	text-align: right;
+}
+
+.rtl ol > li:before {
+	left: auto;
+	right: -1.5em;
+}
+
+.rtl li > ul,
+.rtl li > ol {
+	margin-left: 0;
+	margin-right: 1.5em;
+}
+
+.rtl .mejs-offscreen {
+	right: -10000px;
+}

wp-content/themes/twentyseventeen/assets/css/ie8.css

@@ -0,0 +1,225 @@
+/*
+Theme Name: Twenty Seventeen
+Description: IE8 specific style.
+*/
+
+body {
+	font-size: 16px;
+}
+
+h1 {
+	font-size: 30px;
+	font-size: 1.875rem;
+}
+
+h2,
+.page .panel-content .recent-posts .entry-title {
+	font-size: 26px;
+	font-size: 1.625rem;
+}
+
+h3 {
+	font-size: 22px;
+	font-size: 1.375rem;
+}
+
+h4 {
+	font-size: 18px;
+	font-size: 1.125rem;
+}
+
+h5 {
+	font-size: 13px;
+	font-size: 0.8125rem;
+}
+
+h6 {
+	font-size: 16px;
+	font-size: 1rem;
+}
+
+img {
+	width: inherit;  /* Make images fill their parent's space. */
+}
+
+/* Fixes linked images */
+.entry-content a img,
+.widget a img {
+	filter: progid:DXImageTransform.Microsoft.DropShadow(OffX=0, OffY=5, Color=#ffffff);
+}
+
+/* Layout */
+
+.site-content {
+	padding: 6.5em 0 0;
+}
+
+/* Site Branding */
+
+.custom-header {
+	overflow: hidden;
+}
+
+.has-header-image.twentyseventeen-front-page .custom-header,
+.has-header-image.home.blog .custom-header {
+	display: block;
+}
+
+.custom-header-media {
+	background-position: bottom center;
+}
+
+.site-branding {
+	padding: 45px 0;
+}
+
+.has-header-image.twentyseventeen-front-page .site-branding,
+.has-header-image.home.blog .site-branding {
+	bottom: 0;
+	display: block;
+	left: 0;
+	height: auto;
+	padding-top: 0;
+	position: absolute;
+	width: 100%;
+}
+
+.has-header-image .custom-header-media img {
+	left: 0;
+	top: 0;
+}
+
+.site-title {
+	font-size: 36px;
+	font-weight: 700;
+}
+
+.site-description {
+	font-size: 16px;
+}
+
+/* Main Navigation */
+
+.navigation-top {
+	background: #fff;
+	position: relative;
+	z-index: 10;
+}
+
+.menu-toggle {
+	width: 150px;
+}
+
+.main-navigation ul#top-menu {
+	margin-bottom: -1px;
+	padding: 0;
+}
+
+.no-svg .dropdown-toggle {
+	padding: 0.25em 0 0;
+}
+
+.no-svg .dropdown-toggle.toggled-on {
+	padding: 0.75em 0 0;
+}
+
+.dropdown-toggle .svg-fallback.icon-angle-down {
+	-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=-1, M12=1.2246467991473532e-16, M21=-1.2246467991473532e-16, M22=-1, SizingMethod='auto expand')";
+}
+
+.dropdown-toggle.toggled-on .svg-fallback.icon-angle-down {
+	-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1, M12=0, M21=0, M22=1, SizingMethod='auto expand')";
+}
+
+/* Front Page */
+
+.twentyseventeen-front-page.has-header-image .custom-header,
+.blog.home.has-header-image .custom-header,
+.panel-image {
+	height: 800px;
+	max-height: 800px;
+	padding-top: 0;
+}
+
+.twentyseventeen-front-page .custom-header-media,
+.blog.home .custom-header-media {
+	background-position: center center;
+}
+
+.twentyseventeen-front-page.has-header-image .site-branding,
+.home.blog.has-header-image .site-branding {
+	bottom: 20px;
+	position: absolute;
+	width: 100%;
+}
+
+.page .panel-content .entry-title,
+.page-title,
+.page .entry-title {
+	font-size: 14px;
+	font-size: 0.875rem;
+	font-weight: 700;
+	letter-spacing: 0.14em;
+	text-transform: uppercase;
+}
+
+/* Posts */
+
+.blog .site-main > article,
+.archive .site-main > article,
+.search .site-main > article {
+	padding-bottom: 4em;
+}
+
+time.updated {
+	display: none;
+}
+
+time.published {
+	display: inline-block;
+}
+
+.blog .entry-title {
+	padding-top: 0;
+}
+
+.single-post .entry-title,
+.page .entry-title,
+.entry-meta + .entry-title {
+	font-size: 26px;
+	font-weight: 400;
+	letter-spacing: normal;
+	padding-top: 0;
+	text-transform: none;
+}
+
+.entry-footer .cat-links,
+.entry-footer .tags-links {
+	padding-left: 0;
+}
+
+.comment-author .avatar {
+	z-index: -1;
+}
+
+ol.children .children {
+	padding-left: 2em;
+}
+
+/* RTL Styles */
+
+.rtl .has-header-image.twentyseventeen-front-page .site-branding,
+.rtl .has-header-image.home.blog .site-branding {
+	left: auto;
+	right: 0;
+}
+
+.rtl .entry-footer .cat-links,
+.rtl .entry-footer .tags-links {
+	padding-right: 0;
+}
+
+.rtl ol.children .children {
+	padding-left: 0;
+	padding-right: 2em;
+}

wp-content/themes/twentyseventeen/assets/css/ie9.css

@@ -0,0 +1,43 @@
+/*
+Theme Name: Twenty Seventeen
+Description: IE9 specific styles.
+*/
+
+.has-header-image.twentyseventeen-front-page .custom-header,
+.has-header-video.twentyseventeen-front-page .custom-header,
+.has-header-image.home.blog .custom-header,
+.has-header-video.home.blog .custom-header {
+	height: 300px;
+}
+
+.has-header-image .custom-header-media img,
+.has-header-video .custom-header-media video,
+.has-header-video .custom-header-media iframe {
+	min-width: 100%;
+}
+
+@media screen and (min-width: 30em) {
+
+	.has-header-image.twentyseventeen-front-page .custom-header,
+	.has-header-video.twentyseventeen-front-page .custom-header,
+	.has-header-image.home.blog .custom-header,
+	.has-header-video.home.blog .custom-header,
+	.twentyseventeen-front-page.has-header-image .custom-header-media,
+	.home.blog.has-header-image .custom-header-media,
+	.panel-image {
+		height: 700px;
+	}
+}
+
+@media screen and (min-width: 48em) {
+
+	.has-header-image.twentyseventeen-front-page .custom-header,
+	.has-header-video.twentyseventeen-front-page .custom-header,
+	.has-header-image.home.blog .custom-header,
+	.has-header-video.home.blog .custom-header,
+	.twentyseventeen-front-page.has-header-image .custom-header-media,
+	.home.blog.has-header-image .custom-header-media,
+	.panel-image {
+		height: 1000px;
+	}
+}