Tasks now carry a tick box rather than being read-only rows. Ticking strikes the title through and leaves the item in place, so a day still reads as a record of what was asked rather than only what is left. New in designs/Checkbox.dart: - TickBox the square box itself, animating between empty and filled - TickRow box + struck-through title + caller-supplied detail and trailing - addTaskAffordance the centred "Add new task" control beneath a day's list Applied to the home plan, the overdue queue and the goal task list. Each screen holds a set of optimistically ticked ids so the tick lands immediately and rolls back if the call fails; the set is reconciled whenever fresh data arrives. A tick completes the item outright, whatever its proof requirement. The proof flow is still reachable from the Complete button in the overdue queue, so tasks that need an artefact have a route that asks for one — but the tick itself no longer enforces it. Late completes stay visually distinct: the row keeps a Late pill and the warning accent, and the user is told the window had already closed. flutter analyze lib/ reports no errors. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Mfu2gQLSFN21YRBcU2NrTt
178 lines
4.6 KiB
Dart
178 lines
4.6 KiB
Dart
import 'package:flutter/material.dart';
|
|
|
|
import '../../about/internal/application/TextType.dart';
|
|
import '../../utils/Colors.dart';
|
|
import '../text/Text.dart';
|
|
|
|
/// The primary action. One per screen — if a screen appears to need two, one
|
|
/// of them is secondary.
|
|
Widget roundedCornerButton(
|
|
String label,
|
|
VoidCallback onPressed, {
|
|
Color? background,
|
|
Color? foreground,
|
|
IconData? icon,
|
|
bool enabled = true,
|
|
double radius = 14,
|
|
double verticalPadding = 16,
|
|
}) {
|
|
final Color bg = enabled ? (background ?? colorPrimaryDark) : colorGrey;
|
|
final Color fg = foreground ?? colorWhite;
|
|
|
|
return ElevatedButton(
|
|
onPressed: enabled ? onPressed : null,
|
|
style: ElevatedButton.styleFrom(
|
|
elevation: 0,
|
|
backgroundColor: bg,
|
|
disabledBackgroundColor: colorGrey.withValues(alpha: 0.4),
|
|
padding: EdgeInsets.symmetric(vertical: verticalPadding),
|
|
shape: RoundedRectangleBorder(
|
|
borderRadius: BorderRadius.circular(radius),
|
|
),
|
|
),
|
|
child: Row(
|
|
mainAxisSize: MainAxisSize.min,
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: [
|
|
if (icon != null) ...[
|
|
Icon(icon, size: 16, color: fg),
|
|
const SizedBox(width: 8),
|
|
],
|
|
text(label, 14, TextType.Bold, color: fg),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
/// The secondary action — outlined, never filled, so the hierarchy is never
|
|
/// ambiguous.
|
|
Widget outlinedActionButton(
|
|
String label,
|
|
VoidCallback onPressed, {
|
|
Color? foreground,
|
|
IconData? icon,
|
|
bool enabled = true,
|
|
double radius = 14,
|
|
}) {
|
|
final Color fg = enabled ? (foreground ?? colorPrimaryDark) : colorGrey;
|
|
|
|
return OutlinedButton(
|
|
onPressed: enabled ? onPressed : null,
|
|
style: OutlinedButton.styleFrom(
|
|
side: BorderSide(color: fg.withValues(alpha: 0.35), width: 1),
|
|
padding: const EdgeInsets.symmetric(vertical: 16),
|
|
shape: RoundedRectangleBorder(
|
|
borderRadius: BorderRadius.circular(radius),
|
|
),
|
|
),
|
|
child: Row(
|
|
mainAxisSize: MainAxisSize.min,
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: [
|
|
if (icon != null) ...[
|
|
Icon(icon, size: 16, color: fg),
|
|
const SizedBox(width: 8),
|
|
],
|
|
text(label, 14, TextType.Bold, color: fg),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget textButton(
|
|
String label,
|
|
VoidCallback onPressed, {
|
|
Color? color,
|
|
double textSize = 13,
|
|
TextType type = TextType.Regular,
|
|
}) {
|
|
return TextButton(
|
|
onPressed: onPressed,
|
|
child: text(label, textSize, type, color: color ?? colorGrey2),
|
|
);
|
|
}
|
|
|
|
Widget iconButton(
|
|
Widget icon,
|
|
VoidCallback onPressed, {
|
|
bool bordered = false,
|
|
Color? borderColor,
|
|
Color? background,
|
|
double radius = 10,
|
|
double size = 38,
|
|
}) {
|
|
return GestureDetector(
|
|
onTap: onPressed,
|
|
child: Container(
|
|
width: size,
|
|
height: size,
|
|
alignment: Alignment.center,
|
|
decoration: BoxDecoration(
|
|
color: background ?? Colors.transparent,
|
|
borderRadius: BorderRadius.circular(radius),
|
|
border: bordered
|
|
? Border.all(color: borderColor ?? colorBorder, width: 1)
|
|
: null,
|
|
),
|
|
child: icon,
|
|
),
|
|
);
|
|
}
|
|
|
|
/// The destructive action — abandoning, which costs the most debt of all and
|
|
/// so is always visually distinct from completing.
|
|
Widget destructiveButton(
|
|
String label,
|
|
VoidCallback onPressed, {
|
|
IconData? icon,
|
|
bool enabled = true,
|
|
}) {
|
|
return roundedCornerButton(
|
|
label,
|
|
onPressed,
|
|
background: colorDestructive,
|
|
foreground: colorWhite,
|
|
icon: icon,
|
|
enabled: enabled,
|
|
);
|
|
}
|
|
|
|
/// A segmented selector, used for class, energy, proof type and tone.
|
|
Widget segmentedSelector<T>({
|
|
required List<T> options,
|
|
required T selected,
|
|
required String Function(T) label,
|
|
required void Function(T) onSelected,
|
|
Color? activeColor,
|
|
}) {
|
|
final Color active = activeColor ?? colorPrimaryDark;
|
|
|
|
return Wrap(
|
|
spacing: 8,
|
|
runSpacing: 8,
|
|
children: options.map((option) {
|
|
final bool isSelected = option == selected;
|
|
return GestureDetector(
|
|
onTap: () => onSelected(option),
|
|
child: Container(
|
|
padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 10),
|
|
decoration: BoxDecoration(
|
|
color: isSelected ? active : colorWhite,
|
|
borderRadius: BorderRadius.circular(10),
|
|
border: Border.all(
|
|
color: isSelected ? active : colorBorder,
|
|
width: 1,
|
|
),
|
|
),
|
|
child: text(
|
|
label(option),
|
|
12,
|
|
isSelected ? TextType.Bold : TextType.Regular,
|
|
color: isSelected ? colorWhite : colorGrey2,
|
|
),
|
|
),
|
|
);
|
|
}).toList(),
|
|
);
|
|
}
|