Блоки

Подпись автора

Чёрная плашка под статьёй: аватар, имя, описание и ссылки.

Примеры

<div class="author">
  <img class="author__ava" src="logo.png" alt="Олег Букатчук" width="64" height="64">
  <div>
    <div class="author__n">Олег Букатчук</div>
    <div class="author__d">DevOps- и SRE-инженер. Строил отказоустойчивую инфраструктуру для классифайда, e-commerce и госсектора.</div>
    <div class="author__l">
      <a href="#">Об авторе</a>
      <a href="#" target="_blank" rel="noopener">Телеграм</a>
      <a href="#" target="_blank" rel="noopener">GitHub</a>
    </div>
  </div>
</div>

Установка

bukatchuk-ui add author

Файлы

Вставка для Jekyll

{%- comment -%}
  Подпись автора. Параметры: name, bio, avatar (адрес картинки), links (список пар {text, href}).
  Внешние ссылки (с http) открываются в новой вкладке.
{%- endcomment -%}
<div class="author">
  <img class="author__ava" src="{{ include.avatar | relative_url }}" alt="{{ include.name }}" width="64" height="64">
  <div>
    <div class="author__n">{{ include.name }}</div>
    <div class="author__d">{{ include.bio }}</div>
    {%- if include.links %}
    <div class="author__l">
      {%- for l in include.links %}
      <a href="{{ l.href }}"{% if l.href contains 'http' %} target="_blank" rel="noopener"{% endif %}>{{ l.text }}</a>
      {%- endfor %}
    </div>
    {%- endif %}
  </div>
</div>