videos.html

---
layout: page
title: Videos
permalink: /videos
description: "Explore our video library, featuring expert insights and practical tips on digital rights and privacy."
---
{% include variables.html %}
{% include c_sub-hero.html title=page.title perex=page.description %}

<section>
	<div class="container">
		{%- include c_box-header.html title=t.videos.titleNewest links=site.techloreVideos.links -%}
		<div class="box has-footer">
			<ul class="video-list video-list--3-videos marginless listless columns is-multiline is-gap-2">
				{% for video in site.data._en.forum.latest-techlore-videos limit: 3 %}
					{% assign forumLink = video.id | prepend: "https://discuss.techlore.tech/t/" %}

					{%- include c_video.html
						title=video.fancy_title
						desc=video.excerpt
						link=forumLink
						thumbnail=video.image_url
						date=video.created_at
					-%}

				{% endfor %}
			</ul>
		</div>
		{% include c_box-footer.html
			link="/videos#older-videos"
			title=t.global.other.viewMore
		%}
	</div>
</section>

<section>
	<div class="container">
		{%- include c_box-header.html title=t.videos.titleFeatured -%}
		<div class="box has-footer">
			<ul class="video-list marginless listless columns is-multiline is-gap-2">
				{% assign sortedVideos = site.guides | sort: "datePublished" | reverse %}
					{% for video in sortedVideos limit: 4 %}
						{% assign filename = video.path | split: "/" | last %}
						{% assign videoThumbnail = "/guides/" | append: filename | replace: ".md", ".jpg" | relative_url %}

						{%- include c_video.html
								title=video.title
								desc=video.description
								link=video.linkForum
								linkYouTube=video.linkYouTube
								linkPeerTube=video.linkPeerTube
								thumbnail=videoThumbnail
								date=video.datePublished
						-%}

				{% endfor %}
			</ul>
		</div>
		{% include c_box-footer.html
			link=site.data._en.navigation.hiddenNav.allTechloreGuides.url
			title=t.global.other.viewMore
		%}
	</div>
</section>

<section>
	<div class="container is-max-tablet">
		{% if t.goincognito.engageUser.title %}
			<h2 class="has-text-centered">{{ t.goincognito.titleMore }}</h2>
		{% endif %}

		{% assign iconEngage = "iris-scan" %}
		{% assign buttonLink = site.data._en.navigation.mainNav.goincognito.url | relative_url %}
		{% include c_feature-box.html
			icon=iconEngage
			title=t.featureBox.tryIncognito.title
			desc=t.featureBox.tryIncognito.desc
			buttonText=t.featureBox.tryIncognito.buttonText
			buttonLink=buttonLink
			class="is-box-warning has-no-background has-border"
			buttonClass="is-warning"
		%}
	</div>
</section>


<section>
	<div class="container">
		<div class="columns">
			<div class="column is-full-mobile is-half" id="techlore-clips">
				{%- include c_box-header.html title=t.videos.techloreClips.title links=site.techloreClips.links -%}
				<div class="box has-footer">
					<ul class="video-list video-list--50 marginless listless columns is-multiline is-gap-2">
						{% for video in site.data._en.forum.latest-techlore-clips-videos limit: 2 %}
							{% assign forumLink = video.id | prepend: "https://discuss.techlore.tech/t/" %}

							{%- include c_video.html
								title=video.fancy_title
								desc=video.excerpt
								link=forumLink
								thumbnail=video.image_url
								date=video.created_at
							-%}

						{% endfor %}
					</ul>
				</div>
			</div>
			<div class="column is-full-mobile is-half" id="surveillance-report">
				{%- include c_box-header.html title=t.videos.surveillanceReport.title links=site.surveillanceReport.links -%}
				<div class="box has-footer">
					<ul class="video-list video-list--50 marginless listless columns is-multiline is-gap-2">
						{% for video in site.data._en.forum.latest-surveillance-report-videos limit: 2 %}
							{% assign forumLink = video.id | prepend: "https://discuss.techlore.tech/t/" %}

							{%- include c_video.html
								title=video.fancy_title
								desc=video.excerpt
								link=forumLink
								thumbnail=video.image_url
								date=video.created_at
								posts=video.posts_count
								likes=video.like_count
							-%}

						{% endfor %}
					</ul>
				</div>
			</div>
		</div>
	</div>
</section>

<section id="older-videos">
	<div class="container">
		<h2 class="has-text-centered">{{ t.videos.titleArchive }}</h2>
		<p class="has-text-centered mb-6">
			{% include e_render-svg-icon.html icon="arrow-down" dimension=200 inline=true %}
		</p>

		{% assign sortedVideos = site.data._en.forum.latest-techlore-videos %}
		{% assign groupedVideos = "" %}
		{% assign headerLinks = site.techloreVideos.links %}

		{%- for video in sortedVideos -%}
			{% assign videoDate = video.last_posted_at | date: "%B %Y" %}
			{% assign groupedVideos = groupedVideos | append: videoDate | append: "," %}
		{%- endfor -%}

		{% assign monthArray = groupedVideos | split: "," | uniq %}

		{%- for month in monthArray -%}
			<div class="is-flex is-flex-direction-column">

				{% comment %} Hide header by default; not to show an empty month {% endcomment %}
				{% assign showHeader = false %}
				<div class="box">
					<ul class="video-list marginless listless columns is-multiline is-gap-2 mb-6 pb-6">
						{%- for video in sortedVideos offset: 3 -%}
							{%- assign videoDate = video.last_posted_at | date: "%B %Y" -%}
							{%- assign forumLink = video.id | prepend: "https://discuss.techlore.tech/t/" -%}
							{%- if videoDate == month and video.size > 0 -%}
								{%- include c_video.html
									title=video.fancy_title
									desc=video.excerpt
									link=forumLink
									thumbnail=video.image_url
									date=video.created_at
								-%}
								{%- assign showHeader = true -%}
							{%- endif -%}
						{%- endfor -%}
					</ul>
				</div>
				{%- if showHeader -%}
					{% assign title = month | date: "%B, %Y" %}
					{%- include c_box-header.html title=title links=headerLinks class="has-order-1 mb-4" -%}

					{% comment %} Disable header links after the first loop {% endcomment %}
					{% assign headerLinks = "" %}
				{%- endif -%}
			</div>
		{%- endfor -%}
	</div>
</section>