alterNERDtive.github.io/_includes/masthead.html

54 lines
2.4 KiB
HTML

{% if site.layout == 'stacked' %}
{% assign metadata_styles = 'd-md-inline-block mr-3' %}
{% else %}
{% assign metadata_styles = 'd-flex flex-items-center mb-3' %}
{% endif %}
<img src="{{ user.avatar_url }}" class="circle mb-3" style="max-width: 150px;">
<h1 class="{% if site.style == 'dark' %}text-white{% endif %} mb-2 lh-condensed">{% if user.name %}{{ user.name }}{% else %}{{ user.login }}{% endif %}</h1>
<p class="mb-3 f4 {% if site.style == 'dark' %}text-white{% else %}text-gray{% endif %}">
{{ user.bio }}
</p>
{% if include.metadata %}
<div class="f4 mb-6">
{% if user.name %}
<div class="{{ metadata_styles }}">
{% octicon mark-github height:20 class:"mr-2 v-align-middle" fill:{{ icon_color }} aria-label:GitHub %}
<a href="https://github.com/{{ user.login }}" {% if site.style == 'dark' %}class="text-white"{% endif %}>
@{{ user.login }}
</a>
</div>
{% endif %}
{% if user.email %}
<div class="{{ metadata_styles }}">
{% octicon mail height:20 class:"mr-2 v-align-middle" fill:{{ icon_color }} aria-label:email %}
<a href="mailto:{{ user.email }}" {% if site.style == 'dark' %}class="text-white"{% endif %}>
{{ user.email }}
</a>
</div>
{% endif %}
{% if user.location %}
<div class="{{ metadata_styles }} {% if site.style == 'dark' %}text-white{% endif %}">
{% octicon location height:20 class:"mr-2 v-align-middle" fill:{{ icon_color }} aria-label:Location %}
{{ user.location }}
</div>
{% endif %}
{% if site.social_media %}
<div class="d-flex flex-wrap flex-items-start {% if site.layout == 'stacked' %}flex-justify-center mt-1 mt-md-3{% endif %}">
{% for account in site.social_media %}
<div class="mr-3 mb-3">
{% assign service_shortname = account[0] %}
{% assign service = site.data.social_media[service_shortname] %}
<a href="{{ service.profile_url_prefix }}{{ account[1] }}" title="{{ service.name }}: {{ account[1] }}" class="tooltipped tooltipped-s" aria-label="{{ service.name }}: {{ account[1] }}">
{{ service.icon_svg }}<span class="d-none">{{ service.name }}</span>
</a>
</div>
{% endfor %}
</div>
{% endif %}
{% if user.hireable %}
<span title="Hire me" class="d-inline-block f5 rounded-2 text-white bg-green py-1 px-2">Available for hire</span>
{% endif %}
</div>
{% endif %}