New templates for /learn and /libraries

cloud/routes.py

@@ -169,6 +169,16 @@ def services():
     return render_template('services.html')
 
 
+@blueprint.route('/learn')
+def learn():
+    return render_template('learn.html')
+
+
+@blueprint.route('/libraries')
+def libraries():
+    return render_template('libraries.html')
+
+
 @blueprint.route('/stats')
 def stats():
     return render_template('stats.html')

src/templates/_footer.pug

@@ -27,7 +27,8 @@
 
 				.col-md-2.col-xs-6
 					h7.font-weight-bold
-						| TRAINING
+						a.d-block.pb-2(href="{{ url_for('cloud.learn') }}")
+							| LEARN
 
 					ul.list-unstyled
 						li
@@ -42,7 +43,8 @@
 
 				.col-md-2.col-xs-6
 					h7.font-weight-bold
-						| LIBRARIES
+						a.d-block.pb-2(href="{{ url_for('cloud.libraries') }}")
+							| LIBRARIES
 
 					ul.list-unstyled
 						li
@@ -63,7 +65,7 @@
 
 				.col-md-2.col-xs-6
 					h7.font-weight-bold
-						a(href="{{ url_for('cloud.services') }}")
+						a.d-block.pb-2(href="{{ url_for('cloud.services') }}")
 							| SERVICES
 
 					ul.list-unstyled
@@ -89,7 +91,7 @@
 								| Image Sharing
 
 				.col-md-2.col-xs-6
-					h7.font-weight-bold
+					h7.font-weight-bold.d-block.pb-2
 						| RESOURCES
 					ul.list-unstyled
 						li

src/templates/_macros/_navigation.pug

@@ -29,14 +29,15 @@ include ../../../../pillar/src/templates/mixins/components
 		span Services
 | {% endmacro %}
 
-| {% macro navigation_collection(title) %}
+| {% macro navigation_learn(title) %}
 +nav-secondary
-	| {% if title in ['courses', 'workshops', 'production'] %}
+	| {% if title in ['learn', 'courses', 'workshops', 'production'] %}
-	li
+	+nav-secondary-link(
-		.nav-link.pointer-events-none.px-0
+			class="px-0 text-black-50 {% if title == 'learn' %}active{% endif %}",
-			span Learn
+			href="{{ url_for('cloud.learn') }}")
+		span Learn
 
-	li.px-1
+	li.pl-1
 		i.pi-angle-right
 
 	+nav-secondary-link(
@@ -57,11 +58,36 @@ include ../../../../pillar/src/templates/mixins/components
 	| {% elif title in ['open-projects'] %}
 	+nav-secondary-link(
 			class="{% if title == 'open-projects' %}active{% endif %}",
-			href="{{ url_for('projects.view', project_url='gallery') }}")
+			href="{{ url_for('cloud.open_projects') }}")
 		span Open Projects
 	| {% endif %}
 | {% endmacro %}
 
+
+| {% macro navigation_libraries(title) %}
++nav-secondary
+	+nav-secondary-link(
+			class="px-0 active",
+			href="{{ url_for('cloud.libraries') }}")
+		span Libraries
+
+	li.pl-1
+		i.pi-angle-right
+
+	+nav-secondary-link(
+			href="{{ url_for('projects.view', project_url='textures') }}")
+		span Textures
+
+	+nav-secondary-link(
+			href="{{ url_for('projects.view', project_url='hdri') }}")
+		span HDRI
+
+	+nav-secondary-link(
+		href="{{ url_for('projects.view', project_url='characters') }}")
+		span Characters
+| {% endmacro %}
+
+
 | {% macro navigation_home_project(title) %}
 +nav-secondary()
 		+nav-secondary-link(
@@ -91,50 +117,60 @@ include ../../../../pillar/src/templates/mixins/components
 			span Blender Sync
 | {% endmacro %}
 
+
 | {% macro navigation_services(title) %}
 +nav-secondary()
-		li
+	+nav-secondary-link(
-			a.nav-link.active.px-0(href="{{ url_for('cloud.services') }}")
+			class="px-0 active",
-				span Services
+			href="{{ url_for('cloud.services') }}")
+		span Services
 
-		li.px-1
+	li.pl-1
-			i.pi-angle-right
+		i.pi-angle-right
 
-		+nav-secondary-link(
+	+nav-secondary-link(
-			href="/attract")
+		href="/attract")
-			i.pi-attract.pr-2
+		i.pi-attract.pr-2
-			span Attract
+		span Attract
 
-		+nav-secondary-link(
+	+nav-secondary-link(
-			href="/flamenco")
+		href="/flamenco")
-			i.pi-flamenco.pr-2
+		i.pi-flamenco.pr-2
-			span Flamenco
+		span Flamenco
 | {% endmacro %}
 
+
 | {% macro navigation_project(project, navigation_links, title) %}
 
 | {% if project.category == 'course' %}
 | {% set category_url = url_for('cloud.courses') %}
+| {% set category_title = 'Courses' %}
+
 | {% elif project.category == 'workshop' %}
 | {% set category_url = url_for('cloud.workshops') %}
+| {% set category_title = 'Workshops' %}
+
 | {% elif project.category == 'film' %}
 | {% set category_url = url_for('cloud.open_projects') %}
+| {% set category_title = 'Open Projects' %}
+
+| {% elif project.category == 'assets' %}
+| {% set category_url = url_for('cloud.libraries') %}
+| {% set category_title = 'Libraries' %}
+
 | {% else %}
 | {% set category_url = url_for('main.homepage') %}
+| {% set category_title = project.category %}
 | {% endif %}
 
 +nav-secondary()
 	| {% if project.url != 'blender-cloud' %}
 	| {% if not project.is_private %}
-	li.text-capitalize
+	+nav-secondary-link(
-		a.nav-link.text-muted.px-0(href="{{ category_url }}")
+			class="px-0 text-black-50 text-capitalize",
-			| {% if project.category == 'film' %}
+			href="{{ category_url }}")
-			span Open Projects
+		span {{ category_title }}
-			| {% elif project.category == 'assets' %}
+
-			span Libraries
-			| {% else %}
-			span {{ project.category }}
-			| {% endif %}
 	li.px-1
 		i.pi-angle-right
 	| {% endif %}
@@ -143,7 +179,6 @@ include ../../../../pillar/src/templates/mixins/components
 		class="px-1 font-weight-bold{% if title == 'landing' %} active{% endif %}",
 		href="{{url_for('projects.view', project_url=project.url, _external=True)}}")
 		span {{ project.name }}
-
 	| {% endif %}
 
 	| {% for link in navigation_links %}

src/templates/learn.pug

@@ -0,0 +1,73 @@
+| {% extends 'layout.html' %}
+| {% from '_macros/_navigation.html' import navigation_learn %}
+include ../../../pillar/src/templates/mixins/components
+
+| {% set title = 'learn' %}
+
+| {% block page_title %}Learn{% endblock %}
+
+| {% block navigation_tabs %}
+| {{ navigation_learn(title) }}
+| {% endblock navigation_tabs %}
+
+| {% block body %}
+.container.pb-5
+	.row
+		.col-12
+			.pt-4
+				h2.text-uppercase.font-weight-bold
+					| Learn
+				.lead
+					| Production quality training by Blender professionals.
+
+				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
+
+			.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
+
+			.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
+
+| {% endblock body %}
+
+| {% block footer_scripts %}
+script.
+	$('.triplet-card').click(function(){
+		window.location.href = $(this).attr('data-url');
+	});
+| {% endblock footer_scripts %}

src/templates/libraries.pug

@@ -0,0 +1,75 @@
+| {% extends 'layout.html' %}
+| {% from '_macros/_navigation.html' import navigation_libraries %}
+include ../../../pillar/src/templates/mixins/components
+
+| {% set title = 'libraries' %}
+
+| {% block page_title %}Libraries{% endblock %}
+
+| {% block navigation_tabs %}
+| {{ navigation_libraries(title) }}
+| {% endblock navigation_tabs %}
+
+| {% block body %}
+.container.pb-5
+	.row
+		.col-12
+			.pt-4
+				h2.text-uppercase.font-weight-bold
+					| Libraries
+				.lead
+					| Download 1000s of files and assets.
+
+				hr.pb-2
+
+	.page-triplet-container.homepage.p-0
+		.row
+			.col-md-4
+				.triplet-card(data-url="{{ url_for('projects.view', project_url='textures') }}")
+					.triplet-card-thumbnail
+						img(
+							alt="Textures",
+							src="{{ url_for('static', filename='assets/img/features/textures_01.jpg')}}")
+					.triplet-card-info
+						h3 Textures
+						p.
+								More than 1500 texture maps.
+								Browse online or from Blender with our add-on.
+
+						a.triplet-cta(href="{{ url_for('projects.view', project_url='textures') }}")
+							| LEARN MORE
+
+			.col-md-4
+				.triplet-card(data-url="{{ url_for('projects.view', project_url='hdri') }}")
+					.triplet-card-thumbnail
+						img(
+							alt="HDRI",
+							src="{{ url_for('static', filename='assets/img/features/hdri_01.jpg')}}")
+					.triplet-card-info
+						h3 HDRI
+						p.
+							Up to 16K and 24 EVs (extremely high) HDR images to light your renders.
+						a.triplet-cta(href="{{ url_for('projects.view', project_url='hdri') }}")
+							| LEARN MORE
+
+			.col-md-4
+				.triplet-card(data-url="{{ url_for('projects.view', project_url='characters') }}")
+					.triplet-card-thumbnail
+						img(
+							alt="Characters",
+							src="{{ url_for('static', filename='assets/img/features/characters_01.jpg')}}")
+					.triplet-card-info
+						h3 Characters
+						p.
+							Production quality, fully rigged and shaded characters ready to animate.
+						a.triplet-cta(href="{{ url_for('projects.view', project_url='characters') }}")
+							| LEARN MORE
+
+| {% endblock body %}
+
+| {% block footer_scripts %}
+script.
+	$('.triplet-card').click(function(){
+		window.location.href = $(this).attr('data-url');
+	});
+| {% endblock footer_scripts %}

src/templates/menus/_dropdown_main.pug

@@ -17,19 +17,19 @@ ul.dropdown-menu.nav-main
 			i.mr-2.pi-film-thick
 			span Open Projects
 
-		li.nav-item
+		+nav-secondary-link(
-			.nav-link(
+			href="{{ url_for('cloud.learn') }}",
-				data-toggle='dropdown-tab',
+			data-toggle='dropdown-tab',
-				data-tab-target='training')
+			data-tab-target='learn')
-				i.mr-2.pi-graduation-cap
+			i.mr-2.pi-graduation-cap
-				span Learn
+			span Learn
 
-		li.nav-item
+		+nav-secondary-link(
-			.nav-link(
+			href="{{ url_for('cloud.libraries') }}",
-				data-toggle='dropdown-tab',
+			data-toggle='dropdown-tab',
-				data-tab-target='libraries')
+			data-tab-target='libraries')
-				i.mr-2.pi-file-archive
+			i.mr-2.pi-file-archive
-				span Libraries
+			span Libraries
 
 		+nav-secondary-link(
 			href="{{ url_for('cloud.services') }}",
@@ -76,7 +76,7 @@ ul.dropdown-menu.nav-main
 					href="{{ url_for('cloud.open_projects') }}",
 					class="nav-see-more border-bottom")
 					span.font-weight-bold
-						| All Open Projects
+						| Open Projects
 					i.pi-angle-right.pl-2
 
 				+nav-secondary-link(
@@ -95,13 +95,15 @@ ul.dropdown-menu.nav-main
 					href="{{ url_for('projects.view', project_url='agent-327') }}")
 					span Agent 327
 
-	.dropdown-menu-tab(data-tab='training')
+	.dropdown-menu-tab(data-tab='learn')
 		.dropdown-menu-column
 			+nav-secondary()(class="nav-secondary-vertical rounded-right border-left overflow-hidden")
-				li.nav-item
+				+nav-secondary-link(
-					.nav-link.border-bottom.pointer-events-none
+					href="{{ url_for('cloud.learn') }}",
-						span.font-weight-bold
+					class="nav-see-more border-bottom")
-							| Learn
+					span.font-weight-bold
+						| Learn
+					i.pi-angle-right.pl-2
 
 				+nav-secondary-link(
 					href="{{ url_for('cloud.courses') }}")
@@ -121,10 +123,12 @@ ul.dropdown-menu.nav-main
 	.dropdown-menu-tab(data-tab='libraries')
 		.dropdown-menu-column
 			+nav-secondary()(class="nav-secondary-vertical rounded-right border-left overflow-hidden")
-				li.nav-item
+				+nav-secondary-link(
-					.nav-link.border-bottom.pointer-events-none
+					href="{{ url_for('cloud.libraries') }}",
-						span.font-weight-bold
+					class="nav-see-more border-bottom")
-							| Libraries
+					span.font-weight-bold
+						| Libraries
+					i.pi-angle-right.pl-2
 
 				+nav-secondary-link(
 					href="{{ url_for('projects.view', project_url='textures') }}")

src/templates/production.pug

@@ -1,5 +1,5 @@
 | {% extends 'layout.html' %}
-| {% from '_macros/_navigation.html' import navigation_collection %}
+| {% from '_macros/_navigation.html' import navigation_learn %}
 
 include ../../../pillar/src/templates/mixins/components
 
@@ -12,10 +12,10 @@ mixin group(title, tag)
 			+card-deck(data-asset-tag=tag, class="js-asset-list py-3")
 
 | {% block page_title %}Production Lessons{% endblock %}
-| {% set page_header_text = "Tips and tricks by the Open Movie crew." %}
+| {% set page_header_text = "Tips and tricks by the Open Projects crew." %}
 
 | {% block navigation_tabs %}
-| {{ navigation_collection(title) }}
+| {{ navigation_learn(title) }}
 | {% endblock navigation_tabs %}
 
 | {% block head %}
@@ -27,31 +27,34 @@ script.
 	});
 | {% endblock %}
 | {% block body %}
-+jumbotron(
+.container.pb-5
-	'{{ self.page_title() }}',
+	.row
-	'{{ page_header_text }}',
+		.col-12
-	"{{ url_for('static', filename='assets/img/backgrounds/background_agent327_04.jpg')}}")(
+			.pt-4
-		class="jumbotron-overlay",
+				h2.text-uppercase.font-weight-bold
-		style="background-position: center top")
+					| {{ self.page_title() }}
+				.lead
+					| {{ page_header_text }}
 
-.container
+				hr.pb-2
-	+group('Walk-through', 'walk-through')
-	+group('Modeling', 'modeling')
-	+group('Sculpting', 'sculpting')
-	+group('Animation', 'animation')
-	+group('Shading', 'shading')
-	+group('Texturing', 'texturing')
-	+group('Character Pipeline', 'character-pipeline')
-	+group('Rigging', 'rigging')
-	+group('Lighting & Rendering', 'lighting')
-	+group('Simulation & Effects', 'effects')
-	+group('Video Editing', 'video-editing')
-	+group('Digital Painting', 'digital-painting')
-	+group('Production Design', 'production-design')
 
-	a.d-block.py-5.text-center.text-muted(
+			+group('Walk-through', 'walk-through')
-		href="{{ url_for('main.nodes_search_index') }}")
+			+group('Modeling', 'modeling')
-		| Search Blender Cloud to find even more content
+			+group('Sculpting', 'sculpting')
-		i.pi-angle-right.pl-1
+			+group('Animation', 'animation')
+			+group('Shading', 'shading')
+			+group('Texturing', 'texturing')
+			+group('Character Pipeline', 'character-pipeline')
+			+group('Rigging', 'rigging')
+			+group('Lighting & Rendering', 'lighting')
+			+group('Simulation & Effects', 'effects')
+			+group('Video Editing', 'video-editing')
+			+group('Digital Painting', 'digital-painting')
+			+group('Production Design', 'production-design')
+
+			a.d-block.py-5.text-center.text-muted(
+				href="{{ url_for('main.nodes_search_index') }}")
+				| Search Blender Cloud to find even more content
+				i.pi-angle-right.pl-1
 
 | {% endblock body%}

src/templates/projects/view.pug

@@ -87,7 +87,6 @@ link(href="{{ url_for('static_cloud', filename='assets/css/project-main.css') }}
 | {% endblock %}
 
 | {% block navigation_tabs %}
-| {% from '_macros/_navigation.html' import navigation_collection %}
 | {{ navigation_project(project, navigation_links, title) }}
 | {% endblock navigation_tabs %}
 

src/templates/projects_index_collection.pug

@@ -1,5 +1,5 @@
 | {% extends 'layout.html' %}
-| {% from '_macros/_navigation.html' import navigation_collection, navigation_homepage %}
+| {% from '_macros/_navigation.html' import navigation_learn, navigation_homepage %}
 
 include ../../../pillar/src/templates/mixins/components
 
@@ -45,7 +45,7 @@ meta(name="twitter:image", content="{{ page_header_image }}")
 | {% if title == 'open-projects' %}
 | {{ navigation_homepage(title) }}
 | {% else %}
-| {{ navigation_collection(title) }}
+| {{ navigation_learn(title) }}
 | {% endif %}
 | {% endblock navigation_tabs %}