chadtmiller.com/knotless
git that lives in your Atmosphere account
1
10
A profile with no repositories tells only its own account how to push one
web/src/lib/organisms/RepoHeader.svelte+2−1
| @@ -1,4 +1,5 @@ | ||
<script lang="ts" module> | ||
import { wrapDots } from '#lib/dots.ts'; | ||
import type { RepoViewDetailed } from '#lib/lexicons/dev/knotless/defs.ts'; | ||
export type Tab = 'code' | 'pulls' | 'issues' | 'releases' | 'checks' | 'settings'; | ||
</script> | ||
| @@ -67,7 +68,7 @@ | ||
{#if repo.description}<p>{repo.description}</p>{/if} | ||
{#if repo.topics?.length}<RepoTopics topics={repo.topics} />{/if} | ||
{#if repo.site || links.length || people.length || repo.releases} | ||
<div class="facts"> | ||
<div class="facts" {@attach wrapDots}> | ||
{#if repo.site}<RepoSite | ||
site={repo.site} | ||
repo={{ handle: authority, name: repo.name }} | ||
web/src/lib/dots.tsnew+27−0
| @@ -0,0 +1,27 @@ | ||
import type { Attachment } from 'svelte/attachments'; | ||
| ||
/** | ||
* A line of facts kept apart by dots (`.sep`) that wraps: a dot left at | ||
* the end of a line, or carried to the start of the next, is hidden, as | ||
* it would then part nothing. It keeps its place, so hiding it moves no | ||
* fact, and is judged again as the line is resized. | ||
*/ | ||
export const wrapDots: Attachment<HTMLElement> = (line) => { | ||
const middle = (el: Element) => { | ||
const r = el.getBoundingClientRect(); | ||
return r.top + r.height / 2; | ||
}; | ||
const judge = () => { | ||
for (const dot of line.querySelectorAll<HTMLElement>('.sep')) { | ||
const at = middle(dot); | ||
const apart = (el: Element | null) => | ||
!!el && Math.abs(middle(el) - at) > dot.offsetHeight / 2; | ||
const alone = apart(dot.previousElementSibling) || apart(dot.nextElementSibling); | ||
dot.classList.toggle('sep-wrapped', alone); | ||
} | ||
}; | ||
judge(); | ||
const sized = new ResizeObserver(judge); | ||
sized.observe(line); | ||
return () => sized.disconnect(); | ||
}; | ||
web/src/routes/[authority]/+page.svelte+6−4
| @@ -44,10 +44,12 @@ | ||
); | ||
</script> | ||
| ||
{#snippet none()}<Empty | ||
title="No public repositories yet" | ||
cmd="git push knotless://{handle}/project main">Push a branch to a new name to start one.</Empty | ||
>{/snippet} | ||
<!-- How to make one is said to the account itself, who can push. --> | ||
{#snippet none()}{#if me === p.did}<Empty | ||
title="No public repositories yet" | ||
cmd="git push knotless://{handle}/project main" | ||
>Push a branch to a new name to start one.</Empty | ||
>{:else}<Empty title="No public repositories yet" />{/if}{/snippet} | ||
| ||
<ProfilePage profile={p} {base} tab={data.tab} repos={data.repos.length}> | ||
{#if data.tab === 'repos'} | ||
web/src/app.css+4−0
| @@ -2360,6 +2360,10 @@ a.row:hover { | ||
.repohead .facts > .sep { | ||
color: var(--faint); | ||
} | ||
/* A dot a wrap left at a line's end or start (lib/dots.ts). */ | ||
.repohead .facts .sep-wrapped { | ||
visibility: hidden; | ||
} | ||
.repohead .facts .release-strip { | ||
margin-top: 0; | ||
} | ||