bukatchuk ui

Элементы

Аватар

Квадратное изображение профиля с рамкой и жёсткой тенью.

avatar с версии 0.1.0

Примеры

Аватар профиля
Фото профиля: Иванов Пётр
<img class="avatar" src="/static/avatar.png" alt="Фото профиля: Иванов Пётр" width="96" height="96">

Установка

bukatchuk-ui add avatar

Вместе с компонентом установятся: tokens, fonts, base.

Файлы

ФайлНазначение
avatar.cssстили
example.htmlобразец разметки, в проект не копируется
avatar.jekyll.htmlвставка для Jekyll
avatar.jinja.htmlвставка для Jinja

Вставка для Jekyll

{%- comment -%} Аватар. Параметры: src, alt. {%- endcomment -%}
<img class="avatar" src="{{ include.src }}" alt="{{ include.alt | default: 'Фото профиля' }}" width="96" height="96">

Макрос для Jinja

{#- Аватар. -#}
{% macro avatar(src, alt='Фото профиля') -%}
<img class="avatar" src="{{ src }}" alt="{{ alt }}" width="96" height="96">
{%- endmacro %}