File tree 3 files changed +62
-0
lines changed 3 files changed +62
-0
lines changed Original file line number Diff line number Diff line change
1
+ ---
2
+ title : " Videos"
3
+ description : " Videos for learning Aurelia"
4
+ url : " /videos/"
5
+ type : " videos"
6
+ videos :
7
+ - title : " Working with AppTasks in Aurelia 2"
8
+ youtube_id : " gR5pdsYh1uU"
9
+ description : " Learn how to use AppTasks and how they differ from other Aurelia lifecycles."
10
+ ---
11
+
12
+ Learn about the fundamentals of Aurelia and how to work with its numerous APIs through our video tutorials.
13
+
14
+ ## Tutorial Videos
15
+
16
+ Below you'll find a curated collection of videos to help you master Aurelia 2.
17
+
Original file line number Diff line number Diff line change 32
32
- name : " Resources"
33
33
link : " /learn"
34
34
active : " eq .RelPermalink '/learn/'"
35
+ - name : " Videos"
36
+ link : " /videos"
37
+ active : " eq .RelPermalink '/videos/'"
35
38
- title : " Community"
36
39
items :
37
40
- name : " Newsletter"
Original file line number Diff line number Diff line change
1
+ {{ define "main" }}
2
+
3
+ {{ partial "page-header" . }}
4
+
5
+ <!-- Video Content -->
6
+ < article class ="py-4 bg-white ">
7
+ < div class ="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 ">
8
+ < div class ="prose prose-lg max-w-none
9
+ prose-h1:text-4xl prose-h1:font-bold prose-h1:mb-8 prose-h1:text-gray-900
10
+ prose-h2:text-3xl prose-h2:font-bold prose-h2:mb-6 prose-h2:mt-12 prose-h2:text-gray-900
11
+ prose-h3:text-2xl prose-h3:font-bold prose-h3:mb-4 prose-h3:mt-8 prose-h3:text-gray-900
12
+ prose-p:text-base prose-p:leading-relaxed prose-p:mb-6 prose-p:text-gray-700 ">
13
+ {{ .Content }}
14
+
15
+ <!-- Videos Grid -->
16
+ {{ with .Params.videos }}
17
+ < div class ="grid gap-8 mt-8 ">
18
+ {{ range . }}
19
+ < div class ="video-container bg-gray-50 rounded-xl overflow-hidden shadow-md hover:shadow-lg transition-shadow duration-300 ">
20
+ <!-- Video container with correct 16:9 aspect ratio (56.25%) -->
21
+ < div class ="relative " style ="padding-bottom: 56.25% ">
22
+ < iframe
23
+ src ="https://www.youtube.com/embed/{{ .youtube_id }} "
24
+ class ="absolute top-0 left-0 w-full h-full "
25
+ title ="{{ .title }} "
26
+ frameborder ="0 "
27
+ allow ="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture "
28
+ allowfullscreen >
29
+ </ iframe >
30
+ </ div >
31
+ < div class ="p-6 ">
32
+ < h3 class ="text-xl font-semibold text-gray-900 mb-2 "> {{ .title }}</ h3 >
33
+ < p class ="text-gray-600 "> {{ .description }}</ p >
34
+ </ div >
35
+ </ div >
36
+ {{ end }}
37
+ </ div >
38
+ {{ end }}
39
+ </ div >
40
+ </ div >
41
+ </ article >
42
+ {{ end }}
You can’t perform that action at this time.
0 commit comments