Gruntfuggly / todo-tree

Use ripgrep to find TODO tags and display the results in a tree view
Other
1.42k stars 136 forks source link

Add support for Microsoft Fluent UI system icons #473

Closed redactedscribe closed 3 years ago

redactedscribe commented 3 years ago

I'd like to be able assign icons from the Fluent UI icon set by Microsoft.

The new VS Code Product Icon Themes which can be customized already have an extension using the icons, and being able to set pick from the same set for Todo Tree would be nice. The updated icons should make their way into Windows in the coming months too.

Thanks for the consideration.

Gruntfuggly commented 3 years ago

You can use product icons if you specify then with $(icon). They're mapped onto the codicons, e.g. $(heart) or $(getting-started-setup) will show the heart icon based on the product icon theme.

If thats not working, please could you post your settings and I'll see if I can recreate it?

redactedscribe commented 3 years ago

Are you saying the icons provided by the Product Icon Themes which change VS Code's icons (e.g. on the Activity Bar) can be used via $(<icon>)?

When using the value bug, I see what I is assume some bundled bug icon you include with the extension: bug

And with value $(bug) (matches "bug" from codicons): $(bug)

But $(bug) doesn't look like the "Bug (Regular)" icon provided by the Product Icon Theme extension / Fluent UI: Fluent Bug

Which I see in VS Code's Activity Bar: VS Code Bug

Hopefully that illustrates the issue.

{
    "todo-tree.general.tags": [
        "BUG:",
    ],
    "todo-tree.highlights.customHighlight": {
        "BUG:": {
            "background": "black",
            "foreground": "red",
            "icon": "$(bug)",
        },
    },
    "workbench.productIconTheme": "fluent-icons",
}
Gruntfuggly commented 3 years ago

I don't think the icon in the activity bar is $(bug), its actually $(run-view-icon). It's confusing because they've reused the names. https://code.visualstudio.com/api/references/icons-in-labels

Gruntfuggly commented 3 years ago

The blue icon is the old octicon icon. https://styleguide.github.com/primer/components/octicons/

redactedscribe commented 3 years ago

That makes sense. I tried it out and it is indeed $(run-view-icon).

Those links might be worth including in the README too.

I should be okay from here. Thanks for your help! 🙂

Gruntfuggly commented 3 years ago

No problem - are you OK if I close this one now?

redactedscribe commented 3 years ago

Yes, thanks again.