ovlach_pdf/templates/two_column.html.tera

161 lines
12 KiB
Plaintext

{% import "two_column.macros.tera" as macros %}
{% import "two_column.css" as css %}
<html>
<head>
<meta charset="UTF-8">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans:wght@400;800&family=Roboto&display=swap" rel="stylesheet">
<style>
{{css::css()}}
</style>
</head>
<body>
<div class="flex-container">
<div class="flex-items">
<div class="header">
<h1>Ondřej Vlach</h1>
<div class="about-me-small">{{ cv.person.job_title | lang_entity(lang=lang) }}</div>
</div>
<div class="part">
<div class="section-header">
<div class="flex-container-skills">
<div class="flex-items-skills">
<h2>{{ "skills-languages" | translate(lang=lang) }}</h2>
</div>
<div class="flex-items-skills">
<h2>{{ "skills-technology" | translate(lang=lang) }}</h2>
</div>
</div>
</div>
<div class="flex-container-skills">
<div class="flex-items-skills">
{% for skill in cv.skills | filter(attribute="techtype",value="Language") %}
<div>
<span class="tech-name">{{ skill.name }}</span>{%if skill.skill %}<span class="tech-level"> ({{ skill.skill | translate(lang=lang)}}){%endif %}</span>
</div>
{% endfor %}
</div>
<div class="flex-items-skills">
{% for skill in cv.skills | filter(attribute="techtype", value="Technology")%}
<div>
<span class="tech-name">{{ skill.name }}</span>{%if skill.skill %}<span class="tech-level"> ({{ skill.skill | translate(lang=lang)}}){%endif %}</span>
</div>
{% endfor %}
</div>
</div>
</div>
<div class="part">
<div class="section-header">
<div class="flex-container-skills">
<div class="flex-items-skills">
<h2>{{ "skills-frameworks" | translate(lang=lang) }}</h2>
</div>
<div class="flex-items-skills">
<h2>{{ "skills-databases" | translate(lang=lang) }}</h2>
</div>
</div>
</div>
<div class="flex-container-skills">
<div class="flex-items-skills">
{% for skill in cv.skills | filter(attribute="techtype",value="Framework") %}
<div>
<span class="tech-name">{{ skill.name }}</span>{%if skill.skill %}<span class="tech-level"> ({{ skill.skill | translate(lang=lang)}}){%endif %}</span>
</div>
{% endfor %}
</div>
<div class="flex-items-skills">
{% for skill in cv.skills | filter(attribute="techtype", value="Database")%}
<div>
<span class="tech-name">{{ skill.name }}</span>{%if skill.skill %}<span class="tech-level"> ({{ skill.skill | translate(lang=lang)}}){%endif %}</span>
</div>
{% endfor %}
</div>
</div>
</div>
<div class="part">
<span class="bolder">{{"tools" | translate(lang=lang)}}:</span>
{% for skill in cv.skills | filter(attribute="techtype",value="Tool") | advanced_filter(attribute="skill", include_null="all") %}
{{ skill.name }}{% if skill.skill %} - {{skill.skill | ranslate(lang=lang)}}{% endif %},<!-- TODO: fix-me (empty "," if operating system empty) %-->
{% endfor %}
<span class="bolder">{{"operating-systems" | translate(lang=lang)}}:</span>
{% for skill in cv.skills | filter(attribute="techtype",value="OperatingSystem") | advanced_filter(attribute="skill", include_null="all") %}
{{ skill.name }}</span>{% if skill.skill %} - {{skill.skill | translate(lang=lang)}}{% endif %}{% if not loop.last %},{% endif %}
{% endfor %}
</div>
<div class="part">
<div class="section-header">
<h2>{{ "work-experience" | translate(lang=lang) }}</h2>
</div>
{% for job in cv.jobs | filter(attribute="jobtype", value="Contract") | slice(end=2) %}
{{macros::job_row(job_entity=job)}}
{% endfor %}
</div>
<div style="page-break-after: always;">&nbsp;</div>
<div class="part">
<div class="section-header">
<h2>{{ "work-experience" | translate(lang=lang) }}</h2>
</div>
{% for job in cv.jobs | filter(attribute="jobtype", value="Contract") | slice(start=2) %}
{{macros::job_row(job_entity=job)}}
{% endfor %}
</div>
<div class="part">
<div class="section-header">
<h2>{{ "work-freelance" | translate(lang=lang) }}</h2>
</div>
{% for job in cv.jobs | filter(attribute="jobtype", value="Freelance") %}
{{macros::job_row(job_entity=job)}}
{% endfor %}
</div>
</div>
<div class="flex-items">
<div class="contact-bar">
{% if cv.person.social.facebook %}
<a href="{{ cv.person.social.facebook }}"><i class="fa-facebook"> {{ cv.person.social.facebook | strip_proto }}</i></a>
{% endif %}
{% if cv.person.social.github %}
<i class="fa-github">
<img src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTIgMGMtNi42MjYgMC0xMiA1LjM3My0xMiAxMiAwIDUuMzAyIDMuNDM4IDkuOCA4LjIwNyAxMS4zODcuNTk5LjExMS43OTMtLjI2MS43OTMtLjU3N3YtMi4yMzRjLTMuMzM4LjcyNi00LjAzMy0xLjQxNi00LjAzMy0xLjQxNi0uNTQ2LTEuMzg3LTEuMzMzLTEuNzU2LTEuMzMzLTEuNzU2LTEuMDg5LS43NDUuMDgzLS43MjkuMDgzLS43MjkgMS4yMDUuMDg0IDEuODM5IDEuMjM3IDEuODM5IDEuMjM3IDEuMDcgMS44MzQgMi44MDcgMS4zMDQgMy40OTIuOTk3LjEwNy0uNzc1LjQxOC0xLjMwNS43NjItMS42MDQtMi42NjUtLjMwNS01LjQ2Ny0xLjMzNC01LjQ2Ny01LjkzMSAwLTEuMzExLjQ2OS0yLjM4MSAxLjIzNi0zLjIyMS0uMTI0LS4zMDMtLjUzNS0xLjUyNC4xMTctMy4xNzYgMCAwIDEuMDA4LS4zMjIgMy4zMDEgMS4yMy45NTctLjI2NiAxLjk4My0uMzk5IDMuMDAzLS40MDQgMS4wMi4wMDUgMi4wNDcuMTM4IDMuMDA2LjQwNCAyLjI5MS0xLjU1MiAzLjI5Ny0xLjIzIDMuMjk3LTEuMjMuNjUzIDEuNjUzLjI0MiAyLjg3NC4xMTggMy4xNzYuNzcuODQgMS4yMzUgMS45MTEgMS4yMzUgMy4yMjEgMCA0LjYwOS0yLjgwNyA1LjYyNC01LjQ3OSA1LjkyMS40My4zNzIuODIzIDEuMTAyLjgyMyAyLjIyMnYzLjI5M2MwIC4zMTkuMTkyLjY5NC44MDEuNTc2IDQuNzY1LTEuNTg5IDguMTk5LTYuMDg2IDguMTk5LTExLjM4NiAwLTYuNjI3LTUuMzczLTEyLTEyLTEyeiIvPjwvc3ZnPg==" class="icon">
<a href="{{ cv.person.social.github }}">{{ cv.person.social.github | strip_proto }}</a>
</i>
{% endif %}
{% if cv.person.social.linkedin %}
<i class="fa-linkedin"> <a href="{{ cv.person.social.linikedin }}">{{ cv.person.social.linikedin | strip_proto }}</a></i>
{% endif %}
{% if cv.person.social.instagram %}
<i class="fa-instagram"> <a href="{{ cv.person.social.instagram }}">{{ cv.person.social.instagram | strip_proto }}</a></i>
{% endif %}
{% if cv.person.social.mastodon %}
<i class="fa-mastodon">
<img alt="Mastodon" src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IS0tIFVwbG9hZGVkIHRvOiBTVkcgUmVwbywgd3d3LnN2Z3JlcG8uY29tLCBHZW5lcmF0b3I6IFNWRyBSZXBvIE1peGVyIFRvb2xzIC0tPgo8c3ZnIGZpbGw9IiMwMDAwMDAiIHdpZHRoPSI4MDBweCIgaGVpZ2h0PSI4MDBweCIgdmlld0JveD0iMCAwIDI0IDI0IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbDpzcGFjZT0icHJlc2VydmUiPjxwYXRoIGQ9Ik0yMS4zMjcgOC41NjZjMC00LjMzOS0yLjg0My01LjYxLTIuODQzLTUuNjEtMS40MzMtLjY1OC0zLjg5NC0uOTM1LTYuNDUxLS45NTZoLS4wNjNjLTIuNTU3LjAyMS01LjAxNi4yOTgtNi40NS45NTYgMCAwLTIuODQzIDEuMjcyLTIuODQzIDUuNjEgMCAuOTkzLS4wMTkgMi4xODEuMDEyIDMuNDQxLjEwMyA0LjI0My43NzggOC40MjUgNC43MDEgOS40NjMgMS44MDkuNDc5IDMuMzYyLjU3OSA0LjYxMi41MSAyLjI2OC0uMTI2IDMuNTQxLS44MDkgMy41NDEtLjgwOWwtLjA3NS0xLjY0NnMtMS42MjEuNTExLTMuNDQxLjQ0OWMtMS44MDQtLjA2Mi0zLjcwNy0uMTk0LTMuOTk5LTIuNDA5YTQuNTIzIDQuNTIzIDAgMCAxLS4wNC0uNjIxczEuNzcuNDMzIDQuMDE0LjUzNmMxLjM3Mi4wNjMgMi42NTgtLjA4IDMuOTY1LS4yMzYgMi41MDYtLjI5OSA0LjY4OC0xLjg0MyA0Ljk2Mi0zLjI1NC40MzQtMi4yMjMuMzk4LTUuNDI0LjM5OC01LjQyNHptLTMuMzUzIDUuNTloLTIuMDgxVjkuMDU3YzAtMS4wNzUtLjQ1Mi0xLjYyLTEuMzU3LTEuNjItMSAwLTEuNTAxLjY0Ny0xLjUwMSAxLjkyN3YyLjc5MWgtMi4wNjlWOS4zNjRjMC0xLjI4LS41MDEtMS45MjctMS41MDItMS45MjctLjkwNSAwLTEuMzU3LjU0Ni0xLjM1NyAxLjYydjUuMDk5SDYuMDI2VjguOTAzYzAtMS4wNzQuMjczLTEuOTI3LjgyMy0yLjU1OC41NjYtLjYzMSAxLjMwNy0uOTU1IDIuMjI4LS45NTUgMS4wNjUgMCAxLjg3Mi40MDkgMi40MDUgMS4yMjhsLjUxOC44NjkuNTE5LS44NjljLjUzMy0uODE5IDEuMzQtMS4yMjggMi40MDUtMS4yMjguOTIgMCAxLjY2Mi4zMjQgMi4yMjguOTU1LjU0OS42MzEuODIyIDEuNDg0LjgyMiAyLjU1OHY1LjI1M3oiLz48L3N2Zz4=" class="icon" />
<a href="{{ cv.person.social.mastodon }}">{{ cv.person.social.mastodon | strip_proto }}</a></i>
{% endif %}
<i class="email fa-envelope">
<img alt="E-mail" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMCAzdjE4aDI0di0xOGgtMjR6bTYuNjIzIDcuOTI5bC00LjYyMyA1LjcxMnYtOS40NThsNC42MjMgMy43NDZ6bS00LjE0MS01LjkyOWgxOS4wMzVsLTkuNTE3IDcuNzEzLTkuNTE4LTcuNzEzem01LjY5NCA3LjE4OGwzLjgyNCAzLjA5OSAzLjgzLTMuMTA0IDUuNjEyIDYuODE3aC0xOC43NzlsNS41MTMtNi44MTJ6bTkuMjA4LTEuMjY0bDQuNjE2LTMuNzQxdjkuMzQ4bC00LjYxNi01LjYwN3oiLz48L3N2Zz4=" class="icon">
<a href="mailto:{{cv.person.email}}">{{cv.person.email}}</a>
</i>
<i class="phone fa-phone">
<img alt="Phone" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNNi4xNzYgMS4zMjJsMi44NDQtMS4zMjIgNC4wNDEgNy44OS0yLjcyNCAxLjM0MWMtLjUzOCAxLjI1OSAyLjE1OSA2LjI4OSAzLjI5NyA2LjM3Mi4wOS0uMDU4IDIuNjcxLTEuMzI4IDIuNjcxLTEuMzI4bDQuMTEgNy45MzJzLTIuNzY0IDEuMzU0LTIuODU0IDEuMzk2Yy03Ljg2MiAzLjU5MS0xOS4xMDMtMTguMjU4LTExLjM4NS0yMi4yODF6bTEuOTI5IDEuMjc0bC0xLjAyMy41MDRjLTUuMjk0IDIuNzYyIDQuMTc3IDIxLjE4NSA5LjY0OCAxOC42ODZsLjk3MS0uNDc0LTIuMjcxLTQuMzgzLTEuMDI2LjVjLTMuMTYzIDEuNTQ3LTguMjYyLTguMjE5LTUuMDU1LTkuOTM4bDEuMDA3LS40OTctMi4yNTEtNC4zOTh6Ii8+PC9zdmc+" class="icon">
<a href="tel:+{{cv.person.phone}}">+{{cv.person.phone | insert_space_every(times=3)}}</a>
</i>
{% if cv.person.web %}
<i class="fa-light fa-globe">
<img alt="Web" class="icon" src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0MjAiIGhlaWdodD0iNDIwIiBzdHJva2U9IiMwMDAiIGZpbGw9Im5vbmUiPgo8cGF0aCBzdHJva2Utd2lkdGg9IjI2IiBkPSJNMjA5LDE1YTE5NSwxOTUgMCAxLDAgMiwweiIvPgo8cGF0aCBzdHJva2Utd2lkdGg9IjE4IiBkPSJtMjEwLDE1djM5MG0xOTUtMTk1SDE1TTU5LDkwYTI2MCwyNjAgMCAwLDAgMzAyLDAgbTAsMjQwIGEyNjAsMjYwIDAgMCwwLTMwMiwwTTE5NSwyMGEyNTAsMjUwIDAgMCwwIDAsMzgyIG0zMCwwIGEyNTAsMjUwIDAgMCwwIDAtMzgyIi8+Cjwvc3ZnPg==" />
<a href="{{cv.person.web }}">{{cv.person.web | strip_proto }}</a>
</i>
{% endif %}
</i>
<div class="about-me-title">{{ "about-me" | translate(lang=lang) }}</div>
<div class="about-me">{{ cv.person.about | lang_entity(lang=lang) }}</div>
</div>
</div>
</div>
</body>
</html>