Adds tutorial video to all the places

CHANGELOG.md

@@ -6,6 +6,10 @@ The format is based on [Keep a Changelog](http://keepachangelog.com/) and this p
 
 ## [Unreleased]
 
+## Added
+
+- Adds getting started tutorial video to the Welcome, Get Started walkthrough, GitLens Home view, and README
+
 ## Fixed
 
 - Fixes [#2037](https://github.com/gitkraken/vscode-gitlens/issues/2037) - Autolinks can end up getting saved with invalid (cached) properties

README.md

@@ -13,7 +13,7 @@
 
 <p align="center">
   <br />
-  <a title="What's New in GitLens 12" href="https://gitkraken.com/blog/gitlens-12"><img width="600px" src="./src/webviews/apps/media/gitlens-12-card.png" alt="Open What's New in GitLens 12" /></a>
+  <a title="Watch the GitLens Getting Started video" href="https://www.youtube.com/watch?v=UQPb73Zz9qk"><img width="600px" src="./src/webviews/apps/media/gitlens-tutorial-banner.png" alt="Watch the GitLens Getting Started video" /></a>
   <br/>
 </p>
 

package.json

@@ -10983,6 +10983,14 @@
 				"description": "Discover and personalize features that supercharge your Git experience",
 				"steps": [
 					{
+						"id": "gitlens.welcome.tutorial",
+						"title": "Watch Tutorial",
+						"description": "Sit back and watch the Getting Started video.\n\n[Watch Tutorial Video](https://www.youtube.com/watch?v=UQPb73Zz9qk \"Watch the Getting Started video\")",
+						"media": {
+							"markdown": "walkthroughs/getting-started/0-tutorial.md"
+						}
+					},
+					{
 						"id": "gitlens.welcome.experience",
 						"title": "Get setup quickly",
 						"description": "Use the Quick Setup to easily configure frequently used GitLens features.\n\n[Open Quick Setup](command:gitlens.showWelcomePage?%22quick-setup%22 \"Opens the GitLens Quick Setup\")",

src/webviews/apps/home/partials/welcome.html

@@ -1,7 +1,15 @@
 <template id="welcome">
 	<h3>Welcome to GitLens 12</h3>
-	<a class="link--preview" title="See What's New" href="command:gitlens.showWelcomePage">
-		<img class="image--preview" src="#{webroot}/media/gitlens-12-card.webp" alt="What's new" />
+	<a
+		class="link--preview"
+		title="Watch the GitLens Getting Started video"
+		href="https://www.youtube.com/watch?v=UQPb73Zz9qk"
+	>
+		<img
+			class="image--preview"
+			src="#{webroot}/media/gitlens-tutorial-banner-400.webp"
+			alt="Watch the GitLens Getting Started video"
+		/>
 	</a>
 	<p>
 		GitLens <b>supercharges</b> Git inside VS Code and unlocks the <b>untapped knowledge</b> within each repository.

src/webviews/apps/welcome/welcome.html

@@ -39,9 +39,15 @@
 						Welcome to <span class="highlight">GitLens 12</span>
 					</h2>
 					<div class="section__whatsnew">
-						<a title="See What's New" href="https://gitkraken.com/blog/gitlens-12"
-							><img src="#{webroot}/media/gitlens-12-card.webp"
-						/></a>
+						<a
+							title="Watch the GitLens Getting Started video"
+							href="https://www.youtube.com/watch?v=UQPb73Zz9qk"
+						>
+							<img
+								src="#{webroot}/media/gitlens-tutorial-banner.webp"
+								alt="Watch the GitLens Getting Started video"
+							/>
+						</a>
 						<a
 							class="button button--flat"
 							title="See What's New"

walkthroughs/getting-started/0-tutorial.md

@@ -0,0 +1,7 @@
+<p align="center">
+  <a title="Watch GitLens Getting Started video" href="https://www.youtube.com/watch?v=UQPb73Zz9qk">
+    <img src="../../images/docs/gitlens-tutorial.png" alt="GitLens Getting Started video" />
+  </a>
+</p>
+
+GitLens **supercharges** Git inside VS Code and unlocks the <b>untapped knowledge</b> within each repository. Whether you’re a seasoned Git user or just getting started, GitLens makes it easier, safer and faster to leverage the full power of Git. This tutorial will show you how to get the most out of GitLens in VS Code.

walkthroughs/getting-started/2-customize.md

@@ -1,9 +1,7 @@
 ## Customize GitLens
 
 <p align="center">
-  <figure>
-    <img src="../../images/docs/settings.png" alt="GitLens Interactive Settings" />
-  </figure>
+  <img src="../../images/docs/settings.png" alt="GitLens Interactive Settings" />
 </p>
 
 GitLens provides a rich interactive settings editor, an easy-to-use interface, to configure many of GitLens' powerful features.