astryx-dracula 0.6.2 → 0.7.0

package/templates/tech-report.tsx

@@ -817,10 +817,13 @@ function ArchitectureScene({ alt }: { alt: string }) {
 				<path d="M42 158 H197 M42 158 V163 M197 158 V163" />
 				<path d="M202 158 H359 M202 158 V163 M359 158 V163" />
 			</g>
+			{/* Scene text is paragraph, never comment: comment is 3.36:1 on this
+          backdrop, under the 4.5:1 text floor, and it belongs to the bracket
+          strokes above, not to the words that name them. */}
 			<g
 				fontFamily="var(--font-family-mono)"
 				fontSize="10"
-				fill="var(--dracula-comment)"
+				fill="var(--color-text-paragraph)"
 				textAnchor="middle"
 			>
 				<text x="119" y="178">
@@ -1295,7 +1298,7 @@ function Fp4Scene({ alt }: { alt: string }) {
 						fontFamily="var(--font-family-mono)"
 						fontSize="11"
 						textAnchor="middle"
-						fill={bar.fill}
+						fill="var(--color-text-highlight)"
 						fillOpacity={0.95}
 					>
 						{bar.value}
@@ -1305,7 +1308,7 @@ function Fp4Scene({ alt }: { alt: string }) {
 			<g
 				fontFamily="var(--font-family-mono)"
 				fontSize="10"
-				fill="var(--dracula-comment)"
+				fill="var(--color-text-paragraph)"
 				textAnchor="middle"
 			>
 				{FP4_BARS.map((bar) => (
@@ -1381,7 +1384,7 @@ function EvalScene({ alt }: { alt: string }) {
 						fontFamily="var(--font-family-mono)"
 						fontSize="11"
 						textAnchor="middle"
-						fill={bar.fill}
+						fill="var(--color-text-highlight)"
 						fillOpacity={0.95}
 					>
 						{bar.value}
@@ -1391,7 +1394,7 @@ function EvalScene({ alt }: { alt: string }) {
 			<g
 				fontFamily="var(--font-family-mono)"
 				fontSize="10"
-				fill="var(--dracula-comment)"
+				fill="var(--color-text-paragraph)"
 				textAnchor="middle"
 			>
 				{EVAL_BARS.map((bar) => (

package/templates/theme-showcase.tsx

@@ -61,8 +61,13 @@ import {
 import type { ReactNode } from "react";
 
 // One Dracula accent per hero product slot. Purple stays off decorative art:
-// it reads as interactive, and nothing here is tappable.
-const PRODUCT_HUES = ["var(--dracula-green)", "var(--dracula-cyan)", "var(--dracula-yellow)"];
+// it reads as interactive, and nothing here is tappable. Typed `SceneHue` so
+// the union enforces that remit instead of the comment asking for it.
+const PRODUCT_HUES: readonly SceneHue[] = [
+	"var(--dracula-green)",
+	"var(--dracula-cyan)",
+	"var(--dracula-yellow)",
+];
 
 // Grid recipes the store renders at every width above the phone layout. Kept
 // at module scope: an object literal rebuilt per render is a new value prop
@@ -104,7 +109,7 @@ const DEFAULT_PRODUCTS: ProductSpec[] = [
 
 // Dracula product scene: harvest moon over sleeping hills with a per-product
 // accent glyph. All fills are brand vars, corners rx=4.
-function ProductArt({ hue, label }: { hue: string; label: string }) {
+function ProductArt({ hue, label }: { hue: SceneHue; label: string }) {
 	return (
 		<SceneFrame
 			label={`${label} artwork`}
@@ -291,7 +296,6 @@ function StorePreview({ products, isMobile }: { products: ProductSpec[]; isMobil
 													label="Add to cart"
 													variant="secondary"
 													size="sm"
-													href="#/templates/theme-showcase"
 													style={{ flex: 1 }}
 												/>
 											</HStack>
@@ -579,8 +583,10 @@ function LatestActivityCard({ isMobile }: { isMobile: boolean }) {
 						flex: 1,
 						minHeight: 0,
 						overflow: "hidden",
-						maskImage: "linear-gradient(to bottom, black calc(100% - 48px), transparent)",
-						WebkitMaskImage: "linear-gradient(to bottom, black calc(100% - 48px), transparent)",
+						maskImage:
+							"linear-gradient(to bottom, black calc(100% - var(--spacing-12)), transparent)",
+						WebkitMaskImage:
+							"linear-gradient(to bottom, black calc(100% - var(--spacing-12)), transparent)",
 						// Cancel the Item inline inset with the inset ITSELF: core
 						// publishes it as --_item-inset-inline (0.6.7), and it
 						// tracks density and theme overrides. A literal spacing
@@ -612,11 +618,12 @@ function LatestActivityCard({ isMobile }: { isMobile: boolean }) {
 									aria-hidden="true"
 									style={{
 										// Center supplies the 32px box and the centering; only the
-										// paint stays here. Surface, not muted: secondary
-										// #9AA1BC is 3.57:1 on muted #44475A, under the 4.5:1 text
-										// floor. The chip is aria-hidden decorative art so it
-										// clears the 3:1 non-text bar as-is, but the surface fill
-										// carries the same 4.60:1 pairing at no cost.
+										// paint stays here. Surface, not muted: muted is the
+										// RECESSED well (#21222C) since the token change, and this
+										// chip is a plate on the card, not a hole in it — the same
+										// tier ProductSwatch paints its plate with. The chip is
+										// aria-hidden decorative art, so it clears the 3:1
+										// non-text bar as-is.
 										borderRadius: "var(--radius-element)",
 										backgroundColor: "var(--color-background-surface)",
 										color: "var(--color-text-secondary)",

package/templates/work-item-detail.template.mjs

@@ -0,0 +1,8 @@
+export default {
+	type: "page",
+	name: "Work Item Detail",
+	description:
+		"Tracked task record with checklist, attachments, activity feed and a properties rail",
+	keywords: ["work item", "task detail", "issue", "subtasks", "activity", "properties", "comments"],
+	category: "product",
+};