UI Learn: Use single-column listing.

Uses component from components.pug

src/templates/learn.pug

@@ -11,10 +11,9 @@ include ../../../pillar/src/templates/mixins/components
 | {% endblock navigation_tabs %}
 
 | {% block body %}
-.container.pb-5
+.container.py-4
 	.row
 		.col-12
-			.pt-4
 			h2.text-uppercase.font-weight-bold
 				| Learn
 			.lead
@@ -22,52 +21,26 @@ include ../../../pillar/src/templates/mixins/components
 
 			hr.pb-2
 
-	.page-triplet-container.homepage.p-0
-		.row
-			.col-md-4
-				.triplet-card(data-url="{{ url_for('cloud.courses') }}")
-					.triplet-card-thumbnail
-						img(
-							alt="Courses",
-							src="{{ url_for('static', filename='assets/img/features/training_motion_graphics.jpg')}}")
-					.triplet-card-info
-						h3 Courses
-						p.
-							Character modeling, 3D printing, VFX, rigging and more.
-						a.triplet-cta(href="{{ url_for('cloud.courses') }}")
-							| LEARN MORE
+	+category_list_item(
+		'COURSES',
+		'Character modeling, 3D printing, VFX, rigging and more.',
+		"{{ url_for('cloud.courses') }}",
+		"{{ url_for('static', filename='assets/img/features/training_motion_graphics.jpg')}}")
 
-			.col-md-4
-				.triplet-card(data-url="{{ url_for('cloud.workshops') }}")
-					.triplet-card-thumbnail
-						img(
-							alt="Workshops",
-							src="{{ url_for('static', filename='assets/img/features/training_minecraft_animation.jpg')}}")
-					.triplet-card-info
-						h3 Workshops
-						p.
-							Enter the artist workshop and learn by example.
-						a.triplet-cta(href="{{ url_for('cloud.workshops') }}")
-							| LEARN MORE
+	hr
 
-			.col-md-4
-				.triplet-card(data-url="{{ url_for('cloud.production') }}")
-					.triplet-card-thumbnail
-						img(
-							alt="Production Lessons",
-							src="{{ url_for('static', filename='assets/img/features/open_movies_02.jpg')}}")
-					.triplet-card-info
-						h3 Production Lessons
-						p.
-							Tips and tricks by the open projects crew.
-						a.triplet-cta(href="{{ url_for('cloud.production') }}")
-							| LEARN MORE
+	+category_list_item(
+		'WORKSHOPS',
+		'Enter the artist workshop and learn by example.',
+		"{{ url_for('cloud.workshops') }}",
+		"{{ url_for('static', filename='assets/img/features/training_minecraft_animation.jpg')}}")
+
+	hr
+
+	+category_list_item(
+		'PRODUCTION LESSONS',
+		'Tips and tricks by the Open Projects crew.',
+		"{{ url_for('cloud.production') }}",
+		"{{ url_for('static', filename='assets/img/features/open_movies_02.jpg')}}")
 
 | {% endblock body %}
-
-| {% block footer_scripts %}
-script.
-	$('.triplet-card').click(function(){
-		window.location.href = $(this).attr('data-url');
-	});
-| {% endblock footer_scripts %}