@refrakt-md/plan 0.9.0

package/styles/minimal.css

@@ -0,0 +1,379 @@
+/* ==========================================================================
+   Plan Dashboard — Minimal Theme
+   Clean typography, no color badges, print-friendly
+   ========================================================================== */
+
+:root {
+	--plan-font-sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
+	--plan-font-mono: ui-monospace, "Cascadia Code", "Fira Code", monospace;
+	--plan-font-size-sm: 0.8125rem;
+	--plan-font-size-base: 0.9375rem;
+	--plan-font-size-lg: 1.125rem;
+	--plan-font-size-xl: 1.5rem;
+	--plan-line-height: 1.6;
+	--plan-color-text: #212529;
+	--plan-color-text-muted: #6c757d;
+	--plan-color-border: #dee2e6;
+}
+
+/* --------------------------------------------------------------------------
+   Entity cards — borders only, no shadows
+   -------------------------------------------------------------------------- */
+
+.rf-spec,
+.rf-work,
+.rf-bug,
+.rf-decision,
+.rf-milestone {
+	border: 1px solid var(--plan-color-border);
+	padding: 1.5rem;
+	margin-block-end: 1.5rem;
+	page-break-inside: avoid;
+}
+
+/* --------------------------------------------------------------------------
+   Headers — inline, no colored backgrounds
+   -------------------------------------------------------------------------- */
+
+.rf-spec__header,
+.rf-work__header,
+.rf-bug__header,
+.rf-decision__header,
+.rf-milestone__header {
+	display: flex;
+	flex-wrap: wrap;
+	gap: 0.75rem;
+	align-items: baseline;
+	margin-block-end: 1rem;
+	padding-block-end: 0.75rem;
+	border-block-end: 1px solid var(--plan-color-border);
+}
+
+/* --------------------------------------------------------------------------
+   Body content
+   -------------------------------------------------------------------------- */
+
+.rf-spec__body,
+.rf-work__body,
+.rf-bug__body,
+.rf-decision__body,
+.rf-milestone__body {
+	font-family: var(--plan-font-sans);
+	font-size: var(--plan-font-size-base);
+	line-height: var(--plan-line-height);
+	color: var(--plan-color-text);
+}
+
+.rf-spec__body h1,
+.rf-work__body h1,
+.rf-bug__body h1,
+.rf-decision__body h1,
+.rf-milestone__body h1 {
+	font-size: var(--plan-font-size-xl);
+	margin-block: 0 1rem;
+}
+
+.rf-spec__body h2,
+.rf-work__body h2,
+.rf-bug__body h2,
+.rf-decision__body h2,
+.rf-milestone__body h2 {
+	font-size: var(--plan-font-size-lg);
+	margin-block: 1.5rem 0.5rem;
+	border-block-end: 1px solid var(--plan-color-border);
+	padding-block-end: 0.25rem;
+}
+
+/* --------------------------------------------------------------------------
+   Layout — simple single column
+   -------------------------------------------------------------------------- */
+
+.rf-plan-dashboard {
+	max-width: 48rem;
+	margin: 0 auto;
+	padding: 2rem 1rem;
+}
+
+.rf-plan-dashboard__section-title {
+	font-family: var(--plan-font-sans);
+	font-size: var(--plan-font-size-lg);
+	font-weight: 600;
+	margin-block-end: 1rem;
+	border-block-end: 2px solid var(--plan-color-text);
+	padding-block-end: 0.25rem;
+}
+
+/* No sidebar in minimal */
+.rf-plan-sidebar { display: none; }
+.rf-plan-main { margin-inline-start: 0; padding: 2rem 1rem; max-width: 48rem; margin-inline: auto; }
+
+/* Cross-reference links — plain */
+.rf-plan-ref {
+	font-family: var(--plan-font-mono);
+	font-size: var(--plan-font-size-sm);
+	color: var(--plan-color-text);
+	text-decoration: underline;
+}
+
+.rf-plan-ref::before { display: none; }
+
+/* Progress bar — simple */
+.rf-plan-progress { display: flex; align-items: center; gap: 0.5rem; margin-block: 0.5rem; }
+.rf-plan-progress__bar { flex: 1; height: 0.375rem; background: #e9ecef; overflow: hidden; }
+.rf-plan-progress__fill { height: 100%; background: var(--plan-color-text-muted); }
+.rf-plan-progress__label { font-size: var(--plan-font-size-sm); font-family: var(--plan-font-mono); color: var(--plan-color-text-muted); }
+
+/* --------------------------------------------------------------------------
+   Backlog — minimal
+   -------------------------------------------------------------------------- */
+
+.rf-backlog {
+	margin-block-end: 1.5rem;
+}
+.rf-backlog__group {
+	margin-bottom: 1.5rem;
+}
+.rf-backlog__group-title {
+	font-size: var(--plan-font-size-sm);
+	font-weight: 700;
+	text-transform: uppercase;
+	letter-spacing: 0.05em;
+	color: var(--plan-color-text-muted);
+	margin: 0 0 0.5rem;
+	padding-bottom: 0.25rem;
+	border-bottom: 1px solid var(--plan-color-border);
+}
+.rf-backlog__card {
+	padding: 0.5rem 0;
+	border-bottom: 1px solid var(--plan-color-border);
+}
+.rf-backlog__card:last-child {
+	border-bottom: none;
+}
+.rf-backlog__card-header {
+	display: flex;
+	align-items: baseline;
+	gap: 0.5rem;
+	flex-wrap: wrap;
+}
+.rf-backlog__card-id {
+	font-family: var(--plan-font-mono);
+	font-size: var(--plan-font-size-sm);
+	font-weight: 700;
+	color: var(--plan-color-text);
+}
+.rf-backlog__card-status {
+	font-size: var(--plan-font-size-sm);
+	color: var(--plan-color-text-muted);
+	text-transform: capitalize;
+}
+.rf-backlog__card-status::before { content: '— '; }
+.rf-backlog__card-priority,
+.rf-backlog__card-severity,
+.rf-backlog__card-complexity {
+	font-size: var(--plan-font-size-sm);
+	color: var(--plan-color-text-muted);
+	text-transform: capitalize;
+}
+.rf-backlog__card-milestone {
+	font-size: var(--plan-font-size-sm);
+	color: var(--plan-color-text-muted);
+	margin-left: auto;
+}
+.rf-backlog__card-progress {
+	font-family: var(--plan-font-mono);
+	font-size: var(--plan-font-size-sm);
+	color: var(--plan-color-text-muted);
+	margin-left: auto;
+}
+.rf-backlog__card-title {
+	font-size: var(--plan-font-size-base);
+	font-weight: 500;
+	color: var(--plan-color-text);
+}
+
+/* --------------------------------------------------------------------------
+   Decision Log — minimal
+   -------------------------------------------------------------------------- */
+
+.rf-decision-log {
+	margin-block-end: 1.5rem;
+}
+.rf-decision-log__list {
+	list-style: none;
+	padding: 0;
+	margin: 0;
+}
+.rf-decision-log__entry {
+	display: flex;
+	align-items: baseline;
+	gap: 0.5rem;
+	padding: 0.375rem 0;
+	border-bottom: 1px solid var(--plan-color-border);
+}
+.rf-decision-log__entry:last-child {
+	border-bottom: none;
+}
+.rf-decision-log__date {
+	font-family: var(--plan-font-mono);
+	font-size: var(--plan-font-size-sm);
+	color: var(--plan-color-text-muted);
+	min-width: 6.5rem;
+	flex-shrink: 0;
+}
+.rf-decision-log__id {
+	font-family: var(--plan-font-mono);
+	font-size: var(--plan-font-size-sm);
+	font-weight: 700;
+	color: var(--plan-color-text);
+}
+.rf-decision-log__status {
+	font-size: var(--plan-font-size-sm);
+	color: var(--plan-color-text-muted);
+	text-transform: capitalize;
+}
+.rf-decision-log__status::before { content: '— '; }
+.rf-decision-log__title {
+	font-size: var(--plan-font-size-base);
+	font-weight: 500;
+	color: var(--plan-color-text);
+	flex: 1;
+	min-width: 0;
+}
+.rf-decision-log__entry[data-status="superseded"] .rf-decision-log__title,
+.rf-decision-log__entry[data-status="deprecated"] .rf-decision-log__title {
+	color: var(--plan-color-text-muted);
+	text-decoration: line-through;
+}
+
+/* --------------------------------------------------------------------------
+   Milestone Auto-Backlog
+   -------------------------------------------------------------------------- */
+
+.rf-milestone__backlog {
+	margin-block-start: 1.5rem;
+	padding-block-start: 1rem;
+	border-block-start: 1px solid var(--plan-color-border);
+}
+.rf-milestone__tabs {
+	display: flex;
+	border-bottom: 1px solid var(--plan-color-border);
+	overflow-x: auto;
+	margin-bottom: 0;
+}
+.rf-milestone__tab {
+	flex: 0 0 auto;
+	padding: 0.375rem 0.75rem;
+	font-size: var(--plan-font-size-sm);
+	font-weight: 500;
+	color: var(--plan-color-text-muted);
+	background: none;
+	border: none;
+	border-bottom: 2px solid transparent;
+	cursor: pointer;
+	white-space: nowrap;
+	font-family: var(--plan-font-sans);
+	text-transform: uppercase;
+	letter-spacing: 0.05em;
+}
+.rf-milestone__tab:hover {
+	color: var(--plan-color-text);
+}
+.rf-milestone__tab--active {
+	color: var(--plan-color-text);
+	border-bottom-color: var(--plan-color-text);
+	font-weight: 700;
+}
+.rf-milestone__panels {
+	padding: 0;
+	margin: 0;
+}
+.rf-milestone__panel {
+	padding-top: 0.5rem;
+}
+.rf-milestone__backlog-group {
+	margin-block-end: 1rem;
+}
+.rf-milestone__backlog-group-label {
+	font-size: var(--plan-font-size-sm);
+	font-weight: 700;
+	text-transform: uppercase;
+	letter-spacing: 0.05em;
+	color: var(--plan-color-text-muted);
+	margin: 0 0 0.5rem;
+	padding-block-end: 0.25rem;
+	border-block-end: 1px solid var(--plan-color-border);
+}
+.rf-milestone__progress {
+	display: flex;
+	align-items: center;
+	gap: 0.5rem;
+	margin-block-end: 1rem;
+}
+.rf-milestone__progress-label {
+	font-size: var(--plan-font-size-sm);
+	font-family: var(--plan-font-mono);
+	color: var(--plan-color-text-muted);
+	white-space: nowrap;
+}
+.rf-milestone__progress-bar {
+	flex: 1;
+	height: 0.375rem;
+	background: #e9ecef;
+	overflow: hidden;
+}
+.rf-milestone__progress-bar::after {
+	content: '';
+	display: block;
+	height: 100%;
+	width: var(--rf-progress, 0%);
+	background: var(--plan-color-text-muted);
+}
+
+/* --------------------------------------------------------------------------
+   Print styles
+   -------------------------------------------------------------------------- */
+
+@media print {
+	.rf-plan-sidebar { display: none; }
+	.rf-plan-main { margin: 0; padding: 0; }
+
+	.rf-spec,
+	.rf-work,
+	.rf-bug,
+	.rf-decision,
+	.rf-milestone {
+		box-shadow: none;
+		border: 1px solid #ccc;
+		page-break-inside: avoid;
+	}
+
+	.rf-copy-btn { display: none; }
+}
+
+/* Copy-to-clipboard */
+
+.rf-code-wrapper { position: relative; }
+
+.rf-copy-btn {
+	position: absolute;
+	top: 0.25rem;
+	right: 0.25rem;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	width: 2rem;
+	height: 2rem;
+	padding: 0;
+	border: 1px solid #ddd;
+	border-radius: 4px;
+	background: #fff;
+	color: #666;
+	cursor: pointer;
+	opacity: 0;
+	transition: opacity 0.15s ease;
+}
+
+.rf-code-wrapper:hover .rf-copy-btn { opacity: 1; }
+.rf-copy-btn:hover { color: #333; border-color: #999; }
+.rf-copy-btn--copied { color: #22863a; border-color: #22863a; }

package/styles/tokens.css

@@ -0,0 +1,13 @@
+/* Plan CLI shell tokens
+ *
+ * Shell-specific custom properties for the plan CLI layout (sidebar, dashboard,
+ * TOC, cross-references). Rune styling is handled entirely by the active theme
+ * (Lumina by default).
+ *
+ * All values reference --rf-* tokens when a refrakt theme is active, with
+ * fallback values for standalone use.
+ */
+:root {
+	/* Sidebar */
+	--plan-sidebar-width: 16rem;
+}