Theme list | superfile

[giscus[bot]]

Theme list | superfile

List themes currently owned by superfile

https://superfile.netlify.app/list/theme-list/

[xplosionmind]

Hey @yorukot, thank you so much for creating superfile, I absolutely love it!

I use my terminal both with the light and the dark theme. Is there any “dynamic” theme that supports both? I would like superfile to be light when my terminal theme is light, and to be dark when my terminal theme is dark.

Even better, I think the ability to specify a light theme and a dark theme preference would be super useful!

[yorukot]

Nope, you can't do that now. :/
But I do want to make a key to choose between themes!

[Kemboiray]

Can I change the color of the folder icon?

[lazysegtree]

@Kemboiray
Not supported yet.
@yorukot I think we can add a folder icon color variable in theme.toml and allow users to customize that. For now its like this

src/config/icon/icon.go

var Folders = map[string]IconStyle{
	".atom":                 {Icon: "\ue764", Color: "#66595c"}, // Atom folder - Dark gray
	".aws":                  {Icon: "\ue7ad", Color: "#ff9900"}, // AWS folder - Orange
	".docker":               {Icon: "\ue7b0", Color: "#0db7ed"}, // Docker folder - Blue
	".gem":                  {Icon: "\ue21e", Color: "#e9573f"}, // Gem folder - Red
	".git":                  {Icon: "\ue5fb", Color: "#f14e32"}, // Git folder - Red
	".git-credential-cache": {Icon: "\ue5fb", Color: "#f14e32"}, // Git credential cache folder - Red
	".github":               {Icon: "\ue5fd", Color: "#000000"}, // GitHub folder - Black
	".npm":                  {Icon: "\ue5fa", Color: "#cb3837"}, // npm folder - Red
	".nvm":                  {Icon: "\ue718", Color: "#cb3837"}, // nvm folder - Red
	".rvm":                  {Icon: "\ue21e", Color: "#e9573f"}, // rvm folder - Red
	".Trash":                {Icon: "\uf1f8", Color: "#7f8c8d"}, // Trash folder - Light gray
	".vscode":               {Icon: "\ue70c", Color: "#007acc"}, // VSCode folder - Blue
	".vim":                  {Icon: "\ue62b", Color: "#019833"}, // Vim folder - Green
	"config":                {Icon: "\ue5fc", Color: "#ffb86c"}, // Config folder - Light orange
	"folder":                {Icon: "", Color: "NONE"},         // Generic folder - Dark yellowish
	"hidden":                {Icon: "\uf023", Color: "#75715e"}, // Hidden folder - Dark yellowish
	"node_modules":          {Icon: "\ue5fa", Color: "#cb3837"}, // Node modules folder - Red

	"superfile": {Icon: "󰚝", Color: "#FF6F00"},
}

We can replace color NONE with a variable coming from theme.toml file.

[yorukot]

Yes that's a good idea, i think we can do that

[lazysegtree]

#685

[Kemboiray]

I've never written Go but I hard coded the color in icon.go and rebuilt the program. I figure it won't be hard to make the setting configurable.

[highonskooma]

Just thought I would swing by and share a pywal custom template file I made. This allows superfile to have a theme that matches the wallpaper every time. I pair with a script that I use to select a random wallpaper, and most of my CLI apps have the same theme. Very handy if you use pywal and like a coordinated colorscheme across the system.

just place it into ~/.config/wal/templates

# Generated by pywal
# Superfile Theme

# ========= Border =========
file_panel_border = '{color8}'
sidebar_border = '{background}'
footer_border = '{color8}'

# ========= Border Active =========
file_panel_border_active = '{color4}'
sidebar_border_active = '{color1}'
footer_border_active = '{color2}'
modal_border_active = '{color7}'

# ========= Background (bg) =========
full_screen_bg = '{background}'
file_panel_bg = '{background}'
sidebar_bg = '{background}'
footer_bg = '{background}'
modal_bg = '{background}'

# ========= Foreground (fg) =========
full_screen_fg = '{foreground}'
file_panel_fg = '{foreground}'
sidebar_fg = '{foreground}'
footer_fg = '{foreground}'
modal_fg = '{foreground}'

# ========= Special Color =========
cursor = '{cursor}'
correct = '{color2}'
error = '{color1}'
hint = '{color4}'
cancel = '{color5}'
gradient_color = ['{color4}', "{{color6}}"]

# ========= File Panel Special Items =========
file_panel_top_directory_icon = '{color2}'
file_panel_top_path = '{color4}'
file_panel_item_selected_fg = '{color4}'
file_panel_item_selected_bg = '{background}'

# ========= Sidebar Special Items =========
sidebar_title = '{color4}'
sidebar_item_selected_fg = '{color4}'
sidebar_item_selected_bg = '{background}'
sidebar_divider = '{color7}'

# ========= Modal Special Items =========
modal_cancel_fg = "#383838"
modal_cancel_bg = '{color5}'
modal_confirm_fg = "#383838"
modal_confirm_bg = '{color6}'

Love the project!! Keep it up @yorukot

[highonskooma]

@Shykid002 to integrate this on superfile we would probably need to add wal as an optional dependency, and copy the .toml file gereated by wal to ~/.config/superfile/theme. The way I see it we could generate the wal template when superfile loads and copy it from ~/.cache/wal, but it's always better when this is triggered by wallpaper change instead of each boot of superfile, imho.

[Shykid002]

then how can we integrate it in superfile?

[highonskooma]

#186 (comment)