feat(tasks): mark a delegated task with a hand-off arrow
A task assigned to somebody who is not you is out of your hands and into theirs, but the row only showed their name — the same weight as any other meta. The assignee is now a bordered chip led by an outgoing arrow in the accent colour, so a list reads at a glance as which tasks are yours to do and which you are waiting on. Covers the board too: its cards render a TaskRow. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Opus 4.8
parent
2da679d629
commit
7dcd475036
@@ -113,8 +113,14 @@
|
||||
{#if assignee}
|
||||
<!-- First in the row, because "who" changes what the rest of the line
|
||||
means: a date on somebody else's task is their deadline, not
|
||||
yours. -->
|
||||
<span class="assignee" title={t('task.assignee', { name: assignee.name })}>
|
||||
yours. The hand-off arrow marks it as delegated — out of your
|
||||
hands and into theirs — so a list reads at a glance as which are
|
||||
yours to do and which you are waiting on. -->
|
||||
<span class="assignee" title={t('task.delegatedTo', { name: assignee.name })}>
|
||||
<svg class="handoff" viewBox="0 0 24 24" aria-hidden="true">
|
||||
<path d="M13 5l7 7-7 7" />
|
||||
<path d="M20 12H4" />
|
||||
</svg>
|
||||
<span class="face" style="background: {assignee.avatar_color}">
|
||||
{assignee.name[0]?.toUpperCase() ?? '?'}
|
||||
</span>
|
||||
@@ -358,8 +364,25 @@
|
||||
.assignee {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: var(--s1);
|
||||
gap: 4px;
|
||||
color: var(--ink-muted);
|
||||
background: var(--surface-raised);
|
||||
border: 1px solid var(--line);
|
||||
border-radius: var(--radius-full);
|
||||
padding: 1px var(--s2) 1px 4px;
|
||||
}
|
||||
|
||||
/* The delegation mark: an arrow leaving, in the accent so the chip reads as
|
||||
handed-off rather than as just another name. */
|
||||
.handoff {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
fill: none;
|
||||
stroke: var(--accent);
|
||||
stroke-width: 2;
|
||||
stroke-linecap: round;
|
||||
stroke-linejoin: round;
|
||||
flex: none;
|
||||
}
|
||||
|
||||
.face {
|
||||
|
||||
Reference in New Issue
Block a user