1---2pagination:3 data: forge.owners4 size: 15 alias: o6permalink: "/{{ o.owner | safe }}/index.html"7---8{#- An owner's page: their front matter (avatar, name, what they set with9 ssh profile, facts), the repos they pinned (or their most recently10 active), then their repos on shelves with their activity grid. -#}11{% extends "base.njk" %}12{% import "macros.njk" as m with context %}13{% import "ui.njk" as ui %}14{% set pr = o.person %}15{% block head %}{{ m.meta(o.owner + ' - ' + forge.config.name, pr.bio or (o.repos.length | plural('public repo')) + ' on ' + forge.config.name, '/' + o.owner + '/') }}{% endblock %}16{% block heading %}<b>{{ o.owner }}</b>17{% endblock %}18{% block content %}19{% css %}20/* Front matter: who this is, on the page, over their repos. */21.person { display: flex; align-items: center; gap: var(--space-4); margin: 0 0 var(--space-5); min-width: 0; }22.person .avatar { width: 72px; height: 72px; }23.person-text { min-width: 0; }24.person h1 { margin: 0; font-size: var(--text-2xl); line-height: 1.15; overflow-wrap: anywhere; }25.person .bio { margin: var(--space-1) 0 0; color: var(--fg); overflow-wrap: anywhere; }26.person-facts { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-1) var(--space-4); margin: var(--space-1) 0 0; font-size: var(--text-sm); color: var(--muted); }27.person-facts .link { display: inline-flex; align-items: center; gap: var(--space-1); min-width: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: var(--fw-medium); }28.person-facts .link .icon { align-self: center; }29@media (max-width: 480px) {30 .person { align-items: flex-start; gap: var(--space-3); }31 .person h1 { font-size: var(--text-xl); }32}33/* Pinned: up to three repos side by side, a hairline between them; the34 panel's edge is the rule round them. */35.pins { overflow: hidden; }36.pin-grid { display: grid; grid-template-columns: repeat(var(--pins), minmax(0, 1fr)); margin: 0 calc(-1 * var(--hairline)) 0 0; padding: 0; list-style: none; }37.pin-grid > li { position: relative; display: flex; flex-direction: column; gap: var(--space-1); min-width: 0; padding: var(--space-3); border-right: var(--hairline) solid var(--border); }38.pin-grid > li:hover, .pin-grid > li:focus-within { background: var(--hover); }39.pin-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: var(--fw-strong); color: var(--fg); }40.pin-name:hover { color: var(--fg); }41.pin-name::after { content: ''; position: absolute; inset: 0; }42.pin-desc { flex: 1; margin: 0; font-size: var(--text-sm); color: var(--muted); overflow-wrap: anywhere; }43.pin-foot { display: flex; align-items: baseline; gap: var(--space-3); font: var(--fw-regular) var(--text-xs) var(--mono); color: var(--faint); white-space: nowrap; }44.pin-foot a { position: relative; z-index: 1; }45.pin-foot .site { display: inline-flex; align-items: center; gap: var(--space-1); align-self: center; min-width: 0; overflow: hidden; text-overflow: ellipsis; }46.pin-foot .grow { flex: 1; }47.pin-foot time { font-size: inherit; font-variant-numeric: tabular-nums; }48@media (max-width: 720px) {49 .pin-grid { grid-template-columns: minmax(0, 1fr); margin: 0; }50 .pin-grid > li { border-right: 0; border-bottom: var(--hairline) solid var(--border); }51 .pin-grid > li:last-child { border-bottom: 0; }52}53{% endcss %}54<section class="person">55{{ o.owner | avatar(72) }}56<div class="person-text">57<h1>{{ o.owner }}</h1>58{% if pr.bio %}<p class="bio">{{ pr.bio }}</p>{% endif %}59<p class="person-facts">{% if pr.link %}<a class="link" href="{{ pr.link }}" rel="me nofollow">{{ ui.icon('link') }}{{ pr.linkText }}</a>{% endif %}<span>{{ o.repos.length | plural('repo') }}{% if pr.sites %}, {{ pr.sites | plural('site') }}{% endif %}{% if pr.joined %}, joined {{ pr.joined }}{% endif %}</span></p>60</div>61</section>62{% if pr.pins.length %}63{% set head %}<h2>{{ 'pinned' if pr.pinned else 'recently active' }}</h2>{% endset %}64{% call ui.panel(head, 'pins') %}65<ul class="pin-grid" style="--pins: {{ pr.pins.length }}">66{% for s in pr.pins %}67<li><a class="pin-name" href="{{ s.urls.home.href }}">{{ s.name }}</a>68<p class="pin-desc">{{ s.description }}</p>69<div class="pin-foot">{% if s.release %}<a class="mono" href="{{ s.release.href }}" title="its latest release">{{ s.release.tag }}</a>{% else %}{{ m.sitesLink(s) }}{% endif %}<span class="grow"></span>{{ s.lastCommit | date }}</div></li>70{% endfor %}71</ul>72{% endcall %}73{% endif %}74{{ m.shelves(o.repos, false, o.activity) }}75{% endblock %}