Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Tweak dark theme #1213

Open
wants to merge 6 commits into
base: main
Choose a base branch
from

Conversation

Gaurav-Kushwaha-1225
Copy link

@Gaurav-Kushwaha-1225 Gaurav-Kushwaha-1225 commented Dec 27, 2024

About Changes

This PR updates the color variables in DesignVariables and MessageListTheme for a slightly higher contrast in dark theme according to the values in the figma file.

Fixes: #973

Screenshots

Before After

@alya
Copy link
Collaborator

alya commented Dec 27, 2024

Please clean up your commit history and post again to request a review. See here for guidelines.

@Gaurav-Kushwaha-1225
Copy link
Author

Please clean up your commit history and post again to request a review. See here for guidelines.

I’ve cleaned up the commit history by removing unnecessary merge commits into the TweakDarkTheme branch and combining related changes into a single commit for clarity.

This is my first time using rebase -i. During the process, I used pick, squash, and drop commands for various commits. I initially thought there would be separate commit messages for each, but later realized they were combined into one during the rebase.
Although, it asked to enter three commit messages after rebasing, Idk why it happened. Could you please explain why all commit messages were merged into one?
I’d like to understand this better for future contributions.

Apologies for any confusion.

Please review the updated PR.

@gnprice
Copy link
Member

gnprice commented Dec 27, 2024

The #git help channel on chat.zulip.org is a good place to ask questions about using Git.

@Gaurav-Kushwaha-1225
Copy link
Author

Please clean up your commit history and post again to request a review. See here for guidelines.

Hi @alya, please review the updated PR.

@alya
Copy link
Collaborator

alya commented Jan 6, 2025

Thanks! I'll let other folks take a look at this one.

@gnprice gnprice added the maintainer review PR ready for review by Zulip maintainers label Jan 7, 2025
@PIG208
Copy link
Member

PIG208 commented Jan 8, 2025

Hi! Please read through the commit style guide (also previously linked by Alya) linked in our README and fix the commit message: https://github.com/zulip/zulip-flutter?tab=readme-ov-file#submitting-a-pull-request

Copy link
Member

@PIG208 PIG208 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for the PR! I noted the differences between this revision and the Figma design after going through lib/widgets/message_list.dart and some part of lib/widgets/compose_box.dart for colors used in the widgets.

Some of the comments are just about different colors being used, and others request the addition/removal of variables. It should be fine to include color adjustments all in a single commit, but for adding/removing variables, let's try to have separate commits for the ones added, so it is easier to see which variables they replace. Consider using the NFC tag if a commit is a pure refactor.

I think there are also changes to the autocomplete window, but that should be addressed in #995,

lib/widgets/message_list.dart Outdated Show resolved Hide resolved
lib/widgets/theme.dart Outdated Show resolved Hide resolved
lib/widgets/message_list.dart Outdated Show resolved Hide resolved
lib/widgets/message_list.dart Outdated Show resolved Hide resolved
lib/widgets/theme.dart Outdated Show resolved Hide resolved
Gaurav-Kushwaha-1225 added a commit to Gaurav-Kushwaha-1225/zulip-flutter that referenced this pull request Jan 12, 2025
Adjusted the colors for `foreground` in
`DesignVariables` and `dateSeparator` in `MessageListTheme`
as asked.
`foreground`: zulip#1213 (comment)
`dateSeparator`: zulip#1213 (comment)
Gaurav-Kushwaha-1225 added a commit to Gaurav-Kushwaha-1225/zulip-flutter that referenced this pull request Jan 12, 2025
Added `labelTime` variable in `MessageListTheme`
that replaces the `dateSeparatorText` and
`messageTimestamp` variable according to the latest
design.

`labelTime`: zulip#1213 (comment)
Gaurav-Kushwaha-1225 added a commit to Gaurav-Kushwaha-1225/zulip-flutter that referenced this pull request Jan 12, 2025
Adjusted the colors for `foreground` in
`DesignVariables` and `dateSeparator` in
`MessageListTheme` as asked.

`foreground`: zulip#1213 (comment)
`dateSeparator`: zulip#1213 (comment)
Gaurav-Kushwaha-1225 added a commit to Gaurav-Kushwaha-1225/zulip-flutter that referenced this pull request Jan 12, 2025
Added `labelTime` variable in `MessageListTheme`
that replaces the `dateSeparatorText` and
`messageTimestamp` variable according to the latest
design.

`labelTime`: zulip#1213 (comment)
Gaurav-Kushwaha-1225 added a commit to Gaurav-Kushwaha-1225/zulip-flutter that referenced this pull request Jan 15, 2025
Adjusted the colors for `foreground` in
`DesignVariables` and `dateSeparator` in
`MessageListTheme` as asked.

`foreground`: zulip#1213 (comment)
`dateSeparator`: zulip#1213 (comment)
Gaurav-Kushwaha-1225 added a commit to Gaurav-Kushwaha-1225/zulip-flutter that referenced this pull request Jan 15, 2025
Added `labelTime` variable in `MessageListTheme`
that replaces the `dateSeparatorText` and
`messageTimestamp` variable according to the latest
design.

`labelTime`: zulip#1213 (comment)
Gaurav-Kushwaha-1225 added a commit to Gaurav-Kushwaha-1225/zulip-flutter that referenced this pull request Jan 15, 2025
Added `labelTime` variable in `MessageListTheme`
that replaces the `dateSeparatorText` and
`messageTimestamp` variable according to the latest
design.

`labelTime`: zulip#1213 (comment)
Gaurav-Kushwaha-1225 added a commit to Gaurav-Kushwaha-1225/zulip-flutter that referenced this pull request Jan 15, 2025
Adjusted the colors for `foreground` in
`DesignVariables` and `dateSeparator` in `MessageListTheme`
as asked.
`foreground`: zulip#1213 (comment)
`dateSeparator`: zulip#1213 (comment)
Gaurav-Kushwaha-1225 added a commit to Gaurav-Kushwaha-1225/zulip-flutter that referenced this pull request Jan 15, 2025
Added `labelTime` variable in `MessageListTheme`
that replaces the `dateSeparatorText` and
`messageTimestamp` variable according to the latest
design.

`labelTime`: zulip#1213 (comment)
Gaurav-Kushwaha-1225 added a commit to Gaurav-Kushwaha-1225/zulip-flutter that referenced this pull request Jan 15, 2025
Removed `colorMessageHeaderIconInteractive` from
`DesignVariables` and used `title` in place of it
as per the design guidelines.
discussion: zulip#1213 (comment)
Gaurav-Kushwaha-1225 added a commit to Gaurav-Kushwaha-1225/zulip-flutter that referenced this pull request Jan 15, 2025
Removed `senderName` & `recipientHeaderText` from
`MessageListTheme` and used `title` in place of it
as per the design guidelines.
discussion: zulip#1213 (comment)
Gaurav-Kushwaha-1225 added a commit to Gaurav-Kushwaha-1225/zulip-flutter that referenced this pull request Jan 21, 2025
Adjusted the colors for `foreground` in
`DesignVariables` and `dateSeparator` in `MessageListTheme`
as asked.
`foreground`: zulip#1213 (comment)
`dateSeparator`: zulip#1213 (comment)
Gaurav-Kushwaha-1225 added a commit to Gaurav-Kushwaha-1225/zulip-flutter that referenced this pull request Jan 21, 2025
Added `labelTime` variable in `MessageListTheme`
that replaces the `dateSeparatorText` and
`messageTimestamp` variable according to the latest
design.

`labelTime`: zulip#1213 (comment)
Copy link
Member

@PIG208 PIG208 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for the update! Left a comment. Could you also post the updated screenshots?

Gaurav-Kushwaha-1225 added a commit to Gaurav-Kushwaha-1225/zulip-flutter that referenced this pull request Feb 3, 2025
Fixed a bug in `MessageListTheme.lerp()` where `dmRecipientHeaderBg`
was using `streamMessageBgDefault` instead of `dmRecipientHeaderBg`
for interpolation.

discussion: zulip#1213 (comment)
@Gaurav-Kushwaha-1225
Copy link
Author

Gaurav-Kushwaha-1225 commented Feb 4, 2025

Screenshots of all Commits

It's ready for review now. The failing CI checks are due to some other change that is being discussed in the Zulip chats.

  • Commit: 885f1fd, a4996d6 i.e. The Topic row icon color and background color of message.

Before After
photo_2025-02-04_13-39-21 photo_2025-02-04_13-39-23
photo_2025-02-04_13-39-19 photo_2025-02-04_13-39-25
Before After
photo_2025-02-04_13-39-15 photo_2025-02-04_13-39-29
photo_2025-02-04_13-39-18 photo_2025-02-04_13-39-27

@PIG208 PIG208 self-requested a review February 4, 2025 18:18
@alya
Copy link
Collaborator

alya commented Feb 5, 2025

What's going on with the dramatic changes at the bottoms of your screenshots?

@PIG208 PIG208 added integration review Added by maintainers when PR may be ready for integration and removed maintainer review PR ready for review by Zulip maintainers labels Feb 5, 2025
@PIG208 PIG208 assigned gnprice and unassigned PIG208 Feb 5, 2025
@PIG208 PIG208 requested review from gnprice and removed request for PIG208 February 5, 2025 00:51
@PIG208
Copy link
Member

PIG208 commented Feb 5, 2025

Apart from the issue Alya brought up, the update looks good to me! Marking this for Greg's review.

@Gaurav-Kushwaha-1225
Copy link
Author

Gaurav-Kushwaha-1225 commented Feb 5, 2025

What's going on with the dramatic changes at the bottoms of your screenshots?

It seems to be a new issue in the main branch. When you change the theme after opening the app (for example, while on the DMs page), the bottom taskbar color doesn’t update properly.

Could you confirm if this issue persists? If so, I’ll check for an existing issue or file a new one.

Thanks for pointing it out!

@Gaurav-Kushwaha-1225
Copy link
Author

What's going on with the dramatic changes at the bottoms of your screenshots?

Hi @alya, Thanks for pointing out the issue, I have filed an issue for this.
Issue: #1333

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
integration review Added by maintainers when PR may be ready for integration
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Tweak dark theme for slightly higher contrast
5 participants