Light sage-to-cream ambient backdrop, frosted glass controls and painted SceneArt landscapes in place of photography. Home becomes a dashboard with a two-tone greeting, a frosted summary ring, category portraits, an up-next rail of image-led cards and a floating glass tab bar. The routine library gets an image header and painted cards; the player gets a scene stage, steps on an arc, a dotted clock and a night pill with a lime spark. Goals become painted cards in their own colour. New logo: a lime sun resting on a ground line under two arcs. The splash raises the sun and lights the arcs; launcher icons and native splash are regenerated to match. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01KhQh614DMeYoQEH9SoMRUw
181 lines
4.8 KiB
Dart
181 lines
4.8 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 = 99,
|
|
double verticalPadding = 16,
|
|
}) {
|
|
final Color bg = enabled ? (background ?? colorNight) : 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) ...[
|
|
// The default night pill carries the lime spark on its icon.
|
|
Icon(icon,
|
|
size: 16,
|
|
color: background == null && foreground == null ? colorLime : fg),
|
|
const SizedBox(width: 8),
|
|
],
|
|
text(label, 14, TextType.Medium, 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 = 99,
|
|
}) {
|
|
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(),
|
|
);
|
|
}
|