chadtmiller.com/knotless
git that lives in your Atmosphere account
1
10
Phone pages keep the clone command, name, toolbar and tip in place
web/src/lib/molecules/CloneMenu.svelte+2−1
| @@ -1,6 +1,7 @@ | ||
<script lang="ts"> | ||
import CopyButton from '#lib/atoms/CopyButton.svelte'; | ||
import Icon from '#lib/atoms/Icon.svelte'; | ||
import { scrollRow } from '#lib/rows.ts'; | ||
import { archiveHref } from '#lib/format.ts'; | ||
/** The Code button, opening to how to clone the repository `name` that `authority` owns, and to download its files at `rev`. */ | ||
let { authority, name, rev }: { authority: string; name: string; rev: string } = $props(); | ||
| @@ -17,7 +18,7 @@ | ||
<summary class="btn primary"><Icon name="code" />Code<Icon name="caret" /></summary> | ||
<div class="menu"> | ||
<div class="menu-head">Clone with git</div> | ||
<div class="clone"><code>{clone}</code><CopyButton text={clone} /></div> | ||
<div class="clone"><code {@attach scrollRow(clone)}>{clone}</code><CopyButton text={clone} /></div> | ||
<p>Needs the knotless git helper. <a href="/start">Set it up</a></p> | ||
<div class="menu-head">Download</div> | ||
<a href={archiveHref(authority, name, rev, 'zip')} download><Icon name="download" />Download zip</a> | ||
web/src/lib/organisms/FileList.svelte+1−1
| @@ -32,7 +32,7 @@ | ||
</script> | ||
| ||
<div class="box code-panel"> | ||
{#if languages.length}<LangEdge {languages} />{/if} | ||
{#if languages.length}<LangEdge {languages} />{:else}<div class="lang-edge" aria-hidden="true"></div>{/if} | ||
{#if bar}<div class="boxhead panel-bar">{@render bar()}</div>{/if} | ||
{#if last} | ||
<div class="boxhead last-head"> | ||
web/src/lib/organisms/RepoHeader.svelte+1−1
| @@ -30,7 +30,7 @@ | ||
| ||
<div class="repohead"> | ||
<div class="about"> | ||
<h1><Avatar name={authority} did={repo.owner.did} src={repo.owner.avatar} /><a href="/{urlPath(authority)}">{authority}</a><span class="mute">/</span><span class="repo-name"><a href={href()}><b>{repo.name}</b></a><RepoSwitch {authority} did={repo.owner.did} name={repo.name} /></span>{#if repo.private}<PrivateTag />{/if}{#if repo.archivedAt}<ArchivedTag />{/if}</h1> | ||
<h1><Avatar name={authority} did={repo.owner.did} src={repo.owner.avatar} /><a href="/{urlPath(authority)}">{authority}</a><span class="repo-name"><span class="mute">/</span><a href={href()}><b>{repo.name}</b></a><RepoSwitch {authority} did={repo.owner.did} name={repo.name} /></span>{#if repo.private}<PrivateTag />{/if}{#if repo.archivedAt}<ArchivedTag />{/if}</h1> | ||
{#if repo.description}<p>{repo.description}</p>{/if} | ||
{#if repo.topics?.length}<RepoTopics topics={repo.topics} />{/if} | ||
{#if links.length || people.length || repo.releases} | ||
web/src/app.css+5−1
| @@ -463,7 +463,7 @@ a.row:hover{background:var(--hover)} | ||
.lang-edge .seg:first-child{border-top-left-radius:var(--radius-md)} | ||
.lang-edge .seg:last-child{border-top-right-radius:var(--radius-md)} | ||
.lang-edge .seg:focus-visible{outline:0;box-shadow:var(--ring)} | ||
.lang-tip{display:none;position:absolute;bottom:calc(100% + var(--space-1-5));left:50%;transform:translateX(-50%);z-index:var(--z-menu);align-items:center;gap:var(--space-1-5);padding:var(--space-1) var(--space-2);background:var(--panel);border:var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-pop);font:var(--text-xs) var(--font-sans);color:var(--fg);white-space:nowrap;pointer-events:none} | ||
.lang-tip{display:none;position:absolute;top:calc(100% + var(--space-1-5));left:50%;transform:translateX(-50%);z-index:var(--z-menu);align-items:center;gap:var(--space-1-5);padding:var(--space-1) var(--space-2);background:var(--panel);border:var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-pop);font:var(--text-xs) var(--font-sans);color:var(--fg);white-space:nowrap;pointer-events:none} | ||
.lang-edge .seg.start .lang-tip{left:0;transform:none} | ||
.lang-edge .seg.end .lang-tip{left:auto;right:0;transform:none} | ||
.lang-wrap:not(.open) .seg:is(:hover,:focus-visible) .lang-tip{display:inline-flex} | ||
| @@ -1433,6 +1433,10 @@ textarea.field{resize:vertical;font-family:var(--font-mono);font-size:var(--text | ||
main.wrap{padding-top:var(--space-5)} | ||
/* The path takes a line of its own under the branch and Code, rather than pushing Code onto one alone. */ | ||
.toolbar .crumbs{order:1;flex-basis:100%} | ||
/* Compare & pull and Code, when both show, share the line they wrap to, half each, rather than two buttons left stranded at its end. */ | ||
.toolbar-end:has(>.btn+.clone-menu){flex:1 1 auto} | ||
.toolbar-end:has(>.btn+.clone-menu)>*{flex:1 1 0} | ||
.toolbar-end:has(>.btn+.clone-menu)>.btn,.toolbar-end:has(>.btn+.clone-menu)>.clone-menu>summary{flex:1;justify-content:center} | ||
.top .wrap{gap:var(--space-4)} | ||
/* A repository's Fork and Star share the row, as Follow fills a profile's: | ||
half each, whatever is in them, so starring does not move the split. | ||