b9e68e3bc8
Per-screen application of the design system to the Flutter app. Mirrors the web's surface phase landed in FabledScribe v26.04.28.1. Foundation port shipped in 0f05f47; this is the surface work. Lucide icon migration - Added lucide_icons ^0.257.0 dependency - 107 Material Icons references → LucideIcons across 21 files. Drop-in IconData swap (Icon(LucideIcons.X) instead of Icon(Icons.x)). - Lucide import added to each touched file. Input border radius - theme.dart inputDecorationTheme borderRadius 24 → 8 in both light and dark themes. Doc says radius-md (8px) for inputs; previous pill shape was Material default that the doc deviates from. Illuminated Transcript pattern (ChatMessageBubble) - User bubble: accent-tinted border → neutral Pewter (scheme.outline). Asymmetric corner already correct (bottomRight 4px). - Assistant bubble: topLeft corner 4 → 16; only bottomLeft stays 4 (the "tail" effect, mirroring web's `border-bottom-left-radius: 4px`). Background switched from surfaceContainerHighest (Slate) to surface (Iron) per the doc spec "card surface". - Assistant bubble glow shadow added — accent-tinted blur (28px alpha 0.14) + depth shadow (8px alpha 0.4 black). Mirrors web's --color-bubble-asst-shadow. ActionColors wiring (Hybrid rule) - 5 'Delete' confirm buttons across notes / tasks / chat conversations / calendar event sheet → Oxblood action-destructive via the ActionColors ThemeExtension defined in the foundation port. Foreground for ghost/text variants, backgroundColor for filled. - Calendar event Save button → Moss action-primary. The first call site to wire ActionColors.primary; serves as the pattern for future Save reclassifications. - Other Save buttons (note edit, task edit, project edit, etc.) still flow through colorScheme.primary (dusty violet) and read as brand-moment. Reclassifying those is deferred — the wiring pattern is established and can be applied incrementally as files are touched. Indigo cleanup - 4 hardcoded #7C3AED / #5B21B6 literals → dusty-violet equivalents (#5B4A8A / #3F3560). Spots: project_tasks_screen color fallback (×2), journal_screen gradient. Verification - flutter analyze: No issues found What's deferred - Per-screen Save / Cancel reclassification beyond the calendar event Save button. Wiring pattern established; rollout opportunistic. - Long-form 1.7 line-height on assistant Markdown content (would require MarkdownStyleSheet work; minor). - Surface walk on Knowledge / Projects / Settings screens for any hardcoded styling that needs touch. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
160 lines
4.9 KiB
Dart
160 lines
4.9 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:lucide_icons/lucide_icons.dart';
|
|
import 'package:go_router/go_router.dart';
|
|
|
|
import '../data/models/knowledge_item.dart';
|
|
|
|
class KnowledgeItemCard extends StatelessWidget {
|
|
final KnowledgeItem item;
|
|
const KnowledgeItemCard({super.key, required this.item});
|
|
|
|
IconData get _icon => switch (item.noteType) {
|
|
'person' => LucideIcons.user,
|
|
'place' => LucideIcons.mapPin,
|
|
'list' => LucideIcons.listChecks,
|
|
'task' => LucideIcons.checkCircle2,
|
|
_ => LucideIcons.fileText,
|
|
};
|
|
|
|
Color _statusColor(BuildContext context) {
|
|
if (item.noteType != 'task') return Theme.of(context).colorScheme.primary;
|
|
return switch (item.status) {
|
|
'done' => Colors.green,
|
|
'in_progress' => Colors.orange,
|
|
'cancelled' => Colors.grey,
|
|
_ => Theme.of(context).colorScheme.primary,
|
|
};
|
|
}
|
|
|
|
String? get _subtitle {
|
|
if (item.noteType == 'task') {
|
|
if (item.body.trim().isNotEmpty) {
|
|
final preview = item.body.trim().replaceAll('\n', ' ');
|
|
return preview.length > 200 ? '${preview.substring(0, 200)}…' : preview;
|
|
}
|
|
if (item.dueDate != null) return 'Due ${item.dueDate}';
|
|
return item.status;
|
|
}
|
|
if (item.body.trim().isEmpty) return null;
|
|
final preview = item.body.trim().replaceAll('\n', ' ');
|
|
return preview.length > 200 ? '${preview.substring(0, 200)}…' : preview;
|
|
}
|
|
|
|
void _onTap(BuildContext context) {
|
|
if (item.noteType == 'task') {
|
|
context.push('/tasks/${item.id}/edit');
|
|
} else {
|
|
context.push('/notes/${item.id}');
|
|
}
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return ListTile(
|
|
leading: Icon(_icon, color: _statusColor(context)),
|
|
title: Text(
|
|
item.title.isEmpty ? '(untitled)' : item.title,
|
|
maxLines: 1,
|
|
overflow: TextOverflow.ellipsis,
|
|
),
|
|
subtitle: _subtitle != null
|
|
? Text(
|
|
_subtitle!,
|
|
maxLines: 2,
|
|
overflow: TextOverflow.ellipsis,
|
|
style: Theme.of(context).textTheme.bodySmall,
|
|
)
|
|
: null,
|
|
trailing: item.tags.isNotEmpty ? _TagChips(tags: item.tags) : null,
|
|
onTap: () => _onTap(context),
|
|
);
|
|
}
|
|
|
|
Widget buildGridCard(BuildContext context) {
|
|
final scheme = Theme.of(context).colorScheme;
|
|
final textTheme = Theme.of(context).textTheme;
|
|
return Card(
|
|
elevation: 0,
|
|
shape: RoundedRectangleBorder(
|
|
borderRadius: BorderRadius.circular(10),
|
|
side: BorderSide(color: scheme.outlineVariant),
|
|
),
|
|
child: InkWell(
|
|
borderRadius: BorderRadius.circular(10),
|
|
onTap: () => _onTap(context),
|
|
child: Padding(
|
|
padding: const EdgeInsets.all(12),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Row(
|
|
children: [
|
|
Icon(_icon, size: 18, color: _statusColor(context)),
|
|
const SizedBox(width: 8),
|
|
Expanded(
|
|
child: Text(
|
|
item.title.isEmpty ? '(untitled)' : item.title,
|
|
maxLines: 2,
|
|
overflow: TextOverflow.ellipsis,
|
|
style: textTheme.titleSmall
|
|
?.copyWith(fontWeight: FontWeight.w600),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
if (_subtitle != null) ...[
|
|
const SizedBox(height: 8),
|
|
Expanded(
|
|
child: Text(
|
|
_subtitle!,
|
|
overflow: TextOverflow.ellipsis,
|
|
maxLines: 4,
|
|
style: textTheme.bodySmall?.copyWith(
|
|
color: scheme.onSurfaceVariant,
|
|
height: 1.4,
|
|
),
|
|
),
|
|
),
|
|
],
|
|
if (item.tags.isNotEmpty) ...[
|
|
const Spacer(),
|
|
_TagChips(tags: item.tags),
|
|
],
|
|
],
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|
|
|
|
class _TagChips extends StatelessWidget {
|
|
final List<String> tags;
|
|
const _TagChips({required this.tags});
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final shown = tags.take(2).toList();
|
|
final extra = tags.length - shown.length;
|
|
return Wrap(
|
|
spacing: 4,
|
|
children: [
|
|
for (final t in shown)
|
|
Chip(
|
|
label: Text(t, style: const TextStyle(fontSize: 10)),
|
|
padding: EdgeInsets.zero,
|
|
materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
|
|
visualDensity: VisualDensity.compact,
|
|
),
|
|
if (extra > 0)
|
|
Chip(
|
|
label: Text('+$extra', style: const TextStyle(fontSize: 10)),
|
|
padding: EdgeInsets.zero,
|
|
materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
|
|
visualDensity: VisualDensity.compact,
|
|
),
|
|
],
|
|
);
|
|
}
|
|
}
|