diff --git a/lib/widgets/emoji_reaction.dart b/lib/widgets/emoji_reaction.dart index 98147a54d7..3d69e3d0d1 100644 --- a/lib/widgets/emoji_reaction.dart +++ b/lib/widgets/emoji_reaction.dart @@ -16,38 +16,36 @@ import 'theme.dart'; /// Emoji-reaction styles that differ between light and dark themes. class EmojiReactionTheme extends ThemeExtension { - EmojiReactionTheme.light() : - this._( - bgSelected: Colors.white, - - // TODO shadow effect, following web, which uses `box-shadow: inset`: - // https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow#inset - // Needs Flutter support for something like that: - // https://github.com/flutter/flutter/issues/18636 - // https://github.com/flutter/flutter/issues/52999 - // Until then use a solid color; a much-lightened version of the shadow color. - // Also adapt by making [borderUnselected] more transparent, so we'll - // want to check that against web when implementing the shadow. - bgUnselected: const HSLColor.fromAHSL(0.08, 210, 0.50, 0.875).toColor(), - - borderSelected: Colors.black.withValues(alpha: 0.45), - - // TODO see TODO on [bgUnselected] about shadow effect - borderUnselected: Colors.black.withValues(alpha: 0.05), - - textSelected: const HSLColor.fromAHSL(1, 210, 0.20, 0.20).toColor(), - textUnselected: const HSLColor.fromAHSL(1, 210, 0.20, 0.25).toColor(), - ); - - EmojiReactionTheme.dark() : - this._( - bgSelected: Colors.black.withValues(alpha: 0.8), - bgUnselected: Colors.black.withValues(alpha: 0.3), - borderSelected: Colors.white.withValues(alpha: 0.75), - borderUnselected: Colors.white.withValues(alpha: 0.15), - textSelected: Colors.white.withValues(alpha: 0.85), - textUnselected: Colors.white.withValues(alpha: 0.75), - ); + static final light = EmojiReactionTheme._( + bgSelected: Colors.white, + + // TODO shadow effect, following web, which uses `box-shadow: inset`: + // https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow#inset + // Needs Flutter support for something like that: + // https://github.com/flutter/flutter/issues/18636 + // https://github.com/flutter/flutter/issues/52999 + // Until then use a solid color; a much-lightened version of the shadow color. + // Also adapt by making [borderUnselected] more transparent, so we'll + // want to check that against web when implementing the shadow. + bgUnselected: const HSLColor.fromAHSL(0.08, 210, 0.50, 0.875).toColor(), + + borderSelected: Colors.black.withValues(alpha: 0.45), + + // TODO see TODO on [bgUnselected] about shadow effect + borderUnselected: Colors.black.withValues(alpha: 0.05), + + textSelected: const HSLColor.fromAHSL(1, 210, 0.20, 0.20).toColor(), + textUnselected: const HSLColor.fromAHSL(1, 210, 0.20, 0.25).toColor(), + ); + + static final dark = EmojiReactionTheme._( + bgSelected: Colors.black.withValues(alpha: 0.8), + bgUnselected: Colors.black.withValues(alpha: 0.3), + borderSelected: Colors.white.withValues(alpha: 0.75), + borderUnselected: Colors.white.withValues(alpha: 0.15), + textSelected: Colors.white.withValues(alpha: 0.85), + textUnselected: Colors.white.withValues(alpha: 0.75), + ); EmojiReactionTheme._({ required this.bgSelected, diff --git a/lib/widgets/theme.dart b/lib/widgets/theme.dart index 18e3f60c0b..5358f73c42 100644 --- a/lib/widgets/theme.dart +++ b/lib/widgets/theme.dart @@ -30,7 +30,7 @@ ThemeData zulipThemeData(BuildContext context) { themeExtensions = [ ContentTheme.light(context), designVariables, - EmojiReactionTheme.light(), + EmojiReactionTheme.light, MessageListTheme.light, ]; } @@ -39,7 +39,7 @@ ThemeData zulipThemeData(BuildContext context) { themeExtensions = [ ContentTheme.dark(context), designVariables, - EmojiReactionTheme.dark(), + EmojiReactionTheme.dark, MessageListTheme.dark, ]; } diff --git a/test/widgets/emoji_reaction_test.dart b/test/widgets/emoji_reaction_test.dart index 58b4f64a77..89333ee1af 100644 --- a/test/widgets/emoji_reaction_test.dart +++ b/test/widgets/emoji_reaction_test.dart @@ -251,15 +251,15 @@ void main() { } check(backgroundColor('smile')).isNotNull() - .isSameColorAs(EmojiReactionTheme.light().bgSelected); + .isSameColorAs(EmojiReactionTheme.light.bgSelected); check(backgroundColor('tada')).isNotNull() - .isSameColorAs(EmojiReactionTheme.light().bgUnselected); + .isSameColorAs(EmojiReactionTheme.light.bgUnselected); tester.platformDispatcher.platformBrightnessTestValue = Brightness.dark; await tester.pump(); await tester.pump(kThemeAnimationDuration * 0.4); - final expectedLerped = EmojiReactionTheme.light().lerp(EmojiReactionTheme.dark(), 0.4); + final expectedLerped = EmojiReactionTheme.light.lerp(EmojiReactionTheme.dark, 0.4); check(backgroundColor('smile')).isNotNull() .isSameColorAs(expectedLerped.bgSelected); check(backgroundColor('tada')).isNotNull() @@ -267,9 +267,9 @@ void main() { await tester.pump(kThemeAnimationDuration * 0.6); check(backgroundColor('smile')).isNotNull() - .isSameColorAs(EmojiReactionTheme.dark().bgSelected); + .isSameColorAs(EmojiReactionTheme.dark.bgSelected); check(backgroundColor('tada')).isNotNull() - .isSameColorAs(EmojiReactionTheme.dark().bgUnselected); + .isSameColorAs(EmojiReactionTheme.dark.bgUnselected); }); testWidgets('use emoji font', (tester) async {