chadtmiller.com/knotless
git that lives in your Atmosphere account
1
10
The way to a directory's history is a quiet button
web/src/lib/organisms/FileList.svelte+3−3
| @@ -42,13 +42,13 @@ | ||
<Sha sha={last.sha} href={href(`/commit/${last.sha}`)} /> | ||
<span class="mute hide-sm"><Time at={whenCommitted(last)} show={age} /></span> | ||
{#await changes} | ||
<a class="history" href={history} title="History" aria-label="History"><Icon name="history" /><span class="words">History</span></a> | ||
<a class="btn quiet history" href={history} title="History" aria-label="History"><Icon name="history" /><span class="words">History</span></a> | ||
{:then found} | ||
{@const n = counted(found)} | ||
{#if n === undefined} | ||
<a class="history" href={history} title="History" aria-label="History"><Icon name="history" /><span class="words">History</span></a> | ||
<a class="btn quiet history" href={history} title="History" aria-label="History"><Icon name="history" /><span class="words">History</span></a> | ||
{:else} | ||
<a class="history" href={history} title={plural(n, 'commit', 'commits')} aria-label={plural(n, 'commit', 'commits')}><Icon name="history" /><span class="words"><b>{number(n)}</b>{` ${n === 1 ? 'commit' : 'commits'}`}</span></a> | ||
<a class="btn quiet history" href={history} title={plural(n, 'commit', 'commits')} aria-label={plural(n, 'commit', 'commits')}><Icon name="history" /><span class="words"><b>{number(n)}</b>{` ${n === 1 ? 'commit' : 'commits'}`}</span></a> | ||
{/if} | ||
{/await} | ||
</div> | ||
web/src/app.css+4−3
| @@ -413,8 +413,9 @@ a.row:hover{background:var(--hover)} | ||
.ref-counts a{display:inline-flex;align-items:center;gap:var(--space-1-5);color:var(--mute)} | ||
.ref-counts a:hover{color:var(--fg)} | ||
.ref-counts b{color:var(--fg);font-weight:var(--weight-semibold)} | ||
.history{display:inline-flex;align-items:center;gap:var(--space-1-5);color:var(--fg);white-space:nowrap} | ||
.history:hover{text-decoration:underline;text-decoration-color:var(--link-line);text-underline-offset:var(--underline-offset)} | ||
/* A button that sits back: filled softly, its border only under the pointer. */ | ||
.btn.quiet{border-color:transparent;background:var(--soft)} | ||
.btn.quiet:hover{border-color:var(--line);background:var(--soft)} | ||
.history b{font-weight:var(--weight-semibold)} | ||
.ref-name{display:flex;align-items:center;gap:var(--space-2);min-width:0} | ||
.crumbs{font-size:var(--text-md);min-width:0;overflow-wrap:anywhere} | ||
| @@ -1422,7 +1423,7 @@ textarea.field{resize:vertical;font-family:var(--font-mono);font-size:var(--text | ||
/* The counts of branches and tags, their numbers alone. */ | ||
.ref-counts .word,.history .words{display:none} | ||
/* The way to the history, by its icon alone, as GitHub's phone page has it: a tap's size, its words in its title. */ | ||
.last-head .history{justify-content:center;min-width:var(--control);height:var(--control)} | ||
.last-head .history{justify-content:center;width:var(--control);padding:0} | ||
/* A menu with much in it, a list to search or a form, opens as a sheet | ||
along the bottom, where it has the width; a few actions stay under the | ||
button that opened them. */ | ||