Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update some Icons #6993

Closed
wants to merge 1 commit into from
Closed

Conversation

JesterOrNot
Copy link

@JesterOrNot JesterOrNot commented Jan 29, 2020

What it does

#6115
I updated some icons manually

Icons list obtained like so:

cd <theia repo root>
ls `find packages -name '*.svg'`

Icons done:

  • packages/core/src/browser/icons/add-inverse.svg
  • packages/core/src/browser/icons/add.svg
  • packages/core/src/browser/icons/case-sensitive-dark.svg
  • packages/core/src/browser/icons/case-sensitive.svg
  • packages/core/src/browser/icons/circle-bright.svg
  • packages/core/src/browser/icons/circle-dark.svg
  • packages/core/src/browser/icons/close-all-bright.svg
  • packages/core/src/browser/icons/close-all-dark.svg
  • packages/core/src/browser/icons/close-bright.svg
  • packages/core/src/browser/icons/close-dark.svg
  • packages/core/src/browser/icons/CollapseAll_inverse.svg
  • packages/core/src/browser/icons/CollapseAll.svg
  • packages/core/src/browser/icons/edit-json-dark.svg
  • packages/core/src/browser/icons/edit-json.svg
  • packages/core/src/browser/icons/open-change-bright.svg
  • packages/core/src/browser/icons/open-change-dark.svg
  • packages/core/src/browser/icons/open-file-bright.svg
  • packages/core/src/browser/icons/open-file-dark.svg
  • packages/core/src/browser/icons/preview-bright.svg
  • packages/core/src/browser/icons/preview-dark.svg
  • packages/core/src/browser/icons/Refresh_inverse.svg
  • packages/core/src/browser/icons/Refresh.svg
  • packages/core/src/browser/icons/regex-dark.svg
  • packages/core/src/browser/icons/regex.svg
  • packages/core/src/browser/icons/replace-all-inverse.svg
  • packages/core/src/browser/icons/replace-all.svg
  • packages/core/src/browser/icons/replace-inverse.svg
  • packages/core/src/browser/icons/replace.svg
  • packages/core/src/browser/icons/whole-word-dark.svg
  • packages/core/src/browser/icons/whole-word.svg
  • packages/debug/src/browser/style/breakpoint-conditional.svg
  • packages/debug/src/browser/style/breakpoint-conditional-unverified.svg
  • packages/debug/src/browser/style/configure-inverse.svg
  • packages/debug/src/browser/style/configure.svg
  • packages/debug/src/browser/style/continue.svg
  • packages/debug/src/browser/style/debug-dark.svg
  • packages/debug/src/browser/style/pause-inverse.svg
  • packages/debug/src/browser/style/pause.svg
  • packages/debug/src/browser/style/repl-inverse.svg
  • packages/debug/src/browser/style/repl.svg
  • packages/debug/src/browser/style/restart-inverse.svg
  • packages/debug/src/browser/style/restart.svg
  • packages/debug/src/browser/style/stackframe-and-breakpoint.svg
  • packages/debug/src/browser/style/stackframe-arrow.svg
  • packages/debug/src/browser/style/start-inverse.svg
  • packages/debug/src/browser/style/start.svg
  • packages/debug/src/browser/style/step-into-inverse.svg
  • packages/debug/src/browser/style/step-into.svg
  • packages/debug/src/browser/style/step-out-inverse.svg
  • packages/debug/src/browser/style/step-out.svg
  • packages/debug/src/browser/style/step-over-inverse.svg
  • packages/debug/src/browser/style/step-over.svg
  • packages/debug/src/browser/style/stop-inverse.svg
  • packages/debug/src/browser/style/stop.svg
  • packages/git/src/browser/style/git-diff.svg
  • packages/git/src/browser/style/git.svg
  • packages/mini-browser/src/browser/style/mini-browser.svg
  • packages/monaco/src/browser/style/symbol-sprite.svg
  • packages/navigator/src/browser/style/files.svg
  • packages/plugin-ext/src/main/browser/style/test.svg
  • packages/scm/src/browser/style/scm.svg
  • packages/search-in-workspace/src/browser/styles/search.svg
  • packages/task/src/browser/style/configure-inverse.svg
  • packages/task/src/browser/style/configure.svg
  • packages/debug/src/browser/style/breakpoint-log-disabled.svg
  • packages/debug/src/browser/style/breakpoint-log.svg
  • packages/debug/src/browser/style/breakpoint-log-unverified.svg

Icons TODO:

  • packages/core/src/browser/icons/clear-search-results-dark.svg
  • packages/core/src/browser/icons/clear-search-results.svg
  • packages/core/src/browser/icons/collapse.svg
  • packages/core/src/browser/icons/remove-all-inverse.svg
  • packages/core/src/browser/icons/remove-all.svg
  • packages/debug/src/browser/style/breakpoint-conditional-disabled.svg
  • packages/debug/src/browser/style/breakpoint-disabled.svg
  • packages/debug/src/browser/style/breakpoint-function-disabled.svg
  • packages/debug/src/browser/style/breakpoint-function.svg
  • packages/debug/src/browser/style/breakpoint-function-unverified.svg
  • packages/debug/src/browser/style/breakpoint-hint.svg
  • packages/debug/src/browser/style/breakpoints-activate-inverse.svg
  • packages/debug/src/browser/style/breakpoints-activate.svg
  • packages/debug/src/browser/style/breakpoint.svg
  • packages/debug/src/browser/style/breakpoint-unsupported.svg
  • packages/debug/src/browser/style/breakpoint-unverified.svg
  • packages/debug/src/browser/style/continue-inverse.svg
  • packages/debug/src/browser/style/current-and-breakpoint.svg
  • packages/debug/src/browser/style/current-arrow.svg
  • packages/core/src/browser/icons/expand.svg

Icons Not Applicable (not from VS Code):

  • [ ]

How to test

Check the new icons out!

Review checklist

Reminder for reviewers

Sean Hellum seanhellum45@gmail.com

@akosyakov
Copy link
Member

@JesterOrNot please squash in one commit, there is no many changes to keep them separate

@vince-fugnitto i am not sure whether we need a CQ for it, we should check it

@akosyakov akosyakov added the theming issues related to theming label Jan 29, 2020
@akosyakov
Copy link
Member

it should not close the original issue, the proper fix should consume icons from monaco or from vscode icons and provide easy way to catch up. But let's accept a PR as a temporary measure.

@JesterOrNot
Copy link
Author

Rebased!

@akosyakov
Copy link
Member

@JesterOrNot thank you by not commit message is not informative, you could do commit amend to edit last commit message

Copy link
Member

@vince-fugnitto vince-fugnitto left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't think we should only update only subset of icons while not updating others as it will make the application look inconsistent. There are a few icons omitted by the pull-request which are noticeable now compared to those that are updated.

I think we should perhaps register a cq for the entire vscode-icons repo so we can consume them without worry? @marcdumais-work

@marcdumais-work
Copy link
Contributor

I think we should perhaps register a cq for the entire vscode-icons repo so we can consume them without worry? @marcdumais-work

+1 . That's what we did previously I think: https://dev.eclipse.org/ipzilla/show_bug.cgi?id=20694

Do we know which version of the vscode-icons repo this PR consumes? The previously approved CQ above covers version SHA 9c90ce81b1f3c309000b80da0763aa09975a85f0, dating to August 2019 (there are no releases that I can see in the repo).

Assuming the updated icons were not in that version, we'll need a new CQ and need to mention which SHA version it corresponds-to.

@vince-fugnitto
Copy link
Member

Do we know which version of the vscode-icons repo this PR consumes? The previously approved CQ above covers version SHA 9c90ce81b1f3c309000b80da0763aa09975a85f0, dating to August 2019 (there are no releases that I can see in the repo).

I don't think we ever consumed from the vscode-icons repo but instead we consumed the icons directly from vscode. They have recently made a standalone repo with all their new icons. #6115

@marcdumais-work
Copy link
Contributor

it should not close the original issue, the proper fix should consume icons from monaco or from vscode icons and provide easy way to catch up. But let's accept a PR as a temporary measure.

I do not see any clue that this repo is meant to be packaged or how it's consumed outside Theia. I wonder if we could do something similar to what Anton did for the built-ins: create a repo that wraps-around vscode-icons (pulls it as a git submodule), and that adds infrastructure to package the icons as a npm module and also provides some type of "icon service" that Theia extensions could use to obtain these icons by name?

With something like that we would no longer need "Type B" CQs when we update the icons, I think, since we would no longer copying them to our repo. The new dependency we consume would only be checked, using the "self-check", to confirm license compliance, whenever we step the dependency version.

@marcdumais-work
Copy link
Contributor

marcdumais-work commented Jan 29, 2020

I don't think we ever consumed from the vscode-icons repo but instead we consumed the icons directly from vscode.

The CQ above links to that repo. You're right that before we used to pull icons directly from the main vscode repo.

update: not sure we actually did anything with that CQ, but it was registered and approved.

@JesterOrNot
Copy link
Author

Amended!

@vince-fugnitto
Copy link
Member

@JesterOrNot please be sure to sign-off you commit and also sign the Eclipse Contributor Agreement (ECA), they are the reason for the failed check.

Also, can you update your commit message as Anton previously mentioned?
The following does not mean much and should not be included as is:

squash

update files

update debug-stop

update search icon

update debug-continue

update start.svg

update start

fix stop

update

@JesterOrNot
Copy link
Author

How do I signoff commits?

@JesterOrNot
Copy link
Author

I keep re validating but it still consistently fails

@vince-fugnitto
Copy link
Member

How do I signoff commits?

You can: (taken from sign-off)

Then you just add a line to every git commit message:

Signed-off-by: Joe Smith <joe.smith@email.com>
Use your real name (sorry, no pseudonyms or anonymous contributions.)

If you set your user.name and user.email git configs, you can sign your commit automatically with git commit -s.

@JesterOrNot
Copy link
Author

Is this any better?

@vince-fugnitto
Copy link
Member

Is this any better?

The sign-off looks good and the eca passed :)

For the rest, the following #6993 (review) is still a concern along with the licensing aspect mentioned of registering their entire repo during a cq.

@vince-fugnitto vince-fugnitto added the CQ Required (deprecated) issues requiring a CQ (contributor questionnaire) label Jan 29, 2020
@JesterOrNot
Copy link
Author

Is there anything I can do to help resolve this?

@marcdumais-work
Copy link
Contributor

Is there anything I can do to help resolve this?

Where did you copy the icons from (repo and exact version)? We can take care of the CQ once we know.

@vince-fugnitto
Copy link
Member

@JesterOrNot it looks like a previous CQ has been already registered for the repo.

If we stick to using icons at this given commit microsoft/vscode-icons@9c90ce8 we should no longer need a new CQ :) Do you mind updating our icons based on this commit? If we need newer icons (or fixes) then we will need a new CQ (please let us know if it is the case).

@JesterOrNot
Copy link
Author

Sure!

@JesterOrNot
Copy link
Author

Wait! VSCode updated their items again. The ones in that commit are outdated, so if we use them this PR is null as we would still be outdated. What should we do?

@JesterOrNot
Copy link
Author

I am so sorry. I try my best updating them

@JesterOrNot
Copy link
Author

does inverse = light?

@marcdumais-work
Copy link
Contributor

does inverse = light?

I think so, depending if you mean the icon itself or the theme it's meant to be used-with.

From what I can see, the icons are named like so:

Icons used in Dark themes:

  • <something>-dark.svg - e.g.: preview-dark.svg
  • <something>-inverse.svg. e.g.: add-inverse.svg

Icon used in Light themes:

  • <something>.svg. e.g.: add.svg
  • <something>-bright.svg. e.g.: preview-bright.svg

@JesterOrNot
Copy link
Author

What Icon controls that +
image

@marcdumais-work
Copy link
Contributor

What Icon controls that +
image

Investigating a bit it looks to come from Font Awesone: "fa fa-plus"

@marcdumais-work
Copy link
Contributor

image

This one is as well from Font Awesome: "fa fa-undo"

@JesterOrNot
Copy link
Author

Ok, because it seems out of date with the modern VSCode Icon we should mention the font awesome linked icons in the main issue. Also in terms of automation, we could make a theia fork and npmize it and pull request to the main one, we'd probably need another CQ, however, if they don't except the PR we could maintain the fork.

@marcdumais-work
Copy link
Contributor

Ok, because it seems out of date with the modern VSCode Icon we should mention the font awesome linked icons in the main issue.

ok - please do.

Also in terms of automation, we could make a theia fork and npmize it and pull request to the main one, we'd probably need another CQ, however, if they don't except the PR we could maintain the fork.

Are you suggesting proposing updated icons to the Font Awesome project? I assume the corresponding VS Code icons are part of the vscode-icons repo. If so, we could just replace the current icons with these (in current PR or another one)?

Here's what these look-like in VS Code:
image

@JesterOrNot
Copy link
Author

For the second part I meant as the real solution for #6115

Signed-off-by: Sean Hellum <seanhellum45@gmail.com>

This commit updates the icons to match the latest icon sets from VS Code
@vince-fugnitto
Copy link
Member

@JesterOrNot the codicon icons should now be available (thank to the monaco upgrade) so there should no longer be a need to copy the icons directly in the codebase.

For example, it is possible to update the explorer's icon by setting it's icon class
to codicon codicon-files.

@JesterOrNot
Copy link
Author

So do we close this PR?

@vince-fugnitto
Copy link
Member

So do we close this PR?

It's up to you, we can either restart by amending the following pull-request or start clean and open a new one.

@JesterOrNot
Copy link
Author

What do you think would we need to restart either way?

@vince-fugnitto
Copy link
Member

What do you think would we need to restart either way?

I think so, there will no longer be a need to copy over all the images we require and instead reference the new icons while updating the styling a bit. It might be a lot cleaner to restart.

@JesterOrNot
Copy link
Author

OK!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CQ Required (deprecated) issues requiring a CQ (contributor questionnaire) theming issues related to theming
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants