Update blog-podcast-videos section

This commit is contained in:
Luke 2020-05-19 15:11:55 +02:00
parent a9f0510d71
commit 2ba501c5f2
7 changed files with 49 additions and 7 deletions

View file

@ -172,3 +172,14 @@ footer {
transition-duration: 150ms;
transition-timing-function: cubic-bezier(.4, 0, .2, 1);
}
.grayscale {
filter: url(filters.svg#grayscale); /* Firefox 3.5+ */
filter: gray; /* IE5+ */
-webkit-filter: grayscale(0); /* Webkit Nightlies & Chrome Canary */
}
.grayscale:hover {
filter: none;
-webkit-filter: grayscale(1);
}

BIN
assets/img/blog/4.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 99 KiB

BIN
assets/img/blog/pod-21.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 23 KiB

BIN
assets/img/blog/spn-tor.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 56 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 52 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 76 KiB

View file

@ -139,15 +139,24 @@ title: Safing
</div>
<div class="mt-32">
<ul class="md:grid md:grid-cols-2 lg:grid-cols-3 md:col-gap-8 md:row-gap-10">
<!-- podcast -->
<li class="mt-10 md:mt-0">
<div class="block transform hover:scale-95 duration-150 ease-in-out">
<a href="/podcast/2020/05/11/the-risks-of-paying-with-cash/">
<img src="/assets/img/shapes/podcast_blank.png" alt="">
<img class="grayscale" src="/assets/img/blog/pod-21.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>
<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-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> -->
<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">PODCAST - 11. May 2020</span>
@ -156,7 +165,8 @@ title: Safing
</a>
</div>
</li>
<li class="mt-10 md:mt-0">
<!-- video -->
<!-- <li class="mt-10 md:mt-0">
<div class="block transform hover:scale-95 duration-150 ease-in-out">
<video src="{{ site.assets_server_url }}video/progress_updates/4.mp4" controls></video>
<div class="pt-6">
@ -164,11 +174,32 @@ title: Safing
<p>The Account Server is up and running - #4</p>
</div>
</div>
</li> -->
<li class="mt-10 md:mt-0">
<div class="block transform hover:scale-95 duration-150 ease-in-out">
<a href="/podcast/2020/05/11/the-risks-of-paying-with-cash/">
<img class="grayscale rounded-sm" src="/assets/img/blog/4.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 - 8. May 2020</span>
<p>The Account Server is up and running - #4</p>
</div>
</a>
</div>
</li>
<!-- blog -->
<li>
<a href="/blog/2020/01/22/how-the-spn-compares-to-tor/">
<div class="block transform hover:scale-95 duration-150 ease-in-out">
<img src="/assets/img/shapes/podcast_blank.png" alt="">
<img class="grayscale" src="/assets/img/blog/spn-tor2.png" alt="">
<div class="pt-6">
<span class="opacity-25">BLOG - 22. Jan 2020</span>
<p>How the SPN compares to Tor</p>