vikarti.anatra/safing-web
1
0
Fork 0
mirror of https://github.com/safing/web synced 2025-09-01 18:49:06 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Merge pull request #81 from safing/feature/blog-images

Browse source 
Add blog images
This commit is contained in:
Dave Gson 2020-07-03 10:38:09 +02:00 • committed by GitHub
commit 88292853d6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
22 changed files with 120 additions and 122 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
_includes/thumbnail_blog.html Normal file
View file

@ -0,0 +1,30 @@
<li class="mt-10 md:mt-0">
<div class="block transform hover:scale-95 duration-150 ease-in-out">
<a href="{{ post.url }}">
<div class="relative" style="max-width: 365px;">
{% if post.custom_thumbnail_name == null %}
<img src="{{ site.img_url }}thumbnails/blog/placeholder.png">
{% else %}
<img src="{{ site.img_url }}thumbnails/blog/{{ post.custom_thumbnail_name }}.png">
{% endif %}
{% if post.progress_update == true %}
<span class="absolute text-white right-0 bottom-0 pr-3 pb-3" style="font-size: 3.1rem; font-weight: 800;" >#{{ post.title | slice: 2, 2 }}</span>
{% endif %}
</div>
<div class="pt-6">
<span class="opacity-25">
{% if include.pre_header %}
{{ include.pre_header }} -
{% endif %}
{{ post.date | date: "%-d. %b %Y" }}
</span>
{% if post.progress_update == true %}
{% assign title_length = post.title | size %}
<p>{{ post.title | slice: 7, title_length }} - #{{ post.title | slice: 2, 2 }}</p>
{% else %}
<p>{{ post.title }}</p>
{% endif %}
</div>
</a>
</div>
</li>

35
_includes/thumbnail_podcast.html Normal file
View file

@ -0,0 +1,35 @@
<li class="mt-10 md:mt-0">
<div class="block transform hover:scale-95 duration-150 ease-in-out">
<a href="{{ episode.url }}">
<div class="relative" style="max-width: 365px;">
{% if episode.custom_thumbnail_name == null %}
<img src="{{ site.img_url }}thumbnails/podcast/placeholder.png">
{% else %}
<img src="{{ site.img_url }}thumbnails/podcast/{{ episode.custom_thumbnail_name }}.png">
{% endif %}
<span class="absolute text-white right-0 bottom-0 pr-3 pb-3" style="font-size: 3.1rem; font-weight: 800;" >#{{ episode.title | slice: 2, 2 }}</span>
</div>
<span style="font-size: 12rem; font-weight: 800; margin-top: -13.8rem; margin-left: -0.8rem;" class=" z-0 absolute bg-top">
<button type="button" style="background-color: #6188ff;" class="inline-flex items-center px-3 py-3 rounded-md border border-transparent text-xs leading-5 font-extrabold text-white">
<svg class="h-8 w-auto lg:h-7" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<g fill="none">
<path d="M0 0h24v24H0z"/>
<path stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.8" d="M12 15v0c-1.657 0-3-1.343-3-3V6c0-1.657 1.343-3 3-3v0c1.657 0 3 1.343 3 3v6c0 1.657-1.343 3-3 3z"/>
<path stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.8" d="M18 10v2c0 3.314-2.686 6-6 6v0c-3.314 0-6-2.686-6-6v-2M12 18v3M7.82 21h8.36"/>
</g>
</svg>
</button>
</span>
<div class="pt-6">
<span class="opacity-25">
{% if include.pre_header %}
{{ include.pre_header }} -
{% endif %}
{{ episode.date | date: "%-d. %b %Y" }}
</span>
{% assign title_length = episode.title | size %}
<p>{{ episode.title | slice: 7, title_length }} - #{{ episode.title | slice: 2, 2 }}</p>
</div>
</a>
</div>
</li>

27
_includes/thumbnail_video.html Normal file
View file

@ -0,0 +1,27 @@
<li class="mt-10 md:mt-0">
<div class="block transform hover:scale-95 duration-150 ease-in-out">
<a href="{{ video.url }}">
{% if video.custom_thumbnail_name == null %}.
<img src="{{ site.img_url }}thumbnails/video/placeholder.png" alt="">
{% else %}
<img src="{{ site.img_url }}thumbnails/video/{{ video.custom_thumbnail_name }}.png" alt="">
{% endif %}
<span style="font-size: 12rem; font-weight: 800; margin-top: -13.8rem; margin-left: -0.8rem;" class=" z-0 absolute bg-top">
<button type="button" style="background-color: #6188ff;" class="inline-flex items-center px-4 py-4 rounded-md border border-transparent text-xs leading-5 font-extrabold text-white">
<svg class="h-8 w-auto lg:h-5 fill-current text-white" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 9.41 11">
<path d="M8.43 4.62l-6.34-4A1 1 0 00.5 1.5v8a1 1 0 001.59.88l6.34-4a1 1 0 000-1.76z" stroke-miterlimit="10" /></svg>
</button>
</span>
<div class="pt-6">
<span class="opacity-25">
{% if include.pre_header %}
{{ include.pre_header }} -
{% endif %}
{{ video.date | date: "%-d. %b %Y" }}
</span>
{% assign title_length = video.title | size %}
<p>{{ video.title | slice: 7, title_length }} - #{{ video.title | slice: 2, 2 }}</p>
</div>
</a>
</div>
</li>

2
_posts/2019-11-29-hiring-a-designer-from-the-privacy-community.md
View file

@ -2,6 +2,8 @@
title: Hiring a Designer from the Privacy Community
date: 2019-11-29
author: davegson
custom_thumbnail_name: hiring-a-designer-from-the-privacy-community
cover_image_source: https://unsplash.com/photos/66O6CE7QvwI
---
_Sidenote: shoutout to [The Hated One](https://www.youtube.com/channel/UCjr2bPAyPV7t35MvcgT3W8Q/), this would not have happened without him!_

2
_posts/2019-12-06-the-next-5-steps-for-safing.md
View file

@ -2,6 +2,8 @@
title: The next 5 steps for Safing
date: 2019-12-06
author: davegson
custom_thumbnail_name: the-next-5-steps-for-safing
cover_image_source: https://pixabay.com/photos/architecture-stone-blocks-block-3481302/
---
## Intro

1
_posts/2019-12-20-announcing-the-privacytools-sponsorship.md
View file

@ -2,6 +2,7 @@
title: Announcing the PrivacyTools Sponsorship
date: 2019-12-20
author: davegson
custom_thumbnail_name: announcing-the-privacytools-sponsorship
---
**We are very pleased to announce that we have become a sponsor of [PrivacyTools.io](https://opencollective.com/privacytoolsio)**

2
_posts/2020-01-22-how-the-spn-compares-to-vpns.md
View file

@ -2,6 +2,8 @@
title: How the SPN compares to VPNs
date: 2020-01-22
author: davegson
custom_thumbnail_name: how-the-spn-compares-to-vpns
cover_image_source: https://pixabay.com/vectors/the-globe-globe-the-internet-free-4790044/
---
## Introduction into VPN Technology

2
_posts/2020-02-04-the-two-steps-it-takes.md
View file

@ -2,6 +2,8 @@
title: The Two Steps it Takes
date: 2020-02-04
author: davegson
custom_thumbnail_name: the-two-steps-t-takes
cover_image_source: https://unsplash.com/photos/7_kRuX1hSXM
---
There's no such thing as an overnight success. Successful companies do not suddenly appear, we [just notice them suddenly](https://seths.blog/2014/01/gradually-and-then-suddenly/).

6
_posts/2020-06-26-progress-update.md
View file

@ -1,7 +1,11 @@
---
title: "Progress Update - #01"
# ⚠️ ALWAYS follow this format: "#001 - Some sweet title"
# this has to be consistent for displaying only the episode number or only the title
title: "#001 - Progress Update June"
date: 2020-06-26
author: davegson
custom_thumbnail_name: progress-update
progress_update: true
---
*Note: not every update needs to be [a podcast]({{ site.podcast_url }}) or [a video]({{ site.video_url }}), thought I'd mix things up with a written update - [let me know]({{ site.reddit_url }}) if you like this.*

BIN
assets/img/thumbnails/blog/announcing-the-privacytools-sponsorship.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 38 KiB

BIN
assets/img/thumbnails/blog/hiring-a-designer-from-the-privacy-community.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 67 KiB

BIN
assets/img/thumbnails/blog/how-portmaster-handles-dns.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 63 KiB

BIN
assets/img/thumbnails/blog/how-the-spn-compares-to-vpns.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 82 KiB

BIN
assets/img/thumbnails/blog/progress-update.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 66 KiB

BIN
assets/img/thumbnails/blog/spn-tor-blue.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 52 KiB

BIN
assets/img/thumbnails/blog/spn-tor-purple.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 56 KiB

BIN
assets/img/thumbnails/blog/the-next-5-steps-for-safing.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 105 KiB

BIN
assets/img/thumbnails/blog/the-two-steps-t-takes.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 68 KiB

16
blog/index.html
View file

@ -17,21 +17,7 @@ layout: page
<div class="mt-8 md:mt-32">
<ul class="md:grid md:grid-cols-2 lg:grid-cols-3 md:col-gap-8 md:row-gap-10">
{% for post in site.posts %}
<li class="mt-10 md:mt-0">
<div class="block transform hover:scale-95 duration-150 ease-in-out">
<a href="{{ post.url }}">
{% if post.custom_thumbnail_name == null %}
<img src="{{ site.img_url }}thumbnails/blog/placeholder.png">
{% else %}
<img src="{{ site.img_url }}thumbnails/blog/{{ post.custom_thumbnail_name }}.png">
{% endif %}
<div class="pt-6">
<span class="opacity-25">{{ post.date | date: "%-d. %b %Y" }}</span>
<p>{{ post.title }}</p>
</div>
</a>
</div>
</li>
{% include thumbnail_blog.html %}
{% endfor %}
</ul>
<br class="mb-12">

65
index.html
View file

@ -138,64 +138,21 @@ title: Safing - Love Freedom
<div class="mt-8 lg:mt-32">
<ul class="md:grid md:grid-cols-2 lg:grid-cols-3 md:col-gap-8 md:row-gap-10 max-w-sm mx-auto md:max-w-full">
<!-- podcast -->
<li class="mt-12 md:mt-0 ">
<div class="block transform hover:scale-95 duration-150 ease-in-out">
<a href="/podcast/2020/06/29/deadlines-tailwind-designing-safing/">
<div class="relative" style="max-width: 365px;">
<img src="/assets/img/thumbnails/podcast/placeholder.png">
<span class="absolute text-white right-0 bottom-0 pr-3 pb-3" style="font-size: 3.1rem; font-weight: 800;">#22</span>
</div>
<span style="font-size: 12rem; font-weight: 800; margin-top: -13.8rem; margin-left: -0.8rem;" class=" z-0 absolute bg-top">
<button type="button" style="background-color: #6188ff;" class="inline-flex items-center px-3 py-3 rounded-md border border-transparent text-xs leading-5 font-extrabold text-white">
<svg class="h-8 w-auto lg:h-7" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<g fill="none">
<path d="M0 0h24v24H0z"></path>
<path stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.8" d="M12 15v0c-1.657 0-3-1.343-3-3V6c0-1.657 1.343-3 3-3v0c1.657 0 3 1.343 3 3v6c0 1.657-1.343 3-3 3z"></path>
<path stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.8" d="M18 10v2c0 3.314-2.686 6-6 6v0c-3.314 0-6-2.686-6-6v-2M12 18v3M7.82 21h8.36"></path>
</g>
</svg>
</button>
</span>
<div class="pt-6">
<span class="opacity-25">PODCAST - 29. Jun 2020</span>
<p>Deadlines, Tailwind &amp; Designing Safing - #22</p>
</div>
</a>
</div>
</li>
{% assign sorted_podcasts = site.podcasts | reverse %}
{% for episode in sorted_podcasts limit: 1 %}
{% include thumbnail_podcast.html pre_header="PODCAST" %}
{% endfor %}
<!-- video -->
<li class="mt-12 md:mt-0">
<div class="block transform hover:scale-95 duration-150 ease-in-out">
<a href="/video/2020/05/22/a-fresh-new-look/">
<img src="/assets/img/thumbnails/video/005-website-redesign.png" alt="">
<span style="font-size: 12rem; font-weight: 800; margin-top: -13.8rem; margin-left: -0.8rem;" class=" z-0 absolute bg-top">
<button type="button" style="background-color: #6188ff;" class="inline-flex items-center px-4 py-4 rounded-md border border-transparent text-xs leading-5 font-extrabold text-white">
<svg class="h-8 w-auto lg:h-5 fill-current text-white" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 9.41 11">
<path d="M8.43 4.62l-6.34-4A1 1 0 00.5 1.5v8a1 1 0 001.59.88l6.34-4a1 1 0 000-1.76z" stroke-miterlimit="10"></path></svg>
</button>
</span>
<div class="pt-6">
<span class="opacity-25">VIDEO - 22. May 2020</span>
<p>A Fresh New Look - #05</p>
</div>
</a>
</div>
</li>
{% assign sorted_videos = site.videos | reverse %}
{% for video in sorted_videos limit: 1 %}
{% include thumbnail_video.html pre_header="VIDEO" %}
{% endfor %}
<!-- blog -->
<li class="mt-12 md:mt-0">
<div class="block transform hover:scale-95 duration-150 ease-in-out">
<a href="/blog/2020/06/26/progress-update/">
<img src="/assets/img/thumbnails/blog/placeholder.png">
<div class="pt-6">
<span class="opacity-25">BLOG - 26. Jun 2020</span>
<p>Progress Update - #01</p>
</div>
</a>
</div>
</li>
{% for post in site.posts limit: 1 %}
{% include thumbnail_blog.html pre_header="BLOG" %}
{% endfor %}
</ul>
<div class="pt-20 flex w-full">
<div class="mx-auto grid md:block">

31
podcast/index.html
View file

@ -26,36 +26,7 @@ layout: page
<ul class="md:grid md:grid-cols-2 lg:grid-cols-3 md:col-gap-8 md:row-gap-10">
{% assign sorted_podcasts = site.podcasts | reverse %}
{% for episode in sorted_podcasts %}
<li class="mt-10 md:mt-0">
<div class="block transform hover:scale-95 duration-150 ease-in-out">
<a href="{{ episode.url }}">
<div class="relative" style="max-width: 365px;">
{% if episode.custom_thumbnail_name == null %}
<img src="{{ site.img_url }}thumbnails/podcast/placeholder.png">
{% else %}
<img src="{{ site.img_url }}thumbnails/podcast/{{ episode.custom_thumbnail_name }}.png">
{% endif %}
<span class="absolute text-white right-0 bottom-0 pr-3 pb-3" style="font-size: 3.1rem; font-weight: 800;" >#{{ episode.title | slice: 2, 2 }}</span>
</div>
<span style="font-size: 12rem; font-weight: 800; margin-top: -13.8rem; margin-left: -0.8rem;" class=" z-0 absolute bg-top">
<button type="button" style="background-color: #6188ff;" class="inline-flex items-center px-3 py-3 rounded-md border border-transparent text-xs leading-5 font-extrabold text-white">
<svg class="h-8 w-auto lg:h-7" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<g fill="none">
<path d="M0 0h24v24H0z"/>
<path stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.8" d="M12 15v0c-1.657 0-3-1.343-3-3V6c0-1.657 1.343-3 3-3v0c1.657 0 3 1.343 3 3v6c0 1.657-1.343 3-3 3z"/>
<path stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.8" d="M18 10v2c0 3.314-2.686 6-6 6v0c-3.314 0-6-2.686-6-6v-2M12 18v3M7.82 21h8.36"/>
</g>
</svg>
</button>
</span>
<div class="pt-6">
<span class="opacity-25">{{ episode.date | date: "%-d. %b %Y" }}</span>
{% assign title_length = episode.title | size %}
<p>{{ episode.title | slice: 7, title_length }} - #{{ episode.title | slice: 2, 2 }}</p>
</div>
</a>
</div>
</li>
{% include thumbnail_podcast.html %}
{% endfor %}
</ul>
<br class="mb-12">

23
video/index.html
View file

@ -26,28 +26,7 @@ layout: page
<ul class="md:grid md:grid-cols-2 lg:grid-cols-3 md:col-gap-8 md:row-gap-10">
{% assign sorted_videos = site.videos | reverse %}
{% for video in sorted_videos %}
<li class="mt-10 md:mt-0">
<div class="block transform hover:scale-95 duration-150 ease-in-out">
<a href="{{ video.url }}">
{% if video.custom_thumbnail_name == null %}.
<img src="{{ site.img_url }}thumbnails/video/placeholder.png" alt="">
{% else %}
<img src="{{ site.img_url }}thumbnails/video/{{ video.custom_thumbnail_name }}.png" alt="">
{% endif %}
<span style="font-size: 12rem; font-weight: 800; margin-top: -13.8rem; margin-left: -0.8rem;" class=" z-0 absolute bg-top">
<button type="button" style="background-color: #6188ff;" class="inline-flex items-center px-4 py-4 rounded-md border border-transparent text-xs leading-5 font-extrabold text-white">
<svg class="h-8 w-auto lg:h-5 fill-current text-white" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 9.41 11">
<path d="M8.43 4.62l-6.34-4A1 1 0 00.5 1.5v8a1 1 0 001.59.88l6.34-4a1 1 0 000-1.76z" stroke-miterlimit="10" /></svg>
</button>
</span>
<div class="pt-6">
<span class="opacity-25">{{ video.date | date: "%-d. %b %Y" }}</span>
{% assign title_length = video.title | size %}
<p>{{ video.title | slice: 7, title_length }} - #{{ video.title | slice: 2, 2 }}</p>
</div>
</a>
</div>
</li>
{% include thumbnail_video.html %}
{% endfor %}
</ul>
<br class="mb-12">