Skip to content

feat(ui): improve color config #131

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
renefloor wants to merge 8 commits into
base: main
Choose a base branch
from
Open

feat(ui): improve color config #131

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
78c8411
add easy way to theme colors
renefloor Jul 15, 2026
f0edd41
Automatic chrome color generation
renefloor Jul 16, 2026
9be24e7
update changelog
renefloor Jul 17, 2026
aec4ef4
Add tests for various seeds
renefloor Jul 17, 2026
4232a03
chore: Update Goldens
renefloor Jul 17, 2026
c999895
simplify stream theme construction
renefloor Jul 17, 2026
75a581e
fix fromColor map with saturation
renefloor Jul 17, 2026
9467acd
switch contex.read to context.watch
renefloor Jul 17, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
262 changes: 181 additions & 81 deletions apps/design_system_gallery/lib/config/theme_configuration.dart
View file
Open in desktop

Large diffs are not rendered by default.

49 changes: 43 additions & 6 deletions apps/design_system_gallery/lib/widgets/theme_studio/color_picker_tile.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,12 +9,25 @@ class ColorPickerTile extends StatelessWidget {
required this.label,
required this.color,
required this.onColorChanged,
this.isDefault = false,
this.onReset,
});

final String label;
final Color color;
final ValueChanged<Color> onColorChanged;

/// Whether [color] is still the SDK default (i.e. not overridden).
///
/// When true, a "default" subtitle is shown below [label] and no reset
/// control is displayed.
final bool isDefault;

/// Reverts this color back to its SDK default.
///
/// Ignored (no reset control shown) when [isDefault] is true.
final VoidCallback? onReset;

@override
Widget build(BuildContext context) {
final colorScheme = context.streamColorScheme;
Expand Down Expand Up @@ -59,12 +72,25 @@ class ColorPickerTile extends StatelessWidget {
),
SizedBox(width: spacing.sm + spacing.xxs),
Expanded(
child: Text(
label,
style: textTheme.metadataDefault.copyWith(
color: colorScheme.textPrimary,
fontFamily: 'monospace',
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: [
Text(
label,
style: textTheme.metadataDefault.copyWith(
color: colorScheme.textPrimary,
fontFamily: 'monospace',
),
),
if (isDefault)
Text(
'default',
style: textTheme.metadataDefault.copyWith(
color: colorScheme.textTertiary,
),
),
],
),
),
Text(
Expand All @@ -74,6 +100,17 @@ class ColorPickerTile extends StatelessWidget {
fontFamily: 'monospace',
),
),
if (!isDefault && onReset != null) ...[
SizedBox(width: spacing.xs + spacing.xxs),
Tooltip(
message: 'Reset to default',
child: InkWell(
onTap: onReset,
borderRadius: BorderRadius.all(radius.xs),
child: Icon(Icons.restart_alt, color: colorScheme.textSecondary, size: 14),
),
),
],
SizedBox(width: spacing.xs + spacing.xxs),
Icon(Icons.edit, color: colorScheme.textSecondary, size: 12),
],
Expand Down
Loading
Loading