Alpha/GroundedHelper
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Redesign the UI after the fitness reference and replace the logo

Browse Source 
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
This commit is contained in:
alvocool
2026-11-02 12:33:13 +03:00
parent b31bc47cc0
commit fe268cb8aa
100 changed files with 3394 additions and 1387 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
frontend/lib/Grounded/see/goal/GoalDetailState.dart
View File

@@ -16,6 +16,7 @@ import '../../designs/Component.dart';
import '../../designs/Responsive.dart';
import '../../designs/Shell.dart';
import '../../designs/buttons/Buttons.dart';
import '../../designs/scene/SceneArt.dart';
import '../../designs/text/Text.dart';
import '../../utils/Colors.dart';
import '../../utils/CommonUtils.dart';
@@ -181,6 +182,8 @@ class GoalDetailState extends State<GoalDetail>
title: _goal.title,
onBack: _onBack,
chrome: _goal.colourHex.isEmpty ? null : goalColor(_goal.colourHex),
scene: goalScene(goalColor(_goal.colourHex)),
sceneSeed: sceneSeed(_goal.title),
action: chromeAction(CupertinoIcons.pencil, _onEditGoal),
banner: _progressBanner(),
child: Column(
@@ -398,15 +401,19 @@ class GoalDetailState extends State<GoalDetail>
onTap: () => _onEditRoutine(routine),
child: Row(
children: [
Container(
width: 48,
height: 48,
alignment: Alignment.center,
decoration: BoxDecoration(
color: kindBackground(routine.kind),
borderRadius: BorderRadius.circular(13),
SizedBox(
width: 58,
height: 58,
child: ClipRRect(
borderRadius: BorderRadius.circular(16),
child: SceneArt(
palette: scenePalette(routine.kind),
seed: sceneSeed(routine.title),
figure: kindIcon(routine.kind),
figureScale: 0.46,
figureAlignment: const Alignment(0, 0.1),
),
),
child: Icon(kindIcon(routine.kind), size: 21, color: tone),
),
const SizedBox(width: 12),
Expanded(

206
frontend/lib/Grounded/see/goal/GoalsState.dart
View File

@@ -5,9 +5,11 @@ import '../../about/external/data/Goal.dart';
import '../../about/internal/application/TextType.dart';
import '../../configs/Navigator.dart';
import '../../designs/Component.dart';
import '../../designs/GlassSurface.dart';
import '../../designs/Responsive.dart';
import '../../designs/Shell.dart';
import '../../designs/buttons/Buttons.dart';
import '../../designs/scene/SceneArt.dart';
import '../../designs/text/Text.dart';
import '../../utils/Colors.dart';
import '../../utils/CommonUtils.dart';
@@ -104,112 +106,136 @@ class GoalsState extends State<Goals> implements ConnectGoals {
);
}
/// The goal as a painted card in its own colour: the ambition up top, the
/// progress and the cost along the bottom.
Widget _goalCard(Goal goal) {
final Color accent =
goal.slipping ? colorStandingGrounded : goalColor(goal.colourHex);
final Color accent = goalColor(goal.colourHex);
final Color soft = colorWhite.withValues(alpha: 0.78);
final bool overdue = goal.targetDate != null &&
goal.targetDate!.isBefore(DateTime.now());
return Container(
margin: const EdgeInsets.only(bottom: 12),
child: card(
onTap: () => _onOpenGoal(goal),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: [
Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: [
Row(
children: [
Container(
width: 8,
height: 8,
decoration: BoxDecoration(
color: goalColor(goal.colourHex),
shape: BoxShape.circle,
),
),
const SizedBox(width: 8),
text(
return GestureDetector(
onTap: () => _onOpenGoal(goal),
child: Container(
height: 214,
margin: const EdgeInsets.only(bottom: 14),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(26),
boxShadow: const [
BoxShadow(
color: Color(0x262A3A30),
blurRadius: 24,
offset: Offset(0, 10),
),
],
),
child: ClipRRect(
borderRadius: BorderRadius.circular(26),
child: Stack(
fit: StackFit.expand,
children: [
SceneArt(
palette: goalScene(accent),
seed: sceneSeed(goal.title),
figure: CupertinoIcons.flag_fill,
figureScale: 0.4,
figureAlignment: const Alignment(0.75, -0.35),
shade: true,
),
Padding(
padding: const EdgeInsets.all(14),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
GlassSurface(
onDark: true,
radius: BorderRadius.circular(99),
padding: const EdgeInsets.symmetric(
horizontal: 10, vertical: 5),
child: text(
[
if (goal.category.isNotEmpty) goal.category,
goal.targetDate == null
? "No deadline"
: targetLabel(goal.targetDate),
].join(" · ").toUpperCase(),
9,
TextType.Bold,
color: goal.targetDate != null &&
goal.targetDate!.isBefore(DateTime.now())
? colorStandingGrounded
: colorGrey2,
letterSpacing: 1.0,
].join(" · "),
10,
TextType.Medium,
color: overdue ? colorTinted : colorWhite,
),
],
),
const SizedBox(height: 8),
text(goal.title, 19, TextType.Light,
color: colorPrimaryDark,
maxLines: 2,
overflow: TextOverflow.ellipsis),
if (goal.description.isNotEmpty) ...[
const SizedBox(height: 6),
text(goal.description, 12, TextType.Regular,
color: colorGrey2,
maxLines: 2,
overflow: TextOverflow.ellipsis),
),
const Spacer(),
if (goal.overdueTasks > 0)
pill("${goal.overdueTasks} late", colorWhite,
colorStandingGrounded,
textSize: 9),
],
),
const Spacer(),
text(goal.title, 21, TextType.Medium,
color: colorWhite,
maxLines: 1,
overflow: TextOverflow.ellipsis),
if (goal.description.isNotEmpty) ...[
const SizedBox(height: 3),
text(goal.description, 12, TextType.Regular,
color: soft,
maxLines: 1,
overflow: TextOverflow.ellipsis),
],
),
const SizedBox(height: 12),
meter(goal.progress,
fill: colorLime,
track: colorWhite.withValues(alpha: 0.25),
height: 5),
const SizedBox(height: 10),
Row(
children: [
Expanded(
child: _cardStat(
"${goal.completedTasks}/${goal.totalTasks}",
"Done",
soft),
),
Expanded(
child: _cardStat(
"${goal.remainingTasks}", "Remaining", soft),
),
Expanded(
child: _cardStat(
formatDebt(goal.debtContribution), "Debt", soft,
alert: goal.debtContribution > 0),
),
],
),
],
),
const SizedBox(width: 10),
if (goal.overdueTasks > 0)
pill("${goal.overdueTasks} late", colorStandingGrounded,
colorStandingGroundedBg, textSize: 9),
],
),
const SizedBox(height: 18),
meter(goal.progress, fill: accent),
const SizedBox(height: 12),
Row(
children: [
Expanded(
child: labelled(
"Done",
"${goal.completedTasks} of ${goal.totalTasks}",
valueSize: 13,
),
),
Expanded(
child: labelled(
"Remaining",
"${goal.remainingTasks}",
valueSize: 13,
),
),
Expanded(
child: labelled(
"Debt",
formatDebt(goal.debtContribution),
valueSize: 13,
valueColor: goal.debtContribution > 0
? colorStandingGrounded
: colorPrimaryDark,
),
),
],
),
],
),
],
),
),
),
);
}
Widget _cardStat(String value, String caption, Color tone,
{bool alert = false}) {
return Row(
crossAxisAlignment: CrossAxisAlignment.end,
children: [
text(value, 18, TextType.Light,
color: alert ? colorTinted : colorWhite),
const SizedBox(width: 5),
Padding(
padding: const EdgeInsets.only(bottom: 2),
child: text(caption, 10, TextType.Regular, color: tone),
),
],
);
}
@override
void onGoalsLoaded(List<Goal> goals) {
setState(() {

4
frontend/lib/Grounded/see/home/ConnectHome.dart
View File

@@ -1,5 +1,6 @@
import '../../about/external/data/Commitment.dart';
import '../../about/external/data/ExcuseCluster.dart';
import '../../about/external/data/RoutineChain.dart';
import '../../about/internal/application/Standing.dart';
import '../../about/internal/application/UserDetails.dart';
@@ -10,6 +11,9 @@ abstract class ConnectHome {
void onOverdueLoaded(List<Commitment> overdue);
/// The routine library, for the up-next rail.
void onRoutinesLoaded(List<RoutineChain> routines);
/// Standing arrives derived, with the debt it was derived from.
void onStandingResolved(Standing standing, double debtScore);

1137
frontend/lib/Grounded/see/home/HomeState.dart
View File

File diff suppressed because it is too large Load Diff

21
frontend/lib/Grounded/see/home/ViewHome.dart
View File

@@ -1,5 +1,6 @@
import '../../about/external/data/Commitment.dart';
import '../../about/external/data/ExcuseCluster.dart';
import '../../about/external/data/RoutineChain.dart';
import '../../about/external/data/pages/request/CommitmentsRequest.dart';
import '../../about/external/data/pages/request/HistoryRequest.dart';
import '../../about/external/data/pages/request/PageAndSort.dart';
@@ -13,6 +14,7 @@ import '../../about/internal/application/Standing.dart';
import '../../about/internal/application/UserDetails.dart';
import '../../utils/DebtEngine.dart';
import '../../utils/GuardrailEngine.dart';
import '../../utils/ObjectConvertors.dart';
import '../../utils/StandingEngine.dart';
import '../../utils/ToneEngine.dart';
import '../parent/ParentViewModel.dart';
@@ -52,11 +54,30 @@ class ViewHome extends ParentViewModel {
connection.onPlanLoaded(page.content);
loadOverdue();
loadRoutines();
} catch (e) {
handleError(e, () => loadPlan(), () => dismissError(), "Retry");
}
}
/// The routines feed the home rail. Quiet on failure — the plan is the
/// screen; the rail is a shortcut.
void loadRoutines() async {
try {
final response = await getDataManager().getMyRoutines(HistoryRequest(
query: PageAndSort(
sort: Sort('asc', 'startMinute'),
page: Pageable(0, 0, 50, 0),
),
));
connection.onRoutinesLoaded(getRoutineChainList(response.data));
} catch (e) {
connection.onRoutinesLoaded(<RoutineChain>[]);
}
}
void loadOverdue() async {
try {
final response = await getDataManager().getOverdueQueue(HistoryRequest(

906
frontend/lib/Grounded/see/routine/RoutineRunnerState.dart
View File

File diff suppressed because it is too large Load Diff

6
frontend/lib/Grounded/see/routine/Routines.dart
View File

@@ -1,9 +1,13 @@
import 'package:flutter/material.dart';
import '../../about/internal/application/RoutineKind.dart';
import 'RoutinesState.dart';
class Routines extends StatefulWidget {
const Routines({super.key});
/// Opens pre-filtered to one kind; null shows the whole library.
final RoutineKind? kind;
const Routines({super.key, this.kind});
@override
State<Routines> createState() => RoutinesState();

828
frontend/lib/Grounded/see/routine/RoutinesState.dart
View File

File diff suppressed because it is too large Load Diff

238
frontend/lib/Grounded/see/splash/SplashState.dart
View File

@@ -1,16 +1,20 @@
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:flutter_animate/flutter_animate.dart';
import 'package:stacked/stacked.dart';
import '../../about/internal/application/MeDescription.dart';
import '../../about/internal/application/NavigatorType.dart';
import '../../about/internal/application/TextType.dart';
import '../../configs/Navigator.dart';
import '../../designs/AmbientBackground.dart';
import '../../designs/GlassSurface.dart';
import '../../designs/GroundedMark.dart';
import '../../designs/Responsive.dart';
import '../../designs/scene/SceneArt.dart';
import '../../designs/text/Text.dart';
import '../../utils/Colors.dart';
import '../../utils/Images.dart';
import '../home/Home.dart';
import '../login/Login.dart';
import 'ConnectSplash.dart';
@@ -31,7 +35,7 @@ class SplashState extends State<Splash> implements ConnectSplash {
builder: (context, viewModel, child) => PopScope(
canPop: false,
child: Scaffold(
backgroundColor: colorPrimaryDark,
backgroundColor: colorAmbientMid,
body: LayoutBuilder(
builder: (BuildContext context, BoxConstraints constraints) {
return Responsive(
@@ -47,69 +51,193 @@ class SplashState extends State<Splash> implements ConnectSplash {
}
Future<void> _initiate() async {
// A beat on the wordmark, then the session decides where we land.
await Future.delayed(const Duration(milliseconds: 900));
// Long enough for the mark to land and take one breath, then the session
// decides where we land.
await Future.delayed(const Duration(milliseconds: 2200));
_model?.initialize();
}
Widget _mobileView(BoxConstraints constraints) {
return SafeArea(
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 28, vertical: 36),
child: Column(
mainAxisSize: MainAxisSize.max,
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
text("GROUNDED", 10, TextType.Bold,
color: colorWhite.withValues(alpha: 0.45), letterSpacing: 2.0),
Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// The same mark the native splash shows, so the handover from
// the OS screen into the app is invisible.
Image.asset(
splashMark,
width: 108,
height: 108,
errorBuilder: (context, error, stackTrace) =>
const SizedBox(height: 108),
),
const SizedBox(height: 28),
text("Grounded", 52, TextType.Light,
color: colorWhite, height: 1.05),
const SizedBox(height: 16),
Container(
width: 44,
height: 2,
color: colorWhite.withValues(alpha: 0.30),
),
const SizedBox(height: 20),
text(
"A to-do app that does not believe you.",
15,
TextType.Regular,
color: colorWhite.withValues(alpha: 0.60),
height: 1.5,
),
],
),
SizedBox(
width: 22,
height: 22,
child: CircularProgressIndicator(
strokeWidth: 2,
backgroundColor: colorWhite.withValues(alpha: 0.12),
color: colorWhite.withValues(alpha: 0.70),
return AmbientBackground(
child: Stack(
children: [
// The landscape rising from the bottom edge — the same painted world
// the routine cards live in.
Positioned(
left: 0,
right: 0,
bottom: 0,
height: constraints.maxHeight * 0.34,
child: ShaderMask(
shaderCallback: (Rect bounds) => const LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: <Color>[Color(0x00000000), Color(0xFF000000)],
stops: <double>[0.0, 0.45],
).createShader(bounds),
blendMode: BlendMode.dstIn,
child: const SceneArt(palette: sceneWorkout, seed: 11),
)
.animate()
.fadeIn(duration: 1200.ms, curve: Curves.easeOut)
.slideY(begin: 0.25, end: 0, duration: 1400.ms,
curve: Curves.easeOutCubic),
),
SafeArea(
child: Padding(
padding: const EdgeInsets.fromLTRB(28, 18, 28, 32),
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
text("Grounded", 17, TextType.Regular, color: colorInk),
text("Daily discipline", 17, TextType.Regular,
color: colorInkSoft),
],
).animate().fadeIn(duration: 600.ms, delay: 200.ms),
const Spacer(flex: 3),
Center(child: _mark()),
const SizedBox(height: 40),
_wordmark(),
const Spacer(flex: 4),
_loader(),
],
),
),
],
),
),
],
),
);
}
/// The mark on glass, inside rings that breathe outward.
Widget _mark() {
return SizedBox(
width: 230,
height: 230,
child: Stack(
alignment: Alignment.center,
children: [
for (int ring = 0; ring < 3; ring++)
Container(
width: 120,
height: 120,
decoration: BoxDecoration(
shape: BoxShape.circle,
border: Border.all(
color: colorWhite.withValues(alpha: 0.9), width: 1.4),
),
)
.animate(onPlay: (controller) => controller.repeat())
.scale(
begin: const Offset(1, 1),
end: const Offset(1.9, 1.9),
duration: 2400.ms,
delay: (ring * 800).ms,
curve: Curves.easeOutCubic,
)
.fadeOut(duration: 2400.ms, delay: (ring * 800).ms),
GlassSurface(
radius: BorderRadius.circular(44),
padding: const EdgeInsets.all(10),
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(32),
boxShadow: <BoxShadow>[
BoxShadow(
color: colorPrimary.withValues(alpha: 0.35),
blurRadius: 40,
offset: const Offset(0, 16),
),
],
),
// The sun rises out of the ground line, then the arcs light.
child: TweenAnimationBuilder<double>(
tween: Tween<double>(begin: 0, end: 1),
duration: const Duration(milliseconds: 1700),
builder: (context, t, child) => GroundedMark(
size: 132,
rise: Curves.easeOutCubic
.transform((t / 0.6).clamp(0.0, 1.0)),
arcs: Curves.easeOut
.transform(((t - 0.45) / 0.55).clamp(0.0, 1.0)),
),
),
),
)
.animate()
.scale(
begin: const Offset(0.6, 0.6),
end: const Offset(1, 1),
duration: 900.ms,
curve: Curves.easeOutBack,
)
.fadeIn(duration: 500.ms),
],
),
);
}
/// Two-tone, like the greeting on the home screen.
Widget _wordmark() {
return Column(
children: [
text("Grounded", 46, TextType.Medium,
color: colorInk, align: TextAlign.center, letterSpacing: -1.2)
.animate()
.fadeIn(duration: 700.ms, delay: 350.ms)
.slideY(begin: 0.3, end: 0, duration: 700.ms, delay: 350.ms,
curve: Curves.easeOutCubic),
const SizedBox(height: 10),
text("A to-do app that\ndoesn't believe you.", 22, TextType.Light,
color: colorInkSoft, align: TextAlign.center, height: 1.3)
.animate()
.fadeIn(duration: 700.ms, delay: 650.ms)
.slideY(begin: 0.3, end: 0, duration: 700.ms, delay: 650.ms,
curve: Curves.easeOutCubic),
],
);
}
/// A glass capsule that fills while the session resolves.
Widget _loader() {
return Column(
children: [
GlassSurface(
radius: BorderRadius.circular(99),
padding: const EdgeInsets.all(3),
child: SizedBox(
width: 140,
height: 6,
child: Align(
alignment: Alignment.centerLeft,
child: Container(
width: 140,
decoration: BoxDecoration(
color: colorNight,
borderRadius: BorderRadius.circular(99),
),
)
.animate()
.scaleX(
begin: 0.04,
end: 1,
alignment: Alignment.centerLeft,
duration: 2000.ms,
curve: Curves.easeInOutCubic,
),
),
),
),
const SizedBox(height: 12),
text("Checking what you promised", 12, TextType.Regular,
color: colorWhite.withValues(alpha: 0.9)),
],
).animate().fadeIn(duration: 500.ms, delay: 900.ms);
}
@override
void launchHome(MeDescription value) {
GroundedNavigation()