Add Learning Pathway cards block to home and landing pages (#2452)

* Add Learning Pathway Cards block

* Refine homepage styles and layout

* Add full card markup

* Update images

* Update Learning Pathways page

wp-content/themes/pub/wporg-learn-2024/functions.php

@@ -2,6 +2,9 @@
 
 namespace WordPressdotorg\Theme\Learn_2024;
 
+// Block files
+require_once __DIR__ . '/src/learning-pathway-cards/block.php';
+
 /**
  * Actions and filters.
  */

wp-content/themes/pub/wporg-learn-2024/patterns/front-page-content.php

@@ -7,14 +7,10 @@
 
 ?>
 
-<!-- wp:group {"align":"wide","layout":{"type":"default"}} -->
-<div class="wp-block-group alignwide">
+<!-- wp:heading {"style":{"spacing":{"margin":{"top":"0","bottom":"var:preset|spacing|10"}}}} -->
+<h2 class="wp-block-heading" style="margin-top:0;margin-bottom:var(--wp--preset--spacing--10)"><?php esc_html_e( 'Get Started', 'wporg-learn' ); ?></h2>
+<!-- /wp:heading -->
 
-	<!-- wp:heading {"style":{"typography":{"fontStyle":"normal","fontWeight":"600"}},"className":"is-style-short-text","fontSize":"heading-5"} -->
-	<h2 class="wp-block-heading is-style-short-text has-heading-5-font-size" style="font-style:normal;font-weight:600"><?php esc_html_e( 'Get Started', 'wporg-learn' ); ?></h2>
-	<!-- /wp:heading -->
-
-	<!-- wp:pattern {"slug":"wporg-learn-2024/learning-pathways-terms"} /-->
-
-</div>
-<!-- /wp:group -->
+<!-- wp:paragraph {"style":{"spacing":{"margin":{"top":"0"}}}} -->
+<p style="margin-top:0"><?php esc_html_e( 'Dive into our learning pathways which will take you from beginner to expert at your own pace.', 'wporg-learn' ); ?></p>
+<!-- /wp:paragraph -->

wp-content/themes/pub/wporg-learn-2024/patterns/front-page-header.php

@@ -22,19 +22,17 @@
 
 	<!-- wp:group {"align":"wide","style":{"spacing":{"padding":{"top":"var:preset|spacing|40","bottom":"var:preset|spacing|30"},"blockGap":"var:preset|spacing|30"}},"layout":{"type":"flex","flexWrap":"wrap","verticalAlignment":"bottom"}} -->
 	<div class="wp-block-group alignwide" style="padding-top:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--30)">
-	
+
 		<!-- wp:heading {"level":1,"style":{"typography":{"fontSize":"50px","fontStyle":"normal","fontWeight":"400"}},"fontFamily":"eb-garamond"} -->
 		<h1 class="wp-block-heading has-eb-garamond-font-family" style="font-size:50px;font-style:normal;font-weight:400"><?php esc_html_e( 'Learn WordPress', 'wporg-learn' ); ?></h1>
 		<!-- /wp:heading -->
 
 		<!-- wp:paragraph {"style":{"typography":{"lineHeight":"2.3"}},"textColor":"white"} -->
 		<p class="has-white-color has-text-color" style="line-height:2.3"><?php esc_html_e( 'Your free educational resource for how to use, extend, and build with WordPress', 'wporg-learn' ); ?></p>
 		<!-- /wp:paragraph -->
-	
+
 	</div>
 	<!-- /wp:group -->
 
-	<!-- wp:pattern {"slug":"wporg-learn-2024/search-field"} /-->
-
 </div>
 <!-- /wp:group -->

wp-content/themes/pub/wporg-learn-2024/patterns/page-learning-pathways-content.php

@@ -0,0 +1,23 @@
+<?php
+/**
+ * Title: Learning Pathways Page Content
+ * Slug: wporg-learn-2024/page-learning-pathways-content
+ * Inserter: no
+ */
+
+?>
+
+<!-- wp:paragraph {"style":{"spacing":{"margin":{"top":"0"}}}} -->
+<p style="margin-top:0"><?php esc_html_e( 'Dive into our learning pathways which will take you from beginner to expert at your own pace.', 'wporg-learn' ); ?></p>
+<!-- /wp:paragraph -->
+
+<!-- wp:buttons {"style":{"spacing":{"margin":{"bottom":"var:preset|spacing|50"}}}} -->
+<div class="wp-block-buttons" style="margin-bottom:var(--wp--preset--spacing--50)">
+
+	<!-- wp:button -->
+	<div class="wp-block-button"><a class="wp-block-button__link wp-element-button" href="/my-courses/"><?php esc_html_e( 'My Courses', 'wporg-learn' ); ?></a>
+	</div>
+	<!-- /wp:button -->
+
+</div>
+<!-- /wp:buttons -->

wp-content/themes/pub/wporg-learn-2024/src/learning-pathway-cards/block.json

@@ -0,0 +1,29 @@
+{
+	"$schema": "https://schemas.wp.org/trunk/block.json",
+	"apiVersion": 2,
+	"name": "wporg-learn/learning-pathway-cards",
+	"version": "0.1.0",
+	"title": "Learning Pathway Cards",
+	"category": "widgets",
+	"icon": "smiley",
+	"description": "Show a cards grid of non-empty Learning Pathway terms",
+	"usesContext": [],
+	"attributes": {
+		"isMini": {
+			"type": "boolean",
+			"default": false
+		}
+	},
+	"supports": {
+		"html": false,
+		"spacing": {
+			"margin": [
+				"top",
+				"bottom"
+			]
+		}
+	},
+	"textdomain": "wporg",
+	"editorScript": "file:./index.js",
+	"style": "file:./style-index.css"
+}