I was starting to work on my own theme today and I’m currently a little confused as to the best way to conduct theme development. Several things don’t seem to work how I’d expect so I wanted to just get out a few questions:
- What’s the best way to see all of the available selectors, other than the starter template or an existing theme? Is there any way to “inspect” the app to see what the selector of things is?
- I’m having some trouble visualizing how my style changes will take effect. They don’t seem to take effect immediately (more on this in a second) and so far it’s been really hard to just riff on the styles like I would in the browser.
- I made a new theme today, activated the project as an extension and it wasn’t showing as an available new theme. I remember this working just fine before, but on the latest version of the app, it doesn’t seem to be working, even after a restart or restarting the app itself.
- Are there any options to do special styles for a given language? I saw another forum post that seemed to suggest you could do something like
<Language>.tag.attribute.name { ... }
.
Just an observation…support for JSX syntax highlighting is super weak. While these types of things are largely up to the theme author, even the default themes just have terrible JSX support. Here’s a quick visual comparison of Nova (on the left) and Visual Studio Code (running basically stock Night Owl) on the right.
Nova Palette Theme
Nova Night Owl (Dark) Theme port
Any clarification or advice on the above would be most appreciated.