Atom: Change color of icons to contrast with git statuses

Created on 24 Apr 2016  Â·  33Comments  Â·  Source: file-icons/atom

When I have .json files in with some files that are modified in git, the modified files and the json file icon are the same color.

How hard would it be to change this?

enhancement

All 33 comments

Not really hard. Just a simple matter of refining the colour that's applied to modified files that use the .medium-yellow swatch.

The question becomes whether we should use a darker or lighter shade of orange to represent these particular files, though.

I was asking for your thoughts on the matter, my good sir. ;-)

I think the majority of people use dark themes, so I think lighter.

On Sun, Apr 24, 2016 at 3:38 PM John Gardner [email protected]
wrote:

Not really hard. Just a simple matter of refining the colour that's
applied to modified files that use the .medium-yellow swatch.

The question becomes whether we should use a darker or lighter shade of
orange to represent these particular files, though.

—
You are receiving this because you authored the thread.
Reply to this email directly or view it on GitHub
https://github.com/DanBrooker/file-icons/issues/341#issuecomment-214026308

Alright, shall do.

FYI, v2 should make adjusting colours a _hell_ of a lot easier.

Ok. I don't have a strong opinion

On Tue, May 3, 2016 at 2:55 PM John Gardner [email protected]
wrote:

Eh, lightening an already light colour isn't really noticeable (even in a
dark theme)... using a darker shade might be the way to go, actually.

—
You are receiving this because you authored the thread.
Reply to this email directly or view it on GitHub
https://github.com/DanBrooker/file-icons/issues/341#issuecomment-216629432

Done, mate. =) Will be included in the next release.

Thanks :)

On Tue, May 3, 2016 at 3:31 PM John Gardner [email protected]
wrote:

Done, mate. =) Will be included in the next release.

—
You are receiving this because you authored the thread.
Reply to this email directly or view it on GitHub
https://github.com/DanBrooker/file-icons/issues/341#issuecomment-216639946

@Alhadis this shifts the color of icons that haven't been changed for me. As soon as I edited one file, every single file in the folder shifted to a light yellow.

Could you take a screenshot of the tree view, please?

The only file that changed is types.js yet everything is yellow. eslintrc.json for example was a light purple previously.

screen shot 2016-05-06 at 10 18 20 am

CRIPES, that's bad. I forgot about folders being marked as modified too... /facepalm

Okay, fixing immediately. Will push out a hotfix.

@Alhadis no worries. Thanks for the quick responses!

@AriaFallah, I can't reproduce this. Can you open the developer tools and inspect one of the wrongly-highlighted files, please? Tell me if the containing <li> node has the status-modified class added.

If not, it might have something to do with the theme's styling (or a line in your user stylesheet). If not, it might be another package at fault - could you give me a list of what you currently have installed?

I've tried all permutations of this package's options, and none of them are reproducing the error.

Scratch that...something weird is going on.


@Alhadis These are the responsible css selectors it seems

.list-tree li:not(.list-nested-item).status-modified
li.file.entry.list-item.selected

That's not coming from this package, then. There isn't even a line that contains list-nested-item in this package's CSS.

@Alhadis yeah I need to figure out what's wrong actually. Something weird is happening in the repo right now. Every file I select is shown as modified, but then shows up as not modified when I select another file.

Tell me what themes you're using, and what packages are installed. I'll help you find the catalyst.

@Alhadis alright after doing some more inspection I think the problem is that I didn't show you the full picture.

The modified folder is part of a larger folder. If that larger folder is the root folder then the problem occurs, but if I just open the project with the structure I screenshotted as root then the problem doesn't occur. So I think it's root directory related.

Also I gave you the wrong selector before. According to the dev tools this is the responsible selector:

.status-modified .file-icons-tab-pane-icon atom-pane .tab-bar .tab .title[data-path][data-name$=".json"]:before,
.status-modified .icon-file-text[data-name$=".json"]:before,
.status-modified .icon-file-binary[data-name$=".json"]:before,
.status-modified .theme-flatland-dark-ui .icon-file-text[data-name$=".json"]:before,
.status-modified .theme-flatland-dark-ui .icon-book[data-name$=".json"]:before

Also if it's theme related I'm using, which I don't think is the case, I'm using One Dark for UI and Base16 Tomorrow Dark for syntax.

Files are only marked as modified or new if the project's root folder is a Git repository, yes. I'll have a look.

What about the list of packages you have installed? Can you run apm list in your terminal and show me the output?

Hint: If you're on Mac OS, you can save yourself selecting the output by running apm list | pbcopy instead.

When I changed the root directory, the problem only happened in src:

screen shot 2016-05-06 at 10 46 37 am

apm list

@Alhadis apm list

Does this still happen if you disable every package _except_ for File Icons?

If so, it's definitely related. If not, you can reactivate them one-by-one until you trigger it...

This is really puzzling though, and it's kinda frustrating that I can't reproduce it... :S

@Alhadis I disabled everything including atom's own packages (including settings-view 😅) ...still not solved.

For me the steps to reproduce are this:

  1. Open a project under git version control.
  2. Modify a file in a folder not at the root level.

Oh _derp_, I know what it is. It's this, which was indeed added to fix this issue.

I've said it before, but I'll say it again: fuck precompilers, fuck Less, fuck Sass, and fuck all that bullshit for introducing problems like these that shouldn't have to exist.

Fixing now. Sorry to make you jump all those hurdles. :(

The reason I couldn't reproduce the error, of course, was that I was modifying files that weren't using the .medium-yellow colour swatch.

Wait, I spoke too soon (but still stand by my hatred of precompilers). Modifying a .js file doesn't help either, but I still suspect the issue is related (since that's all it _could_ be, really). Does this still happen if you modify, say, a .css file?

And there's nothing in your user stylesheet that might be triggering this?

@Alhadis nope. I tried txt and json, but no luck.

Also the problem has to be in v1.7.9 because reverting to v1.7.8 fixed it.

Could you file a new issue for this, please? I just noticed how long this thread's gotten...

352

@The-Penultimate-Defenestrator Just letting you know we've had to revert this; the colour-correction will have to wait until v2, because there's no way of doing this without raising these weird edge cases.

Ok. It's fine. Thanks.

On Fri, May 6, 2016 at 9:17 PM John Gardner [email protected]
wrote:

@The-Penultimate-Defenestrator
https://github.com/The-Penultimate-Defenestrator Just letting you know
we've had to revert this; the colour-correction will have to wait until v2,
because there's no way of doing this without raising these weird edge cases.

—
You are receiving this because you were mentioned.

Reply to this email directly or view it on GitHub
https://github.com/DanBrooker/file-icons/issues/341#issuecomment-217596213

Was this page helpful?
0 / 5 - 0 ratings

Related issues

UziTech picture UziTech  Â·  3Comments

libbyschuknight picture libbyschuknight  Â·  9Comments

gperdomor picture gperdomor  Â·  3Comments

daltones picture daltones  Â·  3Comments

fepegar picture fepegar  Â·  4Comments