Skip to content
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

feat: improve Fortaleza Theme Customization #547

Merged
merged 1 commit into from
Dec 26, 2024
+83 −66
Merged

feat: improve Fortaleza Theme Customization #547

Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
149 changes: 83 additions & 66 deletions packages/remix/lib/src/themes/fortaleza/components/button_theme.dart
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
import 'package:flutter/widgets.dart';
import 'package:mix/mix.dart';

import '../../../components/button/button.dart';
@@ -9,17 +10,87 @@ class FortalezaButtonStyle extends ButtonStyle {
static const surface = Variant('for.button.surface');
static const ghost = Variant('for.button.ghost');

const FortalezaButtonStyle();
final Color? color;
final TextStyle? textStyle;
final EdgeInsets? padding;
final double? radius;

static List<Variant> get variants => [soft, outline, surface, ghost];

const FortalezaButtonStyle({
this.color,
this.textStyle,
this.padding,
this.radius,
});

@override
Style makeStyle(SpecConfiguration<ButtonSpecUtility> spec) {
final $ = spec.utilities;

final baseStyle = super.makeStyle(spec);
Style setColor() {
final color = this.color ?? spec.context.$color.accent();

final disabled = Style(
$.container.color.$neutral(4),
);

final borderedDisabled = Style(
disabled(),
$.container.border.color.$neutral(7),
);

return Style.create([
$.container.color(color),
spec.on.hover(
$.container.color(color.withOpacity(0.8)),
),
soft(
$.container.color(color.withOpacity(0.1)),
$.label.style.color(color),
spec.on.hover(
$.container.color(color.withOpacity(0.2)),
),
spec.on.disabled(
disabled(),
),
),
outline(
$.container.color.transparent(),
$.container.border.color(color),
$.label.style.color(color),
spec.on.hover(
$.label.style.color.withOpacity(0.8),
$.container.color.transparent(),
),
spec.on.disabled(
borderedDisabled(),
),
),
surface(
$.container.color(color.withOpacity(0.1)),
$.container.border.color(color.withOpacity(0.7)),
$.label.style.color(color),
spec.on.hover(
$.container.color(color.withOpacity(0.2)),
$.container.border.color.withOpacity(0.8),
),
spec.on.disabled(
borderedDisabled(),
),
),
ghost(
$.container.color.transparent(),
$.label.style.color(color),
spec.on.hover(
$.container.color.withOpacity(0.1),
),
),
]);
}

final baseOverrides = Style(
baseStyle(),
super.makeStyle(spec).call(),
$.container.chain
..padding.vertical.$space2()
..padding.horizontal.$space3()
@@ -30,78 +101,24 @@ class FortalezaButtonStyle extends ButtonStyle {
);

final onDisabledForeground = $on.disabled(
$.container.color.$neutral(7),
$.container.color.$neutralAlpha(4),
$.label.style.color.$neutral(8),
$.icon.color.$neutral(8),
$.spinner.color.$neutral(7),
);

final spinnerDisabled = $.spinner.color.$neutralAlpha(7);

final solidVariant = Style(
$.container.color.$accent(),
$.label.style.color.white(),
$.spinner.color.white(),
$.icon.color.white(),
spec.on.hover($.container.color.$accent(10)),
spec.on.disabled($.container.color.$neutralAlpha(3), spinnerDisabled),
$.spinner.color.$neutral(8),
);

final softVariant = Style(
$.container.color.$accentAlpha(3),
$.label.style.color.$accentAlpha(11),
$.spinner.color.$accentAlpha(11),
$.icon.color.$accentAlpha(11),
spec.on.hover($.container.color.$accentAlpha(4)),
spec.on.disabled($.container.color.$neutralAlpha(3)),
);

final outlineVariant = Style(
$.container.chain
..color.transparent()
..border.width(1)
..border.strokeAlign(0)
..border.color.$accentAlpha(8),
$.spinner.color.$accentAlpha(11),
$.icon.color.$accentAlpha(11),
$.label.style.color.$accentAlpha(11),
spec.on.hover($.container.color.$accentAlpha(2)),
spec.on.disabled(
$.container.chain
..border.color.$neutralAlpha(8)
..color.transparent(),
),
);

final surfaceVariant = Style(
outlineVariant(),
$.container.color.$accentAlpha(3),
spec.on.hover(
$.container.color.$accentAlpha(4),
$.container.border.color.$accentAlpha(8),
),
spec.on.disabled($.container.color.$neutral(1)),
);

final ghostVariant = Style(
$.container.border.style.none(),
$.container.color.transparent(),
$.spinner.color.$accentAlpha(11),
$.icon.color.$accentAlpha(11),
$.label.style.color.$accentAlpha(11),
spec.on.hover($.container.color.$accentAlpha(3)),
spec.on.disabled($.container.color.transparent()),
);
final overrides = Style.create([
if (textStyle != null) $.label.style.as(textStyle!),
if (padding != null) $.container.padding.as(padding!),
if (radius != null) $.container.borderRadius(radius!),
]);

return Style.create(
[
baseOverrides(),
setColor().call(),
onDisabledForeground,
solidVariant(),
soft(softVariant()),
outline(outlineVariant()),
surface(surfaceVariant()),
ghost(ghostVariant()),
overrides(),
],
).animate(duration: const Duration(milliseconds: 200));
}

Unchanged files with check annotations Beta

View file
packages/mix/test/src/specs/text/text_spec_test.dart
expect(textSpec.overflow, TextOverflow.ellipsis);
expect(textSpec.textAlign, TextAlign.center);
expect(textSpec.textScaleFactor, 1.5);

Check notice on line 333 in packages/mix/test/src/specs/text/text_spec_test.dart

GitHub Actions / Test Min SDK

'textScaleFactor' is deprecated and shouldn't be used. Use textScaler instead. 

Try replacing the use of the deprecated member with the replacement.
See https://dart.dev/diagnostics/deprecated_member_use_from_same_package to learn more about this problem.
expect(textSpec.maxLines, 3);
expect(textSpec.style?.color, Colors.blue);
expect(textSpec.textWidthBasis, TextWidthBasis.longestLine);
View file
packages/mix_generator/lib/src/helpers/helpers.dart
try {
return _formatter.format(contents);
} catch (e) {
print('Generating: $contents');

Check notice on line 109 in packages/mix_generator/lib/src/helpers/helpers.dart

GitHub Actions / Test Min SDK

Don't invoke 'print' in production code. 

Try using a logging framework.
See https://dart.dev/lints/avoid_print to learn more about this problem.
rethrow;
}
}
View file
packages/mix_generator/lib/src/mixable_class_utility_generator.dart
@override
Future<String> generateForAnnotatedElement(
Element element,
ConstantReader reader,

Check notice on line 56 in packages/mix_generator/lib/src/mixable_class_utility_generator.dart

GitHub Actions / Test Min SDK

The parameter name 'reader' doesn't match the name 'annotation' in the overridden method. 

Try changing the name to 'annotation'.
See https://dart.dev/lints/avoid_renaming_method_parameters to learn more about this problem.
BuildStep buildStep,
) async {
if (element is! ClassElement) {
View file
packages/mix_generator/lib/src/mixable_dto_generator.dart
@override
Future<String> generateForAnnotatedElement(
Element element,
ConstantReader reader,

Check notice on line 61 in packages/mix_generator/lib/src/mixable_dto_generator.dart

GitHub Actions / Test Min SDK

The parameter name 'reader' doesn't match the name 'annotation' in the overridden method. 

Try changing the name to 'annotation'.
See https://dart.dev/lints/avoid_renaming_method_parameters to learn more about this problem.
BuildStep buildStep,
) async {
final context = _loadContext(element);
View file
packages/mix_generator/lib/src/mixable_enum_utility_generator.dart
@override
Future<String> generateForAnnotatedElement(
Element element,
ConstantReader reader,

Check notice on line 48 in packages/mix_generator/lib/src/mixable_enum_utility_generator.dart

GitHub Actions / Test Min SDK

The parameter name 'reader' doesn't match the name 'annotation' in the overridden method. 

Try changing the name to 'annotation'.
See https://dart.dev/lints/avoid_renaming_method_parameters to learn more about this problem.
BuildStep buildStep,
) async {
if (element is! ClassElement) {
View file
packages/mix_generator/lib/src/mixable_spec_generator.dart
@override
Future<String> generateForAnnotatedElement(
Element element,
ConstantReader reader,

Check notice on line 36 in packages/mix_generator/lib/src/mixable_spec_generator.dart

GitHub Actions / Test Min SDK

The parameter name 'reader' doesn't match the name 'annotation' in the overridden method. 

Try changing the name to 'annotation'.
See https://dart.dev/lints/avoid_renaming_method_parameters to learn more about this problem.
BuildStep buildStep,
) async {
final context = _loadContext(element);
View file
packages/mix_lint/lib/src/assists/extract_attributes.dart
AstNode? ancestorNode;
ancestorNode = node.thisOrAncestorMatching<Block>((node) {
print('node ${node.runtimeType}');

Check notice on line 19 in packages/mix_lint/lib/src/assists/extract_attributes.dart

GitHub Actions / Test Min SDK

Don't invoke 'print' in production code. 

Try using a logging framework.
See https://dart.dev/lints/avoid_print to learn more about this problem.
return node is Block;
});
ancestorNode =
node.thisOrAncestorMatching<TopLevelVariableDeclaration>((node) {
print(node);

Check notice on line 58 in packages/mix_lint/lib/src/assists/extract_attributes.dart

GitHub Actions / Test Min SDK

Don't invoke 'print' in production code. 

Try using a logging framework.
See https://dart.dev/lints/avoid_print to learn more about this problem.
return node is TopLevelVariableDeclaration;
});
try {
extractor.applyRefactor(unit.content);
} catch (e) {}

Check notice on line 136 in packages/mix_lint/lib/src/assists/extract_attributes.dart

GitHub Actions / Test Min SDK

Empty catch block. 

Try adding statements to the block, adding a comment to the block, or removing the 'catch' clause.
See https://dart.dev/lints/empty_catches to learn more about this problem.
});
});
}
View file
examples/todo_list/lib/pages/todo_list_page.dart
() {
if (mounted) {
Navigator.push(
context,

Check notice on line 72 in examples/todo_list/lib/pages/todo_list_page.dart

GitHub Actions / Test

Don't use 'BuildContext's across async gaps. 

Try rewriting the code to not use the 'BuildContext', or guard the use with a 'mounted' check.
See https://dart.dev/diagnostics/use_build_context_synchronously to learn more about this problem.
MaterialPageRoute(
builder: (context) => AddTaskPage(
controller: _controller,
View file
packages/mix/lib/src/attributes/color/color_directives_impl.dart
const OpacityColorDirective(super.value);
@override
Color modify(Color color) => color.withOpacity(value);

Check notice on line 22 in packages/mix/lib/src/attributes/color/color_directives_impl.dart

GitHub Actions / Test

'withOpacity' is deprecated and shouldn't be used. Use .withValues() to avoid precision loss. 

Try replacing the use of the deprecated member with the replacement.
See https://dart.dev/diagnostics/deprecated_member_use to learn more about this problem.
}
@immutable
final p = RangeError.checkValueInInterval(amount, 0, 100, 'amount') / 100;
return Color.fromARGB(
((toColor.alpha - alpha) * p + alpha).round(),

Check notice on line 133 in packages/mix/lib/src/attributes/color/color_directives_impl.dart

GitHub Actions / Test

'alpha' is deprecated and shouldn't be used. Use .a. 

Try replacing the use of the deprecated member with the replacement.
See https://dart.dev/diagnostics/deprecated_member_use to learn more about this problem.

Check notice on line 133 in packages/mix/lib/src/attributes/color/color_directives_impl.dart

GitHub Actions / Test

'alpha' is deprecated and shouldn't be used. Use .a. 

Try replacing the use of the deprecated member with the replacement.
See https://dart.dev/diagnostics/deprecated_member_use to learn more about this problem.

Check notice on line 133 in packages/mix/lib/src/attributes/color/color_directives_impl.dart

GitHub Actions / Test

'alpha' is deprecated and shouldn't be used. Use .a. 

Try replacing the use of the deprecated member with the replacement.
See https://dart.dev/diagnostics/deprecated_member_use to learn more about this problem.
((toColor.red - red) * p + red).round(),

Check notice on line 134 in packages/mix/lib/src/attributes/color/color_directives_impl.dart

GitHub Actions / Test

'red' is deprecated and shouldn't be used. Use .r. 

Try replacing the use of the deprecated member with the replacement.
See https://dart.dev/diagnostics/deprecated_member_use to learn more about this problem.

Check notice on line 134 in packages/mix/lib/src/attributes/color/color_directives_impl.dart

GitHub Actions / Test

'red' is deprecated and shouldn't be used. Use .r. 

Try replacing the use of the deprecated member with the replacement.
See https://dart.dev/diagnostics/deprecated_member_use to learn more about this problem.

Check notice on line 134 in packages/mix/lib/src/attributes/color/color_directives_impl.dart

GitHub Actions / Test

'red' is deprecated and shouldn't be used. Use .r. 

Try replacing the use of the deprecated member with the replacement.
See https://dart.dev/diagnostics/deprecated_member_use to learn more about this problem.
((toColor.green - green) * p + green).round(),

Check notice on line 135 in packages/mix/lib/src/attributes/color/color_directives_impl.dart

GitHub Actions / Test

'green' is deprecated and shouldn't be used. Use .g. 

Try replacing the use of the deprecated member with the replacement.
See https://dart.dev/diagnostics/deprecated_member_use to learn more about this problem.

Check notice on line 135 in packages/mix/lib/src/attributes/color/color_directives_impl.dart

GitHub Actions / Test

'green' is deprecated and shouldn't be used. Use .g. 

Try replacing the use of the deprecated member with the replacement.
See https://dart.dev/diagnostics/deprecated_member_use to learn more about this problem.
((toColor.blue - blue) * p + blue).round(),
);
}