Donate your skin!

[Canop]

I'd like to have a list of skins to propose to users.

So if you have a skin you find good (a complete one, not just two colors changed), please answer this issue with the toml and a screenshot (or several ones).

[0xd3e]

I'm nearly done with a skin matching the solarized dark color scheme. The last two things that are left is status_code and status_ellipsis. I'm not sure what this is used for so I cannot test it.

[0xd3e]

This is the current status.

Default view

File search

Permissions

Sizes

[Canop]

The status line is the one where you have the "Hit esc to go back..." text.

[Canop]

@DanielTrautmann You made a pretty skin!
The red isn't really pretty but we don't see it often

[0xd3e]

Well the red is the one that is specified by the solarized color scheme, so I used it. But I agree it doesn't look that good in this context.

I will add the remaining things tomorrow. After that I can share the skin.

I used the RGB values since iTerm2 on Mac works well with that and I'm not familiar with these ANSI color codes and termcolor didn't seem to work.

[Canop]

You can find the 8bits ANSI colors here: https://en.wikipedia.org/wiki/ANSI_escape_code

They're compatible with more terminals but are so limited it's hard to do anything pretty.

It's OK to make a less compatible skin, we just have to tell it.

[0xd3e]

Okay I've finished the work on the solarized dark skin. Using ANSI colors was not possible. The colors didn't match at all. My terminal (iTerm2) is configured to use the Solarized Dark color preset and I thought if I use the ANSI code, it would match the one from the terminal, but this is not the case at it seems.

However, the RGB version works. I also changed the error color from red to orange, which looks a bit better. For file_error I also made it italic to indicate the error a bit more.

How would you like the skin to be shared?

[Canop]

How would you like the skin to be shared?

I thought about posting it on https://dystroy.org/broot as text with pictures. If you have a better idea, it would be welcome.

[0xd3e]

Done. See #213

[olanod]

Maybe is possible to generate automatically skins based on the base16 themes?

[asdf8dfafjk]

Well the red is the one that is specified by the solarized color scheme, so I used it. But I agree it doesn't look that good in this context.

I will add the remaining things tomorrow. After that I can share the skin.

I used the RGB values since iTerm2 on Mac works well with that and I'm not familiar with these ANSI color codes and termcolor didn't seem to work.

You can find the 8bits ANSI colors here: https://en.wikipedia.org/wiki/ANSI_escape_code

They're compatible with more terminals but are so limited it's hard to do anything pretty.

It's OK to make a less compatible skin, we just have to tell it.

Most modern terminals have (or should have in my humble opinion) COLORTERM set to truecolor. Thus RGB does (should...) work fine. Bring on the RGB! Both Termite and Alacritty are truecolor.

[Canop]

Writing a terminal application makes you realize most terminals in use have very very low capabilities. RGB can't be the default.

But I'm very OK with

• having a fine RGB skin that needs just uncomenting in the conf.toml file
• having a few other ones shared on https://dystroy.org/broot/skins/

I'd welcome beautiful complete skins.

[asdf8dfafjk]

As someone having had a nightmare from a previous curses application, bad enough to never attempt one again, I agree. That said, It so happens that most terminals just use libvte. And https://gist.github.com/XVilka/8346728 tells me that libvte supports truecolor. Figured I should note if it helps you make decisions.

[Canop]

I'm not sure of what you're suggesting. Is it to have a RGB skin used by default when possible ?

[asdf8dfafjk]

I'm saying that most terminals do actually understand RGB code fine, (See the list- gnome-terminal, xfce4-terminal, konsole are probably the 3 most popular terminal emulators and all 3 support RGB. (IMHO your target audience is likely to be using Termite and Alacritty, both of which support RGB too.

So if you're wiilling to forgot supporting a few users, a lot of users might see beautiful skins 👍

[Canop]

But you can already use RGB skins, there's no need to drop users for that (who are far from "a few").

[KYTAZ0]

Hey, having such limited skin options when it comes to theming is a bit off-putting and one should have the luxury of time to invest into translating their color schemes into broot's configuration.

Its a common pattern to have a base16 colorscheme as your primary and manage the looks in multiple targets at the same time. In case you're not familiar, you can build a mustache template and produce a colorscheme in the broot format from a base16 scheme.

You can have a look at the main base16 repository which describes and contains both color schemes as well as templates if you'd like to look into some examples.
https://github.com/chriskempson/base16

In few words building a good template can produce a plethora of schemes including those that people are most likely looking for already and give the opportunity for others that run custom schemes adapt broot into their workflow in a blink of an eye.

Couple of ways to manage your configuration
https://github.com/misterio77/flavours
https://github.com/pinpox/base16-universal-manager

[ismay]

I was looking at broots theming, and I think an ANSI theme would be good to add: https://jeffkreeftmeijer.com/vim-16-color/. It's usually the default for shell tooling and allows the application to adapt automatically to the terminal's theme.

I use that approach, that way you don't have to faff around with setting a matching theme for each terminal app. You just set a theme for your terminal emulator and you're done.

It doesn't seem like broot currently ships with such a theme, not for syntax or for broot itself. Is that correct?

[Canop]

It doesn't seem like broot currently ships with such a theme, not for syntax or for broot itself. Is that correct?

Yes it's correct. Such a theme isn't trivially done if you want it to render pleasantly whatever the displayed data.
You're welcome to build one, of course. Please check all screens, and all possible columns.

[ismay]

I've taken a look at it. Whilst I wouldn't be opposed to creating and submitting an 8 bit ANSI theme, it seems like https://github.com/trishume/syntect doesn't have a theme that restricts itself to 8 bit ANSI. So whilst broot would then look good, the syntect syntax highlighting would still be off.

It's too bad really, because I do like the ergonomics and idea behind broot. Let me know if syntect supports it in the future, I might be open to contributing a theme for broot then.

[ismay]

All right, since the preview window doesn't necessarily need to be used, I've put together the start of a 16 color ANSI theme:

Code here:

skin: {
  directory: ansi(12)
  file: ansi(7)
  pruning: ansi(8) none italic
  selected_line: none ansi(0)
  tree: ansi(8)

  # Search
  char_match: ansi(3) none underlined
  parent: ansi(4) none bold

  # File properties
  exe: ansi(2)
  link: ansi(13)

  # Prompt
  input: ansi(6)

  # Status bar
  status_bold: ansi(7) ansi(8) bold
  status_code: ansi(10) ansi(8)
  status_ellipsis: ansi(7) ansi(8)
  status_error: ansi(7) ansi(8)
  status_italic: ansi(7) ansi(8) italic
  status_job: ansi(7) ansi(8)
  status_normal: ansi(7) ansi(8)

  # Flag status
  flag_label: ansi(6)
  flag_value: ansi(14) none bold

  # Background
  default: none none

  # Scrollbar
  scrollbar_track: ansi(0)
  scrollbar_thumb: ansi(3)

  # Git
  git_branch: ansi(13)
  git_deletions: ansi(1)
  git_insertions: ansi(2)
  git_status_conflicted: ansi(1)
  git_status_current: ansi(6)
  git_status_ignored: ansi(8)
  git_status_modified: ansi(3)
  git_status_new: ansi(2) none bold
  git_status_other: ansi(5)

  # Staging area
  staging_area_title: ansi(3)

  # Documentation
  help_bold: ansi(7) none bold
  help_code: ansi(4)
  help_headers: ansi(3)
  help_italic: ansi(7) none italic
  help_paragraph: ansi(7)
  help_table_border: ansi(8)

  # Device column
  device_id_major: ansi(5)
  device_id_minor: ansi(5)
  device_id_sep: ansi(5)

  # Counts column
  count: ansi(13)

  # Dates column
  dates: ansi(6)

  # Permissions column
  group: ansi(3)
  owner: ansi(3)
  perm__: ansi(8)
  perm_r: ansi(3)
  perm_w: ansi(1)
  perm_x: ansi(2)

  # Hex preview
  hex_null: ansi(8)
  hex_ascii_graphic: ansi(2)
  hex_ascii_whitespace: ansi(3)
  hex_ascii_other: ansi(4)
  hex_non_ascii: ansi(5)
}

Note that how good this theme looks depends a lot on how good your terminal theme is. Most are garbage, but, if you have a theme that follows the named colors and has decent contrast this is in my opinion very usable. And, most importantly, will follow your terminal theme automatically.

Also, I've omitted the preview colors from the theme. It seems the background of the preview window can't be set to the terminal background, which means it's not possible to theme it well within the 16 ANSI color space.

[Canop]

Tried it on some of the terminals I use:

My suggestion would be to finish this, call it <name-of-your-choice>-16.hjson then make a PR to have it among default themes

[ismay]

Thanks for the quick feedback. In order to finish this I'd prefer to define colors for these remaining items:

  purpose_bold: <color>
  purpose_ellipsis: <color>
  purpose_italic: <color>
  purpose_normal: <color>
  mode_command_mark: <color>
  content_extract: <color>
  content_match: <color>
  file_error: <color>
  good_to_bad_0: <color>
  good_to_bad_1: <color>
  good_to_bad_2: <color>
  good_to_bad_3: <color>
  good_to_bad_4: <color>
  good_to_bad_5: <color>
  good_to_bad_6: <color>
  good_to_bad_7: <color>
  good_to_bad_8: <color>
  good_to_bad_9: <color>

But I've not been able to find where they're used in the UI. Could you point me to where I can find them?

[Canop]

Hum... A documentation of all skin entries would be welcome but would require some time.

The "purpose" things are used in the status line
The mode_command_mark is for a flag left of the input when using the modal mode.
The contrent_extract and content_mach are very important and are used when searching on content (i.e. with c/)
The file_error is used to display some error messages, for example when you open the preview on a file which is missing
All the good_to_bad entries are for displaying file system occupation (try :fs)

[ismay]

Thanks. I've added the remaining colors (where possible) and created a PR.