From df8438ca7ba60ac4ef5acf91f854fe82f158a669 Mon Sep 17 00:00:00 2001 From: Gaurav-Kushwaha-1225 Date: Wed, 15 Jan 2025 08:46:22 +0530 Subject: [PATCH] theme: Replace `senderName` & `recipientHeaderText` with `title` Removed `senderName` & `recipientHeaderText` from `MessageListTheme` and used `title` in place of it as per the design guidelines. discussion: https://github.com/zulip/zulip-flutter/pull/1213#discussion_r1908349307 Fixes: #973 --- lib/widgets/message_list.dart | 23 +++++------------------ lib/widgets/theme.dart | 2 +- 2 files changed, 6 insertions(+), 19 deletions(-) diff --git a/lib/widgets/message_list.dart b/lib/widgets/message_list.dart index 3faa442af8..00c47a84a0 100644 --- a/lib/widgets/message_list.dart +++ b/lib/widgets/message_list.dart @@ -31,9 +31,7 @@ class MessageListTheme extends ThemeExtension { dateSeparator: Colors.black, labelTime: const HSLColor.fromAHSL(0.49, 0, 0, 0).toColor(), dmRecipientHeaderBg: const HSLColor.fromAHSL(1, 46, 0.35, 0.93).toColor(), - recipientHeaderText: const HSLColor.fromAHSL(1, 0, 0, 0.15).toColor(), senderBotIcon: const HSLColor.fromAHSL(1, 180, 0.08, 0.65).toColor(), - senderName: const HSLColor.fromAHSL(1, 0, 0, 0.2).toColor(), streamMessageBgDefault: Colors.white, streamRecipientHeaderChevronRight: Colors.black.withValues(alpha: 0.3), @@ -55,9 +53,7 @@ class MessageListTheme extends ThemeExtension { dateSeparator: Colors.white, labelTime: const HSLColor.fromAHSL(0.5, 0, 0, 1).toColor(), dmRecipientHeaderBg: const HSLColor.fromAHSL(1, 46, 0.15, 0.2).toColor(), - recipientHeaderText: const HSLColor.fromAHSL(0.9, 0, 0, 1).toColor(), senderBotIcon: const HSLColor.fromAHSL(1, 180, 0.05, 0.5).toColor(), - senderName: const HSLColor.fromAHSL(0.9, 0, 0, 1).toColor(), streamMessageBgDefault: const HSLColor.fromAHSL(1, 0, 0, 0.15).toColor(), streamRecipientHeaderChevronRight: Colors.white.withValues(alpha: 0.3), @@ -78,9 +74,7 @@ class MessageListTheme extends ThemeExtension { required this.dateSeparator, required this.labelTime, required this.dmRecipientHeaderBg, - required this.recipientHeaderText, required this.senderBotIcon, - required this.senderName, required this.streamMessageBgDefault, required this.streamRecipientHeaderChevronRight, required this.unreadMarker, @@ -101,9 +95,7 @@ class MessageListTheme extends ThemeExtension { final Color dateSeparator; final Color labelTime; final Color dmRecipientHeaderBg; - final Color recipientHeaderText; final Color senderBotIcon; - final Color senderName; final Color streamMessageBgDefault; final Color streamRecipientHeaderChevronRight; final Color unreadMarker; @@ -115,9 +107,7 @@ class MessageListTheme extends ThemeExtension { Color? dateSeparator, Color? labelTime, Color? dmRecipientHeaderBg, - Color? recipientHeaderText, Color? senderBotIcon, - Color? senderName, Color? streamMessageBgDefault, Color? streamRecipientHeaderChevronRight, Color? unreadMarker, @@ -128,9 +118,7 @@ class MessageListTheme extends ThemeExtension { dateSeparator: dateSeparator ?? this.dateSeparator, labelTime: labelTime ?? this.labelTime, dmRecipientHeaderBg: dmRecipientHeaderBg ?? this.dmRecipientHeaderBg, - recipientHeaderText: recipientHeaderText ?? this.recipientHeaderText, senderBotIcon: senderBotIcon ?? this.senderBotIcon, - senderName: senderName ?? this.senderName, streamMessageBgDefault: streamMessageBgDefault ?? this.streamMessageBgDefault, streamRecipientHeaderChevronRight: streamRecipientHeaderChevronRight ?? this.streamRecipientHeaderChevronRight, unreadMarker: unreadMarker ?? this.unreadMarker, @@ -148,9 +136,7 @@ class MessageListTheme extends ThemeExtension { dateSeparator: Color.lerp(dateSeparator, other.dateSeparator, t)!, labelTime: Color.lerp(labelTime, other.labelTime, t)!, dmRecipientHeaderBg: Color.lerp(streamMessageBgDefault, other.dmRecipientHeaderBg, t)!, - recipientHeaderText: Color.lerp(recipientHeaderText, other.recipientHeaderText, t)!, senderBotIcon: Color.lerp(senderBotIcon, other.senderBotIcon, t)!, - senderName: Color.lerp(senderName, other.senderName, t)!, streamMessageBgDefault: Color.lerp(streamMessageBgDefault, other.streamMessageBgDefault, t)!, streamRecipientHeaderChevronRight: Color.lerp(streamRecipientHeaderChevronRight, other.streamRecipientHeaderChevronRight, t)!, unreadMarker: Color.lerp(unreadMarker, other.unreadMarker, t)!, @@ -1037,7 +1023,7 @@ class StreamMessageRecipientHeader extends StatelessWidget { iconColor = swatch.iconOnBarBackground; } else { backgroundColor = messageListTheme.unsubscribedStreamRecipientHeaderBg; - iconColor = messageListTheme.recipientHeaderText; + iconColor = designVariables.title; } final Widget streamWidget; @@ -1142,6 +1128,7 @@ class DmRecipientHeader extends StatelessWidget { } final messageListTheme = MessageListTheme.of(context); + final designVariables = DesignVariables.of(context); return GestureDetector( onTap: () => Navigator.push(context, @@ -1157,7 +1144,7 @@ class DmRecipientHeader extends StatelessWidget { Padding( padding: const EdgeInsets.symmetric(horizontal: 6), child: Icon( - color: messageListTheme.recipientHeaderText, + color: designVariables.title, size: 16, ZulipIcons.user)), Expanded( @@ -1171,7 +1158,7 @@ class DmRecipientHeader extends StatelessWidget { TextStyle recipientHeaderTextStyle(BuildContext context) { return TextStyle( - color: MessageListTheme.of(context).recipientHeaderText, + color: DesignVariables.of(context).title, fontSize: 16, letterSpacing: proportionalLetterSpacing(context, 0.02, baseFontSize: 16), height: (18 / 16), @@ -1307,7 +1294,7 @@ class MessageWithPossibleSender extends StatelessWidget { style: TextStyle( fontSize: 18, height: (22 / 18), - color: messageListTheme.senderName, + color: designVariables.title, ).merge(weightVariableTextStyle(context, wght: 600)), overflow: TextOverflow.ellipsis)), if (sender?.isBot ?? false) ...[ diff --git a/lib/widgets/theme.dart b/lib/widgets/theme.dart index 09c19f51d3..22bbf7349a 100644 --- a/lib/widgets/theme.dart +++ b/lib/widgets/theme.dart @@ -191,7 +191,7 @@ class DesignVariables extends ThemeExtension { labelMenuButton: const Color(0xffffffff).withValues(alpha: 0.85), mainBackground: const Color(0xff1d1d1d), textInput: const Color(0xffffffff).withValues(alpha: 0.9), - title: const Color(0xffffffff), + title: const Color(0xffffffff).withValues(alpha: 0.9), bgSearchInput: const Color(0xff313131), textMessage: const Color(0xffffffff).withValues(alpha: 0.8), channelColorSwatches: ChannelColorSwatches.dark,