diff --git a/lib/widgets/app.dart b/lib/widgets/app.dart index 3912f37a29..dcc320c2dd 100644 --- a/lib/widgets/app.dart +++ b/lib/widgets/app.dart @@ -299,6 +299,8 @@ class HomePage extends StatelessWidget { final store = PerAccountStoreWidget.of(context); final zulipLocalizations = ZulipLocalizations.of(context); + final colorScheme = ColorScheme.of(context); + InlineSpan bold(String text) => TextSpan( style: const TextStyle().merge(weightVariableTextStyle(context, wght: 700)), text: text); @@ -310,63 +312,67 @@ class HomePage extends StatelessWidget { return Scaffold( appBar: ZulipAppBar(title: const Text("Home")), - body: Center( - child: Column(mainAxisAlignment: MainAxisAlignment.center, children: [ - DefaultTextStyle.merge( - textAlign: TextAlign.center, - style: const TextStyle(fontSize: 18), - child: Column(children: [ - const Text('🚧 Under construction 🚧'), - const SizedBox(height: 12), - Text.rich(TextSpan( - text: 'Connected to: ', - children: [bold(store.realmUrl.toString())])), - Text.rich(TextSpan( - text: 'Zulip server version: ', - children: [bold(store.zulipVersion)])), - Text(zulipLocalizations.subscribedToNChannels(store.subscriptions.length)), - ])), - const SizedBox(height: 16), - ElevatedButton( - onPressed: () => Navigator.push(context, - MessageListPage.buildRoute(context: context, - narrow: const CombinedFeedNarrow())), - child: Text(zulipLocalizations.combinedFeedPageTitle)), - const SizedBox(height: 16), - ElevatedButton( - onPressed: () => Navigator.push(context, - MessageListPage.buildRoute(context: context, - narrow: const MentionsNarrow())), - child: Text(zulipLocalizations.mentionsPageTitle)), - const SizedBox(height: 16), - ElevatedButton( - onPressed: () => Navigator.push(context, - MessageListPage.buildRoute(context: context, - narrow: const StarredMessagesNarrow())), - child: Text(zulipLocalizations.starredMessagesPageTitle)), - const SizedBox(height: 16), - ElevatedButton( - onPressed: () => Navigator.push(context, - InboxPage.buildRoute(context: context)), - child: const Text("Inbox")), // TODO(i18n) - const SizedBox(height: 16), - ElevatedButton( - onPressed: () => Navigator.push(context, - SubscriptionListPage.buildRoute(context: context)), - child: const Text("Subscribed channels")), - const SizedBox(height: 16), - ElevatedButton( - onPressed: () => Navigator.push(context, - RecentDmConversationsPage.buildRoute(context: context)), - child: Text(zulipLocalizations.recentDmConversationsPageTitle)), - if (testStreamId != null) ...[ + body: ElevatedButtonTheme( + data: ElevatedButtonThemeData(style: ButtonStyle( + backgroundColor: WidgetStatePropertyAll(colorScheme.secondaryContainer), + foregroundColor: WidgetStatePropertyAll(colorScheme.onSecondaryContainer))), + child: Center( + child: Column(mainAxisAlignment: MainAxisAlignment.center, children: [ + DefaultTextStyle.merge( + textAlign: TextAlign.center, + style: const TextStyle(fontSize: 18), + child: Column(children: [ + const Text('🚧 Under construction 🚧'), + const SizedBox(height: 12), + Text.rich(TextSpan( + text: 'Connected to: ', + children: [bold(store.realmUrl.toString())])), + Text.rich(TextSpan( + text: 'Zulip server version: ', + children: [bold(store.zulipVersion)])), + Text(zulipLocalizations.subscribedToNChannels(store.subscriptions.length)), + ])), + const SizedBox(height: 16), + ElevatedButton( + onPressed: () => Navigator.push(context, + MessageListPage.buildRoute(context: context, + narrow: const CombinedFeedNarrow())), + child: Text(zulipLocalizations.combinedFeedPageTitle)), + const SizedBox(height: 16), + ElevatedButton( + onPressed: () => Navigator.push(context, + MessageListPage.buildRoute(context: context, + narrow: const MentionsNarrow())), + child: Text(zulipLocalizations.mentionsPageTitle)), const SizedBox(height: 16), ElevatedButton( onPressed: () => Navigator.push(context, MessageListPage.buildRoute(context: context, - narrow: ChannelNarrow(testStreamId!))), - child: const Text("#test here")), // scaffolding hack, see above - ], - ]))); + narrow: const StarredMessagesNarrow())), + child: Text(zulipLocalizations.starredMessagesPageTitle)), + const SizedBox(height: 16), + ElevatedButton( + onPressed: () => Navigator.push(context, + InboxPage.buildRoute(context: context)), + child: const Text("Inbox")), // TODO(i18n) + const SizedBox(height: 16), + ElevatedButton( + onPressed: () => Navigator.push(context, + SubscriptionListPage.buildRoute(context: context)), + child: const Text("Subscribed channels")), + const SizedBox(height: 16), + ElevatedButton( + onPressed: () => Navigator.push(context, + RecentDmConversationsPage.buildRoute(context: context)), + child: Text(zulipLocalizations.recentDmConversationsPageTitle)), + if (testStreamId != null) ...[ + const SizedBox(height: 16), + ElevatedButton( + onPressed: () => Navigator.push(context, + MessageListPage.buildRoute(context: context, + narrow: ChannelNarrow(testStreamId!))), + child: const Text("#test here")), // scaffolding hack, see above + ], + ])))); } } diff --git a/lib/widgets/content.dart b/lib/widgets/content.dart index 3ca200233e..c3ec017099 100644 --- a/lib/widgets/content.dart +++ b/lib/widgets/content.dart @@ -82,10 +82,10 @@ class ContentTheme extends ThemeExtension { color: const HSLColor.fromAHSL(1, 0, 0, 0.85).toColor(), debugLabel: 'ContentTheme.textStylePlainParagraph'), codeBlockTextStyles: CodeBlockTextStyles.dark(context), - textStyleError: TextStyle(fontSize: kBaseFontSize, color: Colors.red.shade900) + textStyleError: const TextStyle(fontSize: kBaseFontSize, color: Colors.red) .merge(weightVariableTextStyle(context, wght: 700)), textStyleErrorCode: kMonospaceTextStyle - .merge(TextStyle(fontSize: kBaseFontSize, color: Colors.red.shade900)), + .merge(const TextStyle(fontSize: kBaseFontSize, color: Colors.red)), textStyleInlineCode: kMonospaceTextStyle.merge(TextStyle( backgroundColor: const HSLColor.fromAHSL(0.08, 0, 0, 1).toColor())), textStyleInlineMath: kMonospaceTextStyle.merge(TextStyle( diff --git a/lib/widgets/login.dart b/lib/widgets/login.dart index 21d006a2b5..0f8ae30179 100644 --- a/lib/widgets/login.dart +++ b/lib/widgets/login.dart @@ -430,7 +430,8 @@ class _LoginPageState extends State { final icon = method.displayIcon; return OutlinedButton.icon( style: ButtonStyle( - backgroundColor: WidgetStatePropertyAll(colorScheme.secondaryContainer)), + backgroundColor: WidgetStatePropertyAll(colorScheme.secondaryContainer), + foregroundColor: WidgetStatePropertyAll(colorScheme.onSecondaryContainer)), icon: icon != null ? Image.network(icon, width: 24, height: 24) : null, @@ -438,7 +439,6 @@ class _LoginPageState extends State { ? () => _beginWebAuth(method) : null, label: Text( - style: TextStyle(color: colorScheme.onSecondaryContainer), zulipLocalizations.signInWithFoo(method.displayName))); }), ], diff --git a/lib/widgets/theme.dart b/lib/widgets/theme.dart index d7a6ddabf6..9f1c732f5c 100644 --- a/lib/widgets/theme.dart +++ b/lib/widgets/theme.dart @@ -126,6 +126,7 @@ class DesignVariables extends ThemeExtension { groupDmConversationIconBg: const Color(0x33808080), loginOrDivider: const Color(0xffdedede), loginOrDividerText: const Color(0xff575757), + mutedUnreadBadge: const HSLColor.fromAHSL(0.5, 0, 0, 0.8).toColor(), sectionCollapseIcon: const Color(0x7f1e2e48), star: const HSLColor.fromAHSL(0.5, 47, 1, 0.41).toColor(), subscriptionListHeaderLine: const HSLColor.fromAHSL(0.2, 240, 0.1, 0.5).toColor(), @@ -159,6 +160,8 @@ class DesignVariables extends ThemeExtension { loginOrDivider: const Color(0xff424242), loginOrDividerText: const Color(0xffa8a8a8), // TODO(design-dark) need proper dark-theme color (this is ad hoc) + mutedUnreadBadge: const HSLColor.fromAHSL(0.5, 0, 0, 0.6).toColor(), + // TODO(design-dark) need proper dark-theme color (this is ad hoc) sectionCollapseIcon: const Color(0x7fb6c8e2), // TODO(design-dark) unchanged in dark theme? star: const HSLColor.fromAHSL(0.5, 47, 1, 0.41).toColor(), @@ -190,6 +193,7 @@ class DesignVariables extends ThemeExtension { required this.groupDmConversationIconBg, required this.loginOrDivider, required this.loginOrDividerText, + required this.mutedUnreadBadge, required this.sectionCollapseIcon, required this.star, required this.subscriptionListHeaderLine, @@ -231,6 +235,7 @@ class DesignVariables extends ThemeExtension { final Color groupDmConversationIconBg; final Color loginOrDivider; // TODO(design-dark) need proper dark-theme color (this is ad hoc) final Color loginOrDividerText; // TODO(design-dark) need proper dark-theme color (this is ad hoc) + final Color mutedUnreadBadge; final Color sectionCollapseIcon; final Color star; final Color subscriptionListHeaderLine; @@ -259,6 +264,7 @@ class DesignVariables extends ThemeExtension { Color? groupDmConversationIconBg, Color? loginOrDivider, Color? loginOrDividerText, + Color? mutedUnreadBadge, Color? sectionCollapseIcon, Color? star, Color? subscriptionListHeaderLine, @@ -286,6 +292,7 @@ class DesignVariables extends ThemeExtension { groupDmConversationIconBg: groupDmConversationIconBg ?? this.groupDmConversationIconBg, loginOrDivider: loginOrDivider ?? this.loginOrDivider, loginOrDividerText: loginOrDividerText ?? this.loginOrDividerText, + mutedUnreadBadge: mutedUnreadBadge ?? this.mutedUnreadBadge, sectionCollapseIcon: sectionCollapseIcon ?? this.sectionCollapseIcon, star: star ?? this.star, subscriptionListHeaderLine: subscriptionListHeaderLine ?? this.subscriptionListHeaderLine, @@ -320,6 +327,7 @@ class DesignVariables extends ThemeExtension { groupDmConversationIconBg: Color.lerp(groupDmConversationIconBg, other.groupDmConversationIconBg, t)!, loginOrDivider: Color.lerp(loginOrDivider, other.loginOrDivider, t)!, loginOrDividerText: Color.lerp(loginOrDividerText, other.loginOrDividerText, t)!, + mutedUnreadBadge: Color.lerp(mutedUnreadBadge, other.mutedUnreadBadge, t)!, sectionCollapseIcon: Color.lerp(sectionCollapseIcon, other.sectionCollapseIcon, t)!, star: Color.lerp(star, other.star, t)!, subscriptionListHeaderLine: Color.lerp(subscriptionListHeaderLine, other.subscriptionListHeaderLine, t)!, diff --git a/lib/widgets/unread_count_badge.dart b/lib/widgets/unread_count_badge.dart index 5c09e156cd..7d2cdc1f27 100644 --- a/lib/widgets/unread_count_badge.dart +++ b/lib/widgets/unread_count_badge.dart @@ -63,12 +63,13 @@ class MutedUnreadBadge extends StatelessWidget { @override Widget build(BuildContext context) { + final designVariables = DesignVariables.of(context); return Container( width: 8, height: 8, margin: const EdgeInsetsDirectional.only(end: 3), decoration: BoxDecoration( - color: const HSLColor.fromAHSL(0.5, 0, 0, 0.8).toColor(), + color: designVariables.mutedUnreadBadge, shape: BoxShape.circle)); } }