theme[nfc]: Remove colorMessageHeaderIconInteractive

Removed `colorMessageHeaderIconInteractive` from `DesignVariables` and used `title` in place of it as per the design guidelines.
zulip · Jan 15, 2025 · 56f8fdb · 56f8fdb
1 parent 69471f0
commit 56f8fdb
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 15 deletions.
diff --git 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
@@ -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> {
-  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<DesignVariables> {
       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<DesignVariables> {
       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<DesignVariables> {
       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<DesignVariables> {
     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<DesignVariables> {
   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<DesignVariables> {
     Color? bgSearchInput,
     Color? textMessage,
     ChannelColorSwatches? channelColorSwatches,
-    Color? colorMessageHeaderIconInteractive,
     Color? contextMenuCancelBg,
     Color? contextMenuCancelPressedBg,
     Color? dmHeaderBg,
@@ -414,7 +407,6 @@ class DesignVariables extends ThemeExtension<DesignVariables> {
       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<DesignVariables> {
       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)!,