chadtmiller.com/knotless
git that lives in your Atmosphere account
1
10
A repository's website shows only its address
docs/guide/sites.md+2−2
| @@ -153,8 +153,8 @@ deployed: | ||
knotless repo site knotless://alice.example.com/blog | ||
``` | ||
| ||
The repository's page shows the site too, under its description: its | ||
address, the commit it was deployed from, and when. You don't need to add | ||
The repository's page shows the site's address too, under its | ||
description. You don't need to add | ||
the address to the repository's links. A private repository's site is | ||
shown only to its members. | ||
| ||
web/src/lib/molecules/RepoSite.svelte+6−20
| @@ -1,25 +1,11 @@ | ||
<script lang="ts"> | ||
import type { SiteView } from '#lib/lexicons/dev/knotless/defs.ts'; | ||
import Icon from '#lib/atoms/Icon.svelte'; | ||
import Sha from '#lib/atoms/Sha.svelte'; | ||
import Time from '#lib/atoms/Time.svelte'; | ||
import { ago, repoHref, siteLabel } from '#lib/format.ts'; | ||
/** A repository's website, `site`, of the repository `repo` names: its address, or for a `private` one its name, then what it was deployed from and when. */ | ||
let { | ||
site, | ||
repo, | ||
private: hidden = false | ||
}: { site: SiteView; repo: { handle: string; name: string }; private?: boolean } = $props(); | ||
import { siteLabel } from '#lib/format.ts'; | ||
/** A repository's website, `site`: its address, or for a `private` one its name. */ | ||
let { site, private: hidden = false }: { site: SiteView; private?: boolean } = $props(); | ||
</script> | ||
| ||
<span class="repo-site"> | ||
<a class="site-link" href={site.url} title={site.url} rel="noopener" | ||
><Icon name="globe" /><span>{hidden ? 'Private site' : siteLabel(site.url)}</span></a | ||
> | ||
<span class="mute" | ||
>{#if site.commit}from{' '}<Sha | ||
sha={site.commit} | ||
href={repoHref(repo.handle, repo.name, `/commit/${site.commit}`)} | ||
/>,{' '}{:else}deployed{' '}{/if}<Time at={site.deployedAt} show={(at) => ago(at)} /></span | ||
> | ||
</span> | ||
<a class="site-link repo-site" href={site.url} title={site.url} rel="noopener" | ||
><Icon name="globe" /><span>{hidden ? 'Private site' : siteLabel(site.url)}</span></a | ||
> | ||
web/src/lib/organisms/RepoHeader.svelte+1−5
| @@ -69,11 +69,7 @@ | ||
{#if repo.topics?.length}<RepoTopics topics={repo.topics} />{/if} | ||
{#if repo.site || links.length || people.length || repo.releases} | ||
<div class="facts" {@attach wrapDots}> | ||
{#if repo.site}<RepoSite | ||
site={repo.site} | ||
repo={{ handle: authority, name: repo.name }} | ||
private={repo.private} | ||
/>{/if} | ||
{#if repo.site}<RepoSite site={repo.site} private={repo.private} />{/if} | ||
{#if repo.site && links.length}<span class="sep" aria-hidden="true">·</span>{/if} | ||
{#if links.length}<RepoLinks {links} />{/if} | ||
{#if (repo.site || links.length) && people.length}<span class="sep" aria-hidden="true" | ||
web/src/app.css+2−13
| @@ -2358,21 +2358,10 @@ a.row:hover { | ||
min-width: 0; | ||
max-width: 100%; | ||
} | ||
/* A repository's website, then what it was deployed from, quieter. */ | ||
.repo-site { | ||
display: inline-flex; | ||
flex-wrap: wrap; | ||
align-items: center; | ||
gap: var(--space-1) var(--space-1-5); | ||
min-width: 0; | ||
max-width: 100%; | ||
} | ||
.repo-site > .site-link { | ||
/* A repository's website, cut short as its first link is. */ | ||
.site-link.repo-site { | ||
max-width: var(--repo-link-width); | ||
} | ||
.repo-site > .mute { | ||
font-size: var(--text-sm); | ||
} | ||
.links-menu { | ||
flex: none; | ||
} | ||