Gitkraken

[davi19]

Link to repository

https://github.com/davi19/gitkraken

Screenshots

Catppuccin Frappé

Catppuccin Macchiato

Catppuccin Latté

Catppuccin Mocha

Any additional comments?

The pallet i used was:

      "current__line": "#dd7878", // Flamingo
      "background": "#eff1f5", // Base
      "foreground": "#4c4f69", // Text
      "comment": "#209fb5", // Sapphire
      "pink": "#ea76cb", // Pink
      "red": "#d20f39", // Red
      "orange": "#fe640b", // Peach
      "yellow": "#df8e1d", // Yellow
      "green": "#40a02b", // Green
      "purple": "#8839ef", // Mauve
      "cyan": "#179299", // Teal

Submission Guidelines

• I have read and followed Catppuccin's submission guidelines.

[nullishamy]

https://github.com/davi19/Catppuccin-Gitkraken-Theme/blob/main/README.md?plain=1#L4 Typo of "GitKraken".

https://github.com/davi19/Catppuccin-Gitkraken-Theme/blob/main/README.md?plain=1#L34 Missing "Thanks to" section here, not sure if it is required though.

https://github.com/davi19/Catppuccin-Gitkraken-Theme/blob/main/README.md?plain=1#L11 is this always the same, regardless of a setting / user preference?

[davi19]

@nullishamy Thanks for reply, i added the thanks to section, fix the name and added a better description of usage

[davi19]

@sgoudham i fixed the requests.

[sgoudham]

Hey @davi19, apologies for the wait on this. I've frankly not found the motivation to review ports in the free time that I have.

I have a few comments regarding the theme and the repository:

Repository

1. I don't believe the catppuccin/template repository has been used for the creation of this repository, please follow the steps outlined in the port creation document and use the README given.

2. In the first step of the README, you showcase the path for Windows. Thankfully, GitKraken have an installation page which highlights the installation paths. Could you please update this step to something like the following:

   1. Navigate to the `.gitkraken` themes folder, here are the default locations for each platform:
   	- Linux & MacOS: `~/.gitkraken/themes`
   	- Windows: `C:\Users\{user}\AppData\Roaming\.gitkraken\themes`

   This also removes the need for step 2.

3. We should follow the default naming convention for themes, e.g. dark.jsonc-default - I'd prefer if the themes were just named catppuccin-{flavour}.jsonc

Theme

1. The overall theme, while looks nice, doesn't fully adhere to the style guidelines / conventions that other applications use. For most, if not all, applications that are themed, the background is set to base and any sidebars/secondary panels are either mantle or crust.

   Given the screenshot below:

   GitKraken - Mocha
   

   It would be good to keep the background as base but convert the sidebars to mantle and the top/bottom bars to crust. Note that this also applies to the preferences screen where the left sidebar should be mantle. My reference point is our VSCode theme, also shown below:

   VSCode - Mocha
   

2. In the implementation for Latte, the git log background should be set to base and sidebars to mantle as discussed in the previous bullet point.

3. I can see that we're using functions such as lighten and fade a fair amount in the code to generate different shades. However, I think these are somewhat overused and leads to some sections of the theme not representing Catppuccin. I think implementing the previous bullet point will reduce this, and of course I understand that there are many keys to be themed so it definitely makes sense for things like hover states. That being said, I would appreciate if you could go through each key and see if there are existing palette colours that can be used without modification and/or bring the modified colours closer to the palette colours.

That's all from me, and apologies again for taking a while to properly review this.

[backwardspy]

hey @davi19, just checking in to see where we're at. with hammy's suggestions above implemented we'd be very happy to get this port transferred into the org.

let me know if you're still interested!

[davi19]

Hi, I'm still interested in continuing with the port. I should be able to adjust it again this week.

[backwardspy]

thanks for the update, that's great news! no rush of course, just wanted to see if we should keep this issue open. :)

[davi19]

@sgoudham Hi, can you validate if the repository is up to standard ? https://github.com/davi19/gitkraken

The images i will change when I make the changes you requested.

[davi19]

@sgoudham i'm adjusted some colors but somes fades and lighten is necessary. Like the buttons. In images below its without fade, then buttons has strong color.

[sgoudham]

Thanks for taking the time to update the port @davi19

I believe @backwardspy would be interested in trying out the theme again to see if it better matches our other applications.

One comment about the repository, the assets directory is for the preview images so would be great if you could move the catppuccin-flavour.jsonc files into the root of the repository or under a themes directory.

[davi19]

@backwardspy when you go test use the mocha theme. The others im go change when the design of mocha its ok for you. Thanks

[backwardspy]

hey @davi19 thanks for the update. i think it looks pretty good now! the only comment i've come up with is some of the background-coloured elements are a little hard to read in some cases:

it might be worth further darkening those colours, or using a dark text colour instead.

vscode for example does this:

otherwise it looks great - once you're happy with the tweaks i've mentioned then please feel free to get started on the other variants!

[davi19]

Thanks for reply. I'm go change this elements for a dark color. And after this im go make The other flavors

[nicolas-goudry]

This looks neat! Thanks for the work @davi19 🙂

I found the following issues using the mocha variant (some of them have already been reported):

• the « Amend » checkbox is still using the default blue color, as well as all checkbox in the settings menu
• green buttons (« Stage all changes », « Stage files/changes to commit », « Amend Previous Commit ») are very hard to read (disabled or not)
• the selected item in the left sidebar (eg. the current branch) is also very hard to read
• the « New » badge next to the « Workspaces » section of the new tabs is also very hard to read
• the highlight box around selected profile icon is using the default blue color
• the text fields in the profile edit window have the same background as the window
• (not sure about this one, just feels weird) the « Cancel » button of the profile edit window has a yellow-ish color when focused
• purple buttons (like in the SSH settings section when local agent is selected or in the terminal settings section) are a bit hard to read (disabled or not)

[davi19]

@nicolas-goudry thanks for the feedback. I'm go fix this errors in this week.

[nicolas-goudry]

I also just noticed that the buttons on the « New tab » tab have the same background as the window background.

[nicolas-goudry]

Sorry for the spam-ish comments, I noticed that GitKraken is complaining of some errors in the theme file, but somehow manages to load it.

{
  // ...
  "themeValues": {
    // values applied to the entire app
    "root": {
      // ...
      "crust": "#11111b" // missing comma
      // ...
      "filter-match": @purple", // missing dcol
      // ...
    },
    // ...
  }
}

[davi19]

Thanks for the help catching this bugs. I will solve these issues, more quickly than i can.