123 lines
4.6 KiB
HTML
123 lines
4.6 KiB
HTML
{%- import "components/talent_card.html" as tc -%}
|
|
{%- import "components/social_card.html" as sc -%}
|
|
{% extends "base.html" %}
|
|
|
|
{% block title %}Introduction{% endblock %}
|
|
|
|
{% block content %}
|
|
<header class="index-header hidden">
|
|
<figure class="profile-pic">
|
|
<picture>
|
|
<img
|
|
alt="Portrait"
|
|
{# TODO generate `srcset` for optimal image #}
|
|
{# TODO Take a new photo #}
|
|
src="/images/profile-portugal-landscape.jpg"
|
|
/>
|
|
</picture>
|
|
</figure>
|
|
|
|
<p class="motto">
|
|
<cite>“Let your ambition carry you.”</cite>
|
|
<span class="cite-owner">- La Flame</span>
|
|
</p>
|
|
</header>
|
|
|
|
<h2 class="text-blue-950 font-semibold text-2xl m-5">About me</h2>
|
|
|
|
<p class="mx-5">
|
|
Welcome to my personal website. My name is
|
|
<strong>Michal Vanko</strong>
|
|
and I'm a
|
|
<em> <a href="https://en.wikipedia.org/wiki/Programmer">programmer</a> </em>
|
|
. I am developing software for more than half of my life and <strong>I love it!</strong> Sometimes I stream working on my side projects and building a <a href="https://discord.gg/2cGg7kwZEh">community of like minded people</a>. Here you can find blogs of my thoughts and journeys, as well as links to my socials where you can see other content.</p>
|
|
|
|
<section id="talent-cards">
|
|
{% call tc::talent_card("code", "Web development", "Extensive expertise in creating performant, live web applications and websites") %}
|
|
{% call tc::talent_card("gamepad", "Game development", "Extensive expertise in creating performant, live web applications and websites") %}
|
|
{% call tc::talent_card("person-chalkboard", "Mentoring & Consulting", "I offer consulting sessions to assist you in developing <strong>higher-quality software</strong> and share insights from crafting robust, professional web applications. <a href=\"TODO callendly\">Schedule a session with me</a> and elevate your projects together.") %}
|
|
</section
|
|
|
|
<section id="blog">
|
|
<h2 class="text-blue-950 font-semibold text-2xl m-5">Blog</h2>
|
|
<section id="blog-tags">
|
|
<ul class="mx-5">
|
|
{% for tag in blog_tags %}
|
|
<li class="inline-block mx-0.5 p-0.5">
|
|
<a href="/blog/tags/{{tag}}" class="text-pink-950">#{{tag|capitalize}}</a>
|
|
</li>
|
|
{% endfor %}
|
|
</ul>
|
|
</section>
|
|
<hr class="border-blue-950 m-5">
|
|
|
|
<ul class="mx-5">
|
|
{% for post in featured_posts %}
|
|
<li>
|
|
{% include "components/post_preview.html" %}
|
|
<hr class="border-blue-950 my-5">
|
|
</li>
|
|
{% endfor %}
|
|
</ul>
|
|
</section>
|
|
|
|
<section id="socials">
|
|
<h2 class="text-blue-950 font-semibold text-2xl m-5">Socials</h2>
|
|
{% call sc::social_card_start("twitch", "I stream (almost) regularly on <em>twitch.tv</em>") %}
|
|
<script src= "https://player.twitch.tv/js/embed/v1.js"></script>
|
|
<div id="twitch-player" class="h-64 rounded overflow-hidden"></div>
|
|
<script type="text/javascript">
|
|
var options = {
|
|
width: "100%",
|
|
height: "100%",
|
|
channel: "michalvankodev",
|
|
parent: ["localhost"]
|
|
};
|
|
var player = new Twitch.Player("twitch-player", options);
|
|
player.setVolume(0.5);
|
|
</script>
|
|
{% call sc::social_card_end() %}
|
|
|
|
{% call sc::social_card_start("tiktok", "Highlight can be found on <em>TikTok</em>") %}
|
|
<!-- STYLES needed to overwrite tiktok embed css -->
|
|
<blockquote
|
|
class="overflow-hidden p-0 m-0 tiktok-embed bg-pink-200"
|
|
cite="https://www.tiktok.com/@michalvankodev"
|
|
data-unique-id="michalvankodev"
|
|
data-embed-from="embed_page"
|
|
data-embed-type="creator"
|
|
style="max-width:780px; min-width:288px; margin: 0; padding: 0; border-radius: 8px"
|
|
>
|
|
<section>
|
|
<a target="_blank" href="https://www.tiktok.com/@michalvankodev?refer=creator_embed">@michalvankodev</a>
|
|
</section>
|
|
</blockquote>
|
|
<script async src="https://www.tiktok.com/embed.js"></script>
|
|
{% call sc::social_card_end() %}
|
|
</section>
|
|
|
|
<section class="twitch-stream-promo">
|
|
<h2>Follow my twitch stream</h2>
|
|
<div class="twitch-embed">
|
|
<div class="twitch-video">
|
|
<!-- <iframe -->
|
|
<!-- title="My twitch channel" -->
|
|
<!-- src="https://player.twitch.tv/?channel=michalvankodev&parent=michalvanko.dev&parent=localhost&autoplay=false" -->
|
|
<!-- loading="lazy" -->
|
|
<!-- frameborder="0" -->
|
|
<!-- scrolling="no" -->
|
|
<!-- allowfullscreen -->
|
|
<!-- height="100%" -->
|
|
<!-- width="100%" -->
|
|
<!-- class="embed" -->
|
|
<!-- /> -->
|
|
</div>
|
|
<aside>
|
|
Come hang out and chat with me <strong>every Tuesday and Thursday</strong>
|
|
afternoon central Europe time. I stream working on my side-projects and talking
|
|
anything about the developer lifestyle.
|
|
</aside>
|
|
</div>
|
|
</section>
|
|
{% endblock %}
|