Create the TwentyTwenty Demo Site using Block Templates

twentytwenty-blocks/block-styles.css

@@ -0,0 +1,109 @@
+.is-style-header-nav {
+	font-size: 1.8rem;
+	font-weight: 500;
+	letter-spacing: -0.0277em;
+	margin: -0.8rem 0 0 -1.6rem;
+	text-decoration: none;
+}
+
+.is-style-header-nav .wp-block-navigation-link {
+	padding: 0;
+	margin: 0 16px;
+}
+
+.is-style-header-nav .wp-block-navigation-link__content {
+	padding: 0;
+	text-decoration: none;
+}
+
+.is-style-header-nav .wp-block-navigation-link__content.has-submenu {
+	padding-bottom: 2rem;
+}
+
+.is-style-header-nav .wp-block-navigation-link__content:hover {
+	text-decoration: underline;
+}
+
+.is-style-header-nav > ul > li > a.wp-block-navigation-link__content {
+	padding-bottom: 2rem;
+}
+
+.is-style-header-nav .wp-block-navigation-link > ul {
+	background: #000;
+	border-color: #000;
+	border-radius: 0.4rem;
+	font-size: 1.7rem;
+	opacity: 0;
+	padding: 1rem 0;
+	transition: opacity 0.15s linear, transform 0.15s linear, right 0s 0.15s;
+	transform: translateY(0.6rem);
+}
+
+.is-style-header-nav .wp-block-navigation-link > ul:before {
+	border-color: transparent transparent black;
+}
+
+.is-style-header-nav .wp-block-navigation-link > ul:after {
+	border-color: transparent transparent black;
+}
+
+.is-style-header-nav .wp-block-navigation-link > ul a {
+	color: white;
+}
+
+@media (max-width: 699px) {
+	.is-style-header-nav.wp-block-navigation.items-justified-right>ul {
+		display: flex;
+		justify-content: space-between;
+	}
+}
+
+.is-style-header-site-title {
+	display: inline-block;
+	font-size: 2.4rem;
+	font-weight: 700;
+	line-height: 1;
+	margin-right: 2rem;
+}
+
+.is-style-header-site-title a {
+	color: black;
+	text-decoration: none;
+}
+
+.is-style-header-site-title a:hover {
+	text-decoration: underline;
+}
+
+.entry-content > .is-style-landing-page-columns.alignfull, 
+.entry-content > .is-style-landing-page-columns.alignfull h1 {
+	margin: 0;
+}
+
+@media ( min-width: 700px ){
+	.entry-content > .is-style-landing-page-columns.alignfull h1 {
+		margin: 12rem 0 5rem;
+	}
+}
+
+.is-style-featured-media-home::before {
+	background: #fff;
+	content: "";
+	display: block;
+	position: absolute;
+	bottom: 50%;
+	left: 0;
+	right: 0;
+	top: 0;
+}
+
+.is-style-header-cover.wp-block-cover.alignfull  {
+	align-items: flex-end;
+	background-attachment: fixed;
+	margin: 0;
+	min-height: 100vh;
+}
+
+.is-style-header-cover.wp-block-cover.alignfull .wp-block-cover__inner-container  {
+	padding: 6rem 0;
+}

twentytwenty-blocks/block-template-parts/footer.html

@@ -0,0 +1,79 @@
+<!-- wp:columns {"align":"wide","className":"footer-top"} -->
+<div class="wp-block-columns alignwide footer-top"><!-- wp:column {"width":63} -->
+<div class="wp-block-column" style="flex-basis:63%"><!-- wp:list {"className":"footer-menu reset-list-style"} -->
+<ul class="footer-menu reset-list-style"><li><a href="/">Home</a></li><li><a href="/exhibitions">Exhibitions</a></li><li><a href="/about">About Us</a></li><li><a href="http://news">News</a></li></ul>
+<!-- /wp:list --></div>
+<!-- /wp:column -->
+
+<!-- wp:column {"width":37} -->
+<div class="wp-block-column" style="flex-basis:37%"><!-- wp:social-links {"align":"right","className":"social-icons footer-social"} -->
+<ul class="wp-block-social-links alignright social-icons footer-social"><!-- wp:social-link-wordpress {"url":""} /-->
+
+<!-- wp:social-link-facebook {"url":"facebook.com/wordpress"} /-->
+
+<!-- wp:social-link-twitter {"url":"twitter.com/wordpress"} /-->
+
+<!-- wp:social-link-instagram {"url":"https://www.instagram.com/explore/tags/wordcamp/"} /-->
+
+<!-- wp:social-link-mail {"url":"mailto:[email protected]"} /-->
+
+<!-- wp:social-link-mail /--></ul>
+<!-- /wp:social-links --></div>
+<!-- /wp:column --></div>
+<!-- /wp:columns -->
+
+<!-- wp:separator {"className":"is-style-wide"} -->
+<hr class="wp-block-separator is-style-wide"/>
+<!-- /wp:separator -->
+
+<!-- wp:columns {"align":"wide"} -->
+<div class="wp-block-columns alignwide"><!-- wp:column {"className":"widget_text"} -->
+<div class="wp-block-column widget_text"><!-- wp:heading {"level":3} -->
+<h3>About the UMOMA</h3>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"className":"widget-content widget-text"} -->
+<p class="widget-content widget-text">In seven floors of striking architecture UMoMA shows exhibitions of international contemporary art, sometimes along with art historical retrospectives. Existential, political and philosophical issues are intrinsic to our programme. As visitor you are invited to guided tours, artist talks, lectures, film screenings and other events with free admission.</p>
+<!-- /wp:paragraph -->
+
+<!-- wp:buttons -->
+<div class="wp-block-buttons"><!-- wp:button {"textColor":"accent","customBackgroundColor":"#ffffff","className":"is-style-outline"} -->
+<div class="wp-block-button is-style-outline"><a class="wp-block-button__link has-text-color has-accent-color has-background" style="background-color:#ffffff">Read More</a></div>
+<!-- /wp:button --></div>
+<!-- /wp:buttons --></div>
+<!-- /wp:column -->
+
+<!-- wp:column {"className":"widget_text"} -->
+<div class="wp-block-column widget_text"><!-- wp:heading {"level":3} -->
+<h3>Find Us</h3>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"className":"widget-content"} -->
+<p class="widget-content"><strong>Address</strong><br>123 Main Street<br>New York, NY 10001</p>
+<!-- /wp:paragraph -->
+
+<!-- wp:paragraph {"className":"widget-content"} -->
+<p class="widget-content"><strong>Hours</strong><br>Monday—Friday: 9:00AM–5:00PM<br>Saturday &amp; Sunday: 11:00AM–3:00PM</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:column --></div>
+<!-- /wp:columns -->
+
+<!-- wp:separator {"className":"is-style-wide"} -->
+<hr class="wp-block-separator is-style-wide"/>
+<!-- /wp:separator -->
+
+<!-- wp:columns {"align":"wide"} -->
+<div class="wp-block-columns alignwide"><!-- wp:column {"width":66.66,"className":"footer-credits"} -->
+<div class="wp-block-column footer-credits" style="flex-basis:66.66%"><!-- wp:paragraph -->
+<p><strong>© 2020</strong> <a href="https://combative-cheetah.jurassic.ninja/">TwentyTwenty</a></p>
+<!-- /wp:paragraph -->
+
+<!-- wp:paragraph {"className":"powered-by-wordpress"} -->
+<p class="powered-by-wordpress"><a href="https://wordpress.org">Powered by WordPress</a></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:column -->
+
+<!-- wp:column {"width":33.33} -->
+<div class="wp-block-column" style="flex-basis:33.33%"></div>
+<!-- /wp:column --></div>
+<!-- /wp:columns -->

twentytwenty-blocks/block-template-parts/header.html

@@ -0,0 +1,23 @@
+<!-- wp:columns {"align":"full"} -->
+<div class="wp-block-columns alignfull"><!-- wp:column -->
+	<div class="wp-block-column"><!-- wp:heading {"level":1,"className":"is-style-header-site-title"} -->
+		<h1 class="is-style-header-site-title"><a href="/">Twenty Twenty</a></h1>
+		<!-- /wp:heading -->
+
+		<!-- wp:paragraph {"className":"site-description"} -->
+		<p class="site-description">Just another WordPress site</p>
+		<!-- /wp:paragraph --></div>
+	<!-- /wp:column -->
+
+	<!-- wp:column -->
+	<div class="wp-block-column"><!-- wp:navigation {"className":"is-style-header-nav","itemsJustification":"right"} -->
+		<!-- wp:navigation-link {"label":"Home","title":"Home","type":"page","url":"/"} /-->
+
+		<!-- wp:navigation-link {"label":"About","title":"About","url":"/about"} /-->
+
+		<!-- wp:navigation-link {"label":"Blog","title":"Blog","url":"/blog"} /-->
+
+		<!-- wp:navigation-link {"label":"Contact","title":"Contact","url":"/contact"} /-->
+		<!-- /wp:navigation --></div>
+	<!-- /wp:column --></div>
+<!-- /wp:columns -->

twentytwenty-blocks/block-templates/index.html

@@ -0,0 +1,12 @@
+<header class="site-header">
+	<!-- wp:template-part {"slug":"header","theme":"twentytwenty-blocks"} /-->
+</header>
+
+<main class="site-content">
+	<!-- wp:post-title /-->
+	<!-- wp:post-content /-->
+</main>
+
+<footer id="site-footer" class="site-footer">
+	<!-- wp:template-part {"slug":"footer","theme":"twentytwenty-blocks"} /-->
+</footer>