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

Update theme for menus #2578

Merged
merged 9 commits into from
Jul 10, 2024
Merged

Update theme for menus #2578

merged 9 commits into from
Jul 10, 2024

Conversation

3Simplex
Copy link
Collaborator

@3Simplex 3Simplex commented Jul 6, 2024

Describe your changes

Menu theme colors adjusted to produce softer look while maintaining current scheme.

To achieve this:
Assigned property names for each color by the object to which they apply. (Ideally easy to understand without needing to trace)

  • "menuBorderColor" (the color for the border of the comboBox & context menus)
  • "menuBackgroundColor" (the color for the background of the comboBox & context menus)
  • "menuHighlightColor" (the color for the highlight of the comboBox & context menus)

Other:

  • The previous color properties no longer apply to other separate objects and were commented out with notes. (To be removed?)
  • Fix for server text color in chatview. (tested)

Issue ticket number and link

Checklist before requesting a review

  • I have performed a self-review of my code.
  • If it is a core feature, I have added thorough tests.
  • I have added thorough documentation for my code.
  • I have tagged PR with relevant project labels. I acknowledge that a PR without labels may be dismissed.
  • If this PR addresses a bug, I have provided both a screenshot/video of the original bug and the working solution.

Demo

Steps to Reproduce

Notes


🚀 This description was created by Ellipsis for commit 2a9ef8e

Summary:

Updated theme colors for menus and context menus with new color properties for a softer look in gpt4all-chat/qml/ChatView.qml, gpt4all-chat/qml/MyMenu.qml, and gpt4all-chat/qml/MyMenuItem.qml.

Key points:

  • Updated theme colors for menus in gpt4all-chat/qml/ChatView.qml, gpt4all-chat/qml/MyMenu.qml, and gpt4all-chat/qml/MyMenuItem.qml.
  • Introduced new color properties in gpt4all-chat/qml/Theme.qml:
    • chatViewModelListFrameColor
    • chatViewModelListBgColor
    • chatViewModelListHighlightColor
    • contextMenuFrameColor
    • contextMenuBgColor
    • contextMenuHighlightColor
  • Applied new color properties to relevant UI components for a softer look while maintaining the current scheme.

Generated with ❤️ by ellipsis.dev

Signed-off-by: 3simplex <10260755+3Simplex@users.noreply.github.com>
Signed-off-by: 3simplex <10260755+3Simplex@users.noreply.github.com>
Copy link
Collaborator

@manyoso manyoso left a comment

Choose a reason for hiding this comment

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

Maybe you can combine into these three colors and then use them in the model combobox in ChatView.qml, the context menus, AND the popup in MyComboBox?

@@ -1164,6 +1164,50 @@ QtObject {
}
}

property color chatViewModelListFrameColor: {
Copy link
Collaborator

Choose a reason for hiding this comment

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

Maybe this could just be MenuFrameColor ?

}
}

property color chatViewModelListBgColor: {
Copy link
Collaborator

Choose a reason for hiding this comment

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

MenuBackgroundColor?

gpt4all-chat/qml/Theme.qml Outdated Show resolved Hide resolved
Signed-off-by: 3simplex <10260755+3Simplex@users.noreply.github.com>
Signed-off-by: 3simplex <10260755+3Simplex@users.noreply.github.com>
@3Simplex
Copy link
Collaborator Author

3Simplex commented Jul 8, 2024

The background within the settings menu has been reverted to its original state. (no more big box behind the settings)

@manyoso
Copy link
Collaborator

manyoso commented Jul 9, 2024

This is fine by me, but asking our design guy Vincent to have a look to sign off or suggest another workaround

Signed-off-by: 3simplex <10260755+3Simplex@users.noreply.github.com>
@3Simplex
Copy link
Collaborator Author

3Simplex commented Jul 9, 2024

Worked directly with Vincent, updated code for requested changes.

  • Colors for border modified, waiting on final color suggestion/approval for "Dark" mode. (The last approval required?)
  • Frame removed, replaced with border. (per Vincent)
  • Radius applied to selected menu items. (per Vincent)
  • Width of selected menu items adjusted to fit within menus, (No longer cuts off on right due to "clip: true")
  • Removed the "rectangle" I added around the "Application Settings" (per Vincent)
  • Found and connected the last remaining menu that was not included adhering to the new style. (ModelSettings Selection)

Signed-off-by: 3simplex <10260755+3Simplex@users.noreply.github.com>
@3Simplex
Copy link
Collaborator Author

3Simplex commented Jul 9, 2024

All menus now follow these themes.

"Dark" Awaiting final approval of Vincent. (Waiting...)
Screenshot 2024-07-09 174825

"Light" Awaiting final approval of Vincent (This looks darker/better in the app.)
Screenshot 2024-07-09 174815

"LegacyDark" Approved by Vincent (Unless he changed his mind.)
Screenshot 2024-07-09 174806

Signed-off-by: 3simplex <10260755+3Simplex@users.noreply.github.com>
Signed-off-by: 3simplex <10260755+3Simplex@users.noreply.github.com>
@3Simplex
Copy link
Collaborator Author

Included fix for server text color in chatview. (tested)
Screenshot 2024-07-09 203927
Screenshot 2024-07-09 204729
Other text is unaffected as expected.
Screenshot 2024-07-09 204950

@giardiv
Copy link

giardiv commented Jul 10, 2024

Thank you @3Simplex !! Really cool work

@manyoso manyoso merged commit 7340bf8 into nomic-ai:main Jul 10, 2024
1 check passed
@3Simplex 3Simplex deleted the colorizeMenus branch July 10, 2024 17:15
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants