search

ahmadawais / shades-of-purple-vscode

🦄 Shades of Purple offers a hand-picked selection of bold and vibrant shades of purple that will transform your code into a visually stunning masterpiece. With its carefully crafted color palette, this theme brings a sense of style, elegance, and whimsy to your favorite code editor, making your coding sessions a delightful journey of creativity.
https://marketplace.visualstudio.com/items?itemName=ahmadawais.shades-of-purple
Other
733 stars 62 forks source link

Suggest styling for Typescript React components #7

Closed lrs closed 6 years ago

lrs commented 6 years ago

OS: Windows 10 Pro Terminal: cmd.exe VS Code version: 1.23.1 Theme version: 1.20.0

This may be a personal choice, however I wonder if it would it be possible to update the theme to style React components similar to HTML elements?

I've updated the workspace settings in my soptest repo as an example.

here are the relevant textMate rules:

"editor.tokenColorCustomizations": {
    "[Shades of Purple]": {
        "textMateRules": [
            {
                "name": "Typescript React Attributes",
                "scope": "entity.other.attribute-name.tsx",
                "settings": {
                    "fontStyle": "italic"
                }
            },
            {
                "name": "Typescript React Assignment Operator",
                "scope": "keyword.operator.assignment.tsx",
                "settings": {
                    "foreground": "#9effff"
                }
            },
            {
                "name": "Typescript React Classnames and Modules",
                "scope": [
                    "entity.name.type.class.tsx",
                    "entity.name.type.module.tsx",
                    "entity.other.inherited-class.tsx",
                    "variable.other.readwrite.alias.tsx",
                    "variable.other.object.tsx",
                    "support.class.component.tsx",
                    "entity.name.type.tsx"
                ],
                "settings": {
                    "foreground": "#9effff"
                }
            },
            {
                "name": "Typescript React Children",
                "scope": "meta.jsx.children.tsx",
                "settings": {
                    "foreground": "#ffffff"
                }
            }
        ]
    }
}

and a screenshot: tsx

ahmadawais commented 6 years ago

Thanks for reporting it and helping me fix that. It should be fixed in the next version. Commit 👌 IMPROVE: React/TypeScript components styling like HTML (a3a207fc7392054802f33af993ed096179682cb1)