fai/chain-studio
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(welcome): concept cards speak everyday language first
Some checks are pending
Security / Security check (push) Waiting to run
Details

Browse source 
The Hub/Module/Flow cards explained the basics in the very
vocabulary they were supposed to introduce (Rust binary, WASM,
YAML, hash-chained). Each card now leads with a plain-language
explanation; the technical wording moved behind a per-card
'for the technically curious' toggle. DE and EN.

Signed-off-by: flemming-it <stefan.a.flemming@googlemail.com>
This commit is contained in:
flemming-it 2026-07-17 23:24:46 +02:00
parent cc1618f512
commit 3e1ce6e1fd
6 changed files with 163 additions and 28 deletions
Download patch file Download diff file Expand all files Collapse all files

77
lib/pages/welcome.dart
View file

@ -310,17 +310,24 @@ class _PillarRow extends StatelessWidget {
@override
Widget build(BuildContext context) {
final l = AppLocalizations.of(context)!;
final pillars = <(IconData, String, String)>[
(Icons.hub_outlined, l.welcomePillarHubTitle, l.welcomePillarHubBody),
final pillars = <(IconData, String, String, String)>[
(
Icons.hub_outlined,
l.welcomePillarHubTitle,
l.welcomePillarHubBody,
l.welcomePillarHubTech,
),
(
Icons.extension_outlined,
l.welcomePillarModuleTitle,
l.welcomePillarModuleBody,
l.welcomePillarModuleTech,
),
(
Icons.account_tree_outlined,
l.welcomePillarFlowTitle,
l.welcomePillarFlowBody,
l.welcomePillarFlowTech,
),
];
return LayoutBuilder(
@ -333,7 +340,7 @@ class _PillarRow extends StatelessWidget {
return Column(
children: [
for (final p in pillars) ...[
_Pillar(icon: p.$1, title: p.$2, body: p.$3),
_Pillar(icon: p.$1, title: p.$2, body: p.$3, tech: p.$4),
const SizedBox(height: ChainSpace.md),
],
],
@ -356,6 +363,7 @@ class _PillarRow extends StatelessWidget {
icon: pillars[i].$1,
title: pillars[i].$2,
body: pillars[i].$3,
tech: pillars[i].$4,
),
),
],
@ -367,16 +375,34 @@ class _PillarRow extends StatelessWidget {
}
}
class _Pillar extends StatelessWidget {
/// Concept card in everyday language; the technical wording
/// (Rust, WASM, YAML, hash chain) lives behind a per-card
/// "for the technically curious" toggle so the first read
/// never requires developer vocabulary.
class _Pillar extends StatefulWidget {
final IconData icon;
final String title;
final String body;
final String tech;
const _Pillar({required this.icon, required this.title, required this.body});
const _Pillar({
required this.icon,
required this.title,
required this.body,
required this.tech,
});
@override
State<_Pillar> createState() => _PillarState();
}
class _PillarState extends State<_Pillar> {
bool _techOpen = false;
@override
Widget build(BuildContext context) {
final theme = Theme.of(context);
final l = AppLocalizations.of(context)!;
return Container(
padding: const EdgeInsets.all(ChainSpace.lg),
decoration: BoxDecoration(
@ -387,22 +413,57 @@ class _Pillar extends StatelessWidget {
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Icon(icon, size: 28, color: theme.colorScheme.primary),
Icon(widget.icon, size: 28, color: theme.colorScheme.primary),
const SizedBox(height: ChainSpace.md),
Text(
title,
widget.title,
style: theme.textTheme.titleLarge?.copyWith(
fontWeight: FontWeight.w700,
),
),
const SizedBox(height: ChainSpace.sm),
Text(
body,
widget.body,
style: theme.textTheme.bodyMedium?.copyWith(
color: theme.colorScheme.onSurfaceVariant,
height: 1.45,
),
),
const SizedBox(height: ChainSpace.sm),
InkWell(
onTap: () => setState(() => _techOpen = !_techOpen),
borderRadius: BorderRadius.circular(ChainRadius.sm),
child: Padding(
padding: const EdgeInsets.symmetric(vertical: 2),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Icon(
_techOpen ? Icons.expand_less : Icons.expand_more,
size: 16,
color: theme.colorScheme.primary,
),
const SizedBox(width: 4),
Text(
l.welcomePillarTechToggle,
style: theme.textTheme.labelMedium?.copyWith(
color: theme.colorScheme.primary,
),
),
],
),
),
),
if (_techOpen) ...[
const SizedBox(height: ChainSpace.xs),
Text(
widget.tech,
style: theme.textTheme.bodySmall?.copyWith(
color: theme.colorScheme.onSurfaceVariant,
height: 1.45,
),
),
],
],
),
);