Skip to content

Commit

Permalink
theme: Follow system setting for light/dark theme!
Browse files Browse the repository at this point in the history
We now have dark-theme variants in all the styles that differ
between light and dark, in all of the app we've implemented so far.
It's time to let users benefit from that work!

We don't yet let the user choose between dark/light/system in the
app -- that's zulip#97 "Store some client settings" -- but the "system"
behavior should be the default anyway, and this commit provides
that.

The dark-theme colors are picked from various sources. For each
color, I believe the source is clear either in the code or the Git
history. Those sources are:

- the web app (in its state when we wrote the zulip-flutter commit)
- the "ready for dev" parts of the new Figma, like this:
    https://www.figma.com/design/1JTNtYo9memgW7vV6d0ygq/Zulip-Mobile?node-id=2940-48987&m=dev
- the table of variables in the new Figma, with a note that we're
  not sure if we chose the right variable (because the part of the
  UI doesn't have a "ready for dev" design yet)
- my brain. If I couldn't find a better source for a color, I just
  made one up and checked that it looked OK.

We'll want to update the colors as Vlad's work on the new Figma
progresses, and also incorporate his feedback from trying out the
app in dark theme.

Fixes: zulip#95
  • Loading branch information
chrisbobbe committed Aug 2, 2024
1 parent 726ccb6 commit 2cdf0dc
Show file tree
Hide file tree
Showing 4 changed files with 1 addition and 38 deletions.
27 changes: 1 addition & 26 deletions lib/widgets/theme.dart
Original file line number Diff line number Diff line change
Expand Up @@ -7,35 +7,10 @@ import 'message_list.dart';
import 'channel_colors.dart';
import 'text.dart';

/// In debug mode, controls whether the UI responds to
/// [MediaQueryData.platformBrightness].
///
/// Outside of debug mode, this is always false and the setter has no effect.
// TODO(#95) when dark theme is fully implemented, simplify away;
// the UI should always respond.
bool get debugFollowPlatformBrightness {
bool result = false;
assert(() {
result = _debugFollowPlatformBrightness;
return true;
}());
return result;
}
bool _debugFollowPlatformBrightness = false;
set debugFollowPlatformBrightness(bool value) {
assert(() {
_debugFollowPlatformBrightness = value;
return true;
}());
}


ThemeData zulipThemeData(BuildContext context) {
final DesignVariables designVariables;
final List<ThemeExtension> themeExtensions;
Brightness brightness = debugFollowPlatformBrightness
? MediaQuery.of(context).platformBrightness
: Brightness.light;
Brightness brightness = MediaQuery.of(context).platformBrightness;
switch (brightness) {
case Brightness.light: {
designVariables = DesignVariables.light();
Expand Down
4 changes: 0 additions & 4 deletions test/widgets/emoji_reaction_test.dart
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,6 @@ import 'package:zulip/api/model/events.dart';
import 'package:zulip/api/model/model.dart';
import 'package:zulip/model/store.dart';
import 'package:zulip/widgets/emoji_reaction.dart';
import 'package:zulip/widgets/theme.dart';

import '../example_data.dart' as eg;
import '../flutter_checks.dart';
Expand Down Expand Up @@ -221,9 +220,6 @@ void main() {
await prepare();
await store.addUsers([eg.selfUser, eg.otherUser]);

assert(!debugFollowPlatformBrightness); // to be removed with #95
debugFollowPlatformBrightness = true;
addTearDown(() { debugFollowPlatformBrightness = false; });
tester.platformDispatcher.platformBrightnessTestValue = Brightness.light;
addTearDown(tester.platformDispatcher.clearPlatformBrightnessTestValue);

Expand Down
5 changes: 0 additions & 5 deletions test/widgets/message_list_test.dart
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,6 @@ import 'package:zulip/widgets/icons.dart';
import 'package:zulip/widgets/message_list.dart';
import 'package:zulip/widgets/store.dart';
import 'package:zulip/widgets/channel_colors.dart';
import 'package:zulip/widgets/theme.dart';

import '../api/fake_api.dart';
import '../example_data.dart' as eg;
Expand Down Expand Up @@ -151,10 +150,6 @@ void main() {
});

testWidgets('smoke test for light/dark/lerped', (tester) async {
assert(!debugFollowPlatformBrightness); // to be removed with #95
debugFollowPlatformBrightness = true;
addTearDown(() { debugFollowPlatformBrightness = false; });

tester.platformDispatcher.platformBrightnessTestValue = Brightness.light;
addTearDown(tester.platformDispatcher.clearPlatformBrightnessTestValue);

Expand Down
3 changes: 0 additions & 3 deletions test/widgets/theme_test.dart
Original file line number Diff line number Diff line change
Expand Up @@ -106,9 +106,6 @@ void main() {

final subscription = eg.subscription(eg.stream(), color: baseColor);

assert(!debugFollowPlatformBrightness); // to be removed with #95
debugFollowPlatformBrightness = true;
addTearDown(() { debugFollowPlatformBrightness = false; });
tester.platformDispatcher.platformBrightnessTestValue = Brightness.light;
addTearDown(tester.platformDispatcher.clearPlatformBrightnessTestValue);

Expand Down

0 comments on commit 2cdf0dc

Please sign in to comment.