readme: add tips to customize current active theme

This commit is contained in:
leo 2024-06-13 17:08:38 +08:00
parent d9e17b96f2
commit b77ed6520c
No known key found for this signature in database
GPG key ID: B528468E49CD0E58
3 changed files with 51 additions and 10 deletions

View file

@ -9,6 +9,7 @@ Opensource Git GUI client.
* Fast
* English/简体中文/繁體中文
* Built-in light/dark themes
* Customize theme
* Visual commit graph
* Supports SSH access with each remote
* GIT commands with GUI
@ -24,6 +25,8 @@ Opensource Git GUI client.
* File histories
* Blame
* Revision Diffs
* Branch Diff
* Image Diff
* GitFlow support
> **Linux** only tested on **Ubuntu 22.04** on **X11**.
@ -87,6 +90,47 @@ This app supports open repository in external tools listed in the table below.
![Theme Light](./screenshots/theme_light.png)
## How to Customize Theme
1. Create a new json file, and provide your favorite colors with follow keys:
| Key | Description |
| --- | --- |
| Color.Window | Window background color |
| Color.TitleBar | Title bar background color |
| Color.ToolBar | Tool bar background color |
| Color.Popup | Popup panel background color |
| Color.Contents | Background color used in inputs, data grids, file content viewer, change lists, text diff viewer, etc. |
| Color.Badage | Badage background color |
| Color.Conflict | Conflict panel background color |
| Color.ConflictForeground | Conflict panel foreground color |
| Color.Border0 | Border color used in some controls, like Window, Tab, Toolbar, etc. |
| Color.Border1 | Border color used in inputs, like TextBox, ComboBox, etc. |
| Color.Border2 | Border color used in visual lines, like seperators, Rectange, etc. |
| Color.FlatButton.Background | Flat button background color, like `Cancel`, `Commit & Push` button |
| Color.FlatButton.BackgroundHovered | Flat button background color when hovered, like `Cancel` button |
| Color.FlatButton.PrimaryBackground | Primary flat button background color, like `Ok`, `Commit` button |
| Color.FlatButton.PrimaryBackgroundHovered | Primary flat button background color when hovered, like `Ok`, `Commit` button |
| Color.FG1 | Primary foreground color for all text elements |
| Color.FG2 | Secondary foreground color for all text elements |
| Color.Diff.EmptyBG | Background color used in empty lines in diff viewer |
| Color.Diff.AddedBG | Background color used in added lines in diff viewer |
| Color.Diff.DeletedBG | Background color used in deleted lines in diff viewer |
| Color.Diff.AddedHighlight | Background color used for changed words in added lines in diff viewer |
| Color.Diff.DeletedHighlight | Background color used for changed words in deleted lines in diff viewer |
For example:
```json
{
"Color.Window": "#FFFF6059"
}
```
2. Open `Preference` -> `Appearance`, choose the json file you just created in `Custom Color Schema`.
> **NOTE**: The `Custom Color Schema` will override the colors with same keys in current active theme.
## Contributing
Thanks to all the people who contribute.