Emulate codePen twilight theme

倾然丶 夕夏残阳落幕 提交于 2020-01-17 02:20:29

问题


I'm trying to make sublime text to look like codepen.io twilight theme. I was able to copy it besides for some categories. I don't know what the name of the scope is. Here's an image with the different words I want to change.

(The text from the image is JavaScript.)

I want to change the purple underlined words to purple, and yellow to yellow. What are the keywords (scope names) for the words?


回答1:


The yellow underlined items in your example are class names (a special case of variable name in JavaScript (and most languages).

I don't believe a syntax scope exists in JS for class names. It seems they are scoped as simple variables. Assuming I am right you are going to need to define your own syntax scope, perhaps calling it 'className' or similar. The defining characteristic seems to be a leading Uppercase followed by a lowercase.

Then you'll need to reference that new name in the color scheme and make it yellow (#FFF000) http://htmlcolorcodes.com/.

The same goes for the purple where you might have a member or a property or anything accessible through dot notation (based on your example). Again I think you are going to need to add your own syntax definition to the syntactic definition file for the languages you want to use it in. The regex seems to be any alphanumerics following a dot (.) ending at the next dot found. The name might be 'dotValue' or similar. Then you'll need to add that new syntax to the color theme to make 'dotValue's purple (#9700FF).

Before you start doing any of the playing about required to get where you want to be by trial and error make very sure you have backups of the syntax and color themes in a known good state so you are able to get back to a safe state at any point you might go off the rails.




回答2:


You can find the scope name for any part of a document in Sublime Text 3 by placing the cursor immediately to the left of it and then using Tools menu -> Developer -> Show Scope Name, which will pop up a little window showing the scope, along with a button to copy it to the clipboard. This functionality is also available through Ctrl+Alt+Shift+P.



来源:https://stackoverflow.com/questions/37874399/emulate-codepen-twilight-theme

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!