bvandeusenandClaude Opus 5.5
067aa58fbc
CI & Build / Python lint (push) Successful in 2s
CI & Build / Plugin hooks (push) Successful in 12s
CI & Build / TypeScript typecheck (push) Successful in 53s
CI & Build / integration (push) Successful in 1m9s
CI & Build / Python tests (push) Successful in 1m55s
CI & Build / Build & push image (push) Successful in 34s
The acceptance greps found what the per-area passes missed: - src/scribe: "Phase 7/8" removal notes in projects, settings and user_profile; a paragraph promising an auto-summary side effect that no longer exists; user_profile's claim that "upcoming MCP profile tools" read the profile, which nothing does; an instance count and instance rule titles in plugin_context; "MILESTONE 323 DECIDED" in rulebooks. - scripts/: check_plugin's header and inline comments were a history of the incidents behind each guard, with issue numbers in two failure messages; check_dangling_styles named this app's classes as its examples; check_design_tokens, measure_duplication and mint_plugin_version cited issues and checklists. - frontend/src: forty-odd comments with four-digit issue numbers that the earlier frontend scan filtered out as hex colours, plus "used to" and "Phase N" notes. Kept: illustrative ids (`#4181` as a bare-id example, `PR #198`), migration Create Date headers and one migration's dated data floor, and the plugin skills' worked examples of how to cite a record. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
72 lines
2.7 KiB
Vue
72 lines
2.7 KiB
Vue
<script setup lang="ts">
|
|
/**
|
|
* A PROJECT's lifecycle state as a pill — active, paused, completed, archived.
|
|
*
|
|
* Deliberately not StatusBadge. That component is typed to TaskStatus and
|
|
* speaks a different vocabulary; these two only ever shared a CSS class name,
|
|
* which is what makes them look like one shape that has drifted.
|
|
*
|
|
* Extracted because ProjectView and ProjectListView really were spelling the
|
|
* same pill twice, with the differences you get from two hands rather than
|
|
* two intentions: 0.68rem against 0.7rem, a 14% tint against 15%, one with a
|
|
* border and one without.
|
|
*/
|
|
const props = defineProps<{ status: string }>();
|
|
|
|
const LABELS: Record<string, string> = {
|
|
active: "Active",
|
|
paused: "Paused",
|
|
completed: "Completed",
|
|
archived: "Archived",
|
|
};
|
|
|
|
const label = (s: string) => LABELS[s] ?? s;
|
|
</script>
|
|
|
|
<template>
|
|
<span :class="['project-status', `project-status--${props.status}`]">
|
|
{{ label(props.status) }}
|
|
</span>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.project-status {
|
|
font-size: 0.7rem;
|
|
font-weight: 500;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.04em;
|
|
padding: 0.15rem 0.5rem;
|
|
border-radius: var(--fs-radius-pill);
|
|
flex-shrink: 0;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
/* Text is the hue mixed toward --fs-text-primary, not the raw hue. Both old
|
|
spellings painted the hue on a 15% tint of itself, which measured 1.61-2.39:1
|
|
against AA's 4.5 — the same defect the status and priority ladders had, and
|
|
invisible to the token checker because the background was an inline
|
|
color-mix rather than a `-bg` token. The checker was widened alongside this.
|
|
Measured worst-case over raised and hover in both modes: active 4.82:1,
|
|
paused 4.63:1, completed 4.78:1, archived 4.84:1.
|
|
No new design tokens: four values used by one component are the kind of
|
|
growth Scribe's own design-system note warns about ("if this system grows
|
|
past a handful of tokens, that is worth noticing rather than
|
|
accommodating"). The derivation is stated once, here. */
|
|
.project-status--active {
|
|
background: color-mix(in srgb, var(--fs-success) 15%, transparent);
|
|
color: color-mix(in srgb, var(--fs-success) 45%, var(--fs-text-primary));
|
|
}
|
|
.project-status--paused {
|
|
background: color-mix(in srgb, var(--fs-warning) 15%, transparent);
|
|
color: color-mix(in srgb, var(--fs-warning) 55%, var(--fs-text-primary));
|
|
}
|
|
.project-status--completed {
|
|
background: color-mix(in srgb, var(--fs-accent) 15%, transparent);
|
|
color: color-mix(in srgb, var(--fs-accent) 45%, var(--fs-text-primary));
|
|
}
|
|
.project-status--archived {
|
|
background: color-mix(in srgb, var(--fs-text-tertiary) 15%, transparent);
|
|
color: color-mix(in srgb, var(--fs-text-tertiary) 55%, var(--fs-text-primary));
|
|
}
|
|
</style>
|