-
Notifications
You must be signed in to change notification settings - Fork 8
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
2 changed files
with
46 additions
and
60 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,64 +1,11 @@ | ||
# Syntax Highlighting for Sass | ||
# Sass and SCSS syntax for Sublime Text 3 | ||
|
||
This is a Sublime Text 3 package which purely forced on highlighting both Sass and SCSS syntax as accuracy as possible. Please make sure your Sublime Text 3 version is above Build 3103. | ||
- snippets | ||
- completions | ||
- symbols | ||
|
||
This package has taken over the package name "Sass", please search keyword "sass" from Package Control to install this package. | ||
Highlights code using up to date specifications for properties and values to help you catch typos. | ||
|
||
Known issues: | ||
## Installation | ||
|
||
1. If you updated this package from the [original Sass package](https://github.com/nathos/sass-textmate-bundle) you might notice SCSS files are highlighted with the Sass syntax, to solve this issue, please open any `.scss` file and reset its highlighting syntax with the "Open all with current extension as..." option. | ||
|
||
2. If you need the Emmet CSS abbreviation popup window to work well with the Sass syntax, you probably need to add the following code to your Emmet settings file. | ||
``` json | ||
{ | ||
"css_completions_scope": "source.scss - comment - variable - keyword.control - entity.other, source.sass - comment - variable - keyword.control - entity.other", | ||
} | ||
``` | ||
|
||
## New Features | ||
|
||
* Added support for CSS4 variables | ||
* Enhanced Sass map highlighting | ||
* Enhanced CSS functions and Sass functions highlighting | ||
* Enhanced Sass mixin/function name highlighting and their "Goto Definition" support | ||
* Removed built-in completions | ||
|
||
## Generating snippets | ||
|
||
Functions are documented on [sass-lang.com](https://sass-lang.com/documentation/Sass/Script/Functions.html). Copy them to a file and whip them into a json: | ||
|
||
```json | ||
[{ | ||
"trigger": "blue", | ||
"category": "sass color", | ||
"contents": "blue(${1:color})" | ||
}] | ||
``` | ||
|
||
A little python script generates the snippet files: | ||
|
||
```py | ||
import json | ||
import sys | ||
|
||
template = """<snippet> | ||
<content><![CDATA[ | ||
{snippet} | ||
]]></content> | ||
<tabTrigger>{trigger}</tabTrigger> | ||
<description>{category}</description> | ||
<scope>source.css.scss</scope> | ||
</snippet> | ||
""" | ||
|
||
data = json.load(open(sys.argv[1])) | ||
|
||
for entry in data: | ||
snippet = open('Snippets/' + entry.get('trigger') + '.sublime-snippet', 'w') | ||
snippet.write(template.format( | ||
snippet=entry.get('contents'), | ||
trigger=entry.get('trigger'), | ||
category=entry.get('category') | ||
)) | ||
snippet.close() | ||
``` | ||
This package is available through [Package Control](https://packagecontrol.io) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,39 @@ | ||
# Generating snippets | ||
|
||
Functions are documented on [sass-lang.com](https://sass-lang.com/documentation/Sass/Script/Functions.html). Copy them to a file and whip them into a json: | ||
|
||
```json | ||
[{ | ||
"trigger": "blue", | ||
"category": "sass color", | ||
"contents": "blue(${1:color})" | ||
}] | ||
``` | ||
|
||
A little python script generates the snippet files: | ||
|
||
```py | ||
import json | ||
import sys | ||
|
||
template = """<snippet> | ||
<content><![CDATA[ | ||
{snippet} | ||
]]></content> | ||
<tabTrigger>{trigger}</tabTrigger> | ||
<description>{category}</description> | ||
<scope>source.css.scss</scope> | ||
</snippet> | ||
""" | ||
|
||
data = json.load(open(sys.argv[1])) | ||
|
||
for entry in data: | ||
snippet = open('Snippets/' + entry.get('trigger') + '.sublime-snippet', 'w') | ||
snippet.write(template.format( | ||
snippet=entry.get('contents'), | ||
trigger=entry.get('trigger'), | ||
category=entry.get('category') | ||
)) | ||
snippet.close() | ||
``` |