From 56f8fdb2fc8f044890ff78d2427312b0ec9d5e53 Mon Sep 17 00:00:00 2001 From: Gaurav-Kushwaha-1225 Date: Wed, 15 Jan 2025 06:36:45 +0530 Subject: [PATCH] theme[nfc]: Remove `colorMessageHeaderIconInteractive` Removed `colorMessageHeaderIconInteractive` from `DesignVariables` and used `title` in place of it as per the design guidelines. --- lib/widgets/message_list.dart | 4 ++-- lib/widgets/theme.dart | 17 ++++------------- 2 files changed, 6 insertions(+), 15 deletions(-) diff --git a/lib/widgets/message_list.dart b/lib/widgets/message_list.dart index 7e91decde57..a9357f71868 100644 --- a/lib/widgets/message_list.dart +++ b/lib/widgets/message_list.dart @@ -345,7 +345,7 @@ class MessageListAppBarTitle extends StatelessWidget { padding: const EdgeInsetsDirectional.only(start: 4), child: Icon(icon, // TODO(design) copies the recipient header in web; is there a better color? - color: designVariables.colorMessageHeaderIconInteractive, size: 14)), + color: designVariables.title, size: 14)), ]); } @@ -1091,7 +1091,7 @@ class StreamMessageRecipientHeader extends StatelessWidget { style: recipientHeaderTextStyle(context))), const SizedBox(width: 4), // TODO(design) copies the recipient header in web; is there a better color? - Icon(size: 14, color: designVariables.colorMessageHeaderIconInteractive, + Icon(size: 14, color: designVariables.title, // A null [Icon.icon] makes a blank space. iconDataForTopicVisibilityPolicy( store.topicVisibilityPolicy(message.streamId, topic))), diff --git a/lib/widgets/theme.dart b/lib/widgets/theme.dart index 892604be555..3ad90b3f8c1 100644 --- a/lib/widgets/theme.dart +++ b/lib/widgets/theme.dart @@ -26,7 +26,7 @@ ThemeData zulipThemeData(BuildContext context) { switch (brightness) { case Brightness.light: { - designVariables = DesignVariables.light(); + designVariables = DesignVariables.light; themeExtensions = [ ContentTheme.light(context), designVariables, @@ -35,7 +35,7 @@ ThemeData zulipThemeData(BuildContext context) { ]; } case Brightness.dark: { - designVariables = DesignVariables.dark(); + designVariables = DesignVariables.dark; themeExtensions = [ ContentTheme.dark(context), designVariables, @@ -117,8 +117,7 @@ const kZulipBrandColor = Color.fromRGBO(0x64, 0x92, 0xfe, 1); /// or /// https://www.figma.com/design/1JTNtYo9memgW7vV6d0ygq/Zulip-Mobile?node-id=2945-49492&t=MEb4vtp7S26nntxm-0 class DesignVariables extends ThemeExtension { - DesignVariables.light() : - this._( + static final light = DesignVariables._( background: const Color(0xffffffff), bannerBgIntDanger: const Color(0xfff2e4e4), bgBotBar: const Color(0xfff6f6f6), @@ -148,7 +147,6 @@ class DesignVariables extends ThemeExtension { bgSearchInput: const Color(0xffe3e3e3), textMessage: const Color(0xff262626), channelColorSwatches: ChannelColorSwatches.light, - colorMessageHeaderIconInteractive: Colors.black.withValues(alpha: 0.2), contextMenuCancelBg: const Color(0xff797986).withValues(alpha: 0.15), contextMenuCancelPressedBg: const Color(0xff797986).withValues(alpha: 0.20), dmHeaderBg: const HSLColor.fromAHSL(1, 46, 0.35, 0.93).toColor(), @@ -167,8 +165,7 @@ class DesignVariables extends ThemeExtension { unreadCountBadgeTextForChannel: Colors.black.withValues(alpha: 0.9), ); - DesignVariables.dark() : - this._( + static final dark = DesignVariables._( background: const Color(0xff000000), bannerBgIntDanger: const Color(0xff461616), bgBotBar: const Color(0xff222222), @@ -201,7 +198,6 @@ class DesignVariables extends ThemeExtension { contextMenuCancelBg: const Color(0xff797986).withValues(alpha: 0.15), // the same as the light mode in Figma contextMenuCancelPressedBg: const Color(0xff797986).withValues(alpha: 0.20), // the same as the light mode in Figma // TODO(design-dark) need proper dark-theme color (this is ad hoc) - colorMessageHeaderIconInteractive: Colors.white.withValues(alpha: 0.2), dmHeaderBg: const HSLColor.fromAHSL(1, 46, 0.15, 0.2).toColor(), // TODO(design-dark) need proper dark-theme color (this is ad hoc) groupDmConversationIcon: Colors.white.withValues(alpha: 0.5), @@ -255,7 +251,6 @@ class DesignVariables extends ThemeExtension { required this.bgSearchInput, required this.textMessage, required this.channelColorSwatches, - required this.colorMessageHeaderIconInteractive, required this.contextMenuCancelBg, required this.contextMenuCancelPressedBg, required this.dmHeaderBg, @@ -317,7 +312,6 @@ class DesignVariables extends ThemeExtension { final ChannelColorSwatches channelColorSwatches; // Not named variables in Figma; taken from older Figma drafts, or elsewhere. - final Color colorMessageHeaderIconInteractive; final Color contextMenuCancelBg; // In Figma, but unnamed. final Color contextMenuCancelPressedBg; // In Figma, but unnamed. final Color dmHeaderBg; @@ -366,7 +360,6 @@ class DesignVariables extends ThemeExtension { Color? bgSearchInput, Color? textMessage, ChannelColorSwatches? channelColorSwatches, - Color? colorMessageHeaderIconInteractive, Color? contextMenuCancelBg, Color? contextMenuCancelPressedBg, Color? dmHeaderBg, @@ -414,7 +407,6 @@ class DesignVariables extends ThemeExtension { bgSearchInput: bgSearchInput ?? this.bgSearchInput, textMessage: textMessage ?? this.textMessage, channelColorSwatches: channelColorSwatches ?? this.channelColorSwatches, - colorMessageHeaderIconInteractive: colorMessageHeaderIconInteractive ?? this.colorMessageHeaderIconInteractive, contextMenuCancelBg: contextMenuCancelBg ?? this.contextMenuCancelBg, contextMenuCancelPressedBg: contextMenuCancelPressedBg ?? this.contextMenuCancelPressedBg, dmHeaderBg: dmHeaderBg ?? this.dmHeaderBg, @@ -469,7 +461,6 @@ class DesignVariables extends ThemeExtension { bgSearchInput: Color.lerp(bgSearchInput, other.bgSearchInput, t)!, textMessage: Color.lerp(textMessage, other.textMessage, t)!, channelColorSwatches: ChannelColorSwatches.lerp(channelColorSwatches, other.channelColorSwatches, t), - colorMessageHeaderIconInteractive: Color.lerp(colorMessageHeaderIconInteractive, other.colorMessageHeaderIconInteractive, t)!, contextMenuCancelBg: Color.lerp(contextMenuCancelBg, other.contextMenuCancelBg, t)!, contextMenuCancelPressedBg: Color.lerp(contextMenuCancelPressedBg, other.contextMenuCancelPressedBg, t)!, dmHeaderBg: Color.lerp(dmHeaderBg, other.dmHeaderBg, t)!,