Home

Awesome

Syntax Highlighting for Sass

Syntax highlighting package for both SCSS and Sass on Sublime Text. Also available for TextMate and Atom.

Install via Package Control.

Features:

Built-in Completion Packages

Pick up the package name which you are not intend to use, then add it/them into the ignored_packages list of your settings file. (If you know a better way to do this please please let me know.)

Smart Completion Rule

Cancel Completion

Typing @-rule, ID, class, placeholder-selector, mixin name, function name, comment, and quoted content will never popup any completions.

Property-value Completion

When typing property values, property name and other completions will no longer popup.

Sass Scope

source.sass meta.property-list.css.sass - variable.other.value

SCSS Scope

source.scss meta.property-list.css.sass - variable.other.value

Mixin Completion

Built-in mixin name completions will only popup directly behind @include or +

Sass Scope

source.sass support.function.name.sass.library

SCSS Scope

source.scss support.function.name.sass.library

Variable Completion

There are three types of variable compltions: Root-variable, Value-variable, and Variable (contains the previous two).

Root-variable

Sass Scope

source.sass variable.other.root

SCSS Scope

source.scss variable.other.root
Value-variable

Sass Scope

source.sass variable.other.value

SCSS Scope

source.scss variable.other.value
Variable

Sass Scope

source.sass variable.other

SCSS Scope

source.scss variable.other

Function Completion

Sass Scope

source.sass - variable.other - support.function.name.sass.library

SCSS Scope

source.scss - variable.other - support.function.name.sass.library

Property-name Completion

The latest version of Emmet CSS Snippets now fully supports this feature. I recommend to use it instead of the built-in properties completion package.

Sass Scope

source.sass - meta.property-list - support.function.name.sass.library - variable.other.root

SCSS Scope

source.scss - meta.property-list - support.function.name.sass.library - variable.other.root

Goto Symbol and Goto Definition

Goto Symbol or Goto Symbol in Project

Goto Definition

Comment Tag

Use {{ and }} to wrap a keyword inside comment, then this keyword (comment tag) will be indexed by the Goto Symbol and Goto Definition features.

Color Scheme

Recommended Color Schemes

Add new one?

Scopes List

ElementScope Selector
Block Commentcomment.block.sass
Inline Commentcomment.line.sass
Comment Tagcomment.tag.sass
At-rulekeyword.control.at-rule.css.sass
Type Selector, Ampersandentity.name.tag.css.sass
Id Selectorentity.other.attribute-name.id.css.sass
Class Selectorentity.other.attribute-name.class.css.sass
Placeholder Selectorentity.other.attribute-name.placeholder-selector.sass
Attribute Selectorentity.other.attribute-selector.sass
Regexkeyword.other.regex.sass
Pseudo Class, Pseudo Elemententity.other.attribute-name.pseudo-class.css.sass
Property Namesupport.type.property-name.css.sass
Property Valuemeta.property-value.css.sass, support.constant.property-value.css.sass
Double Quotedstring.quoted.double.css.sass
Commacomment.punctuation.comma.sass
Numericconstant.numeric.css.sass
Unitkeyword.other.unit.css.sass
Rgb Colorconstant.other.color.rgb-value.css.sass
Function Namesupport.function.name.sass
Sass Variablevariable
Sass Directive, Directive Shorthandkeyword.control.at-rule.css.sass
Sass Interpolationsupport.function.interpolation.sass
Sass Flagkeyword.other.important.css.sass
Sass Operatorkeyword.operator.sass
SCSS Semicoloncomment.punctuation.semicolon.sass
Sass Semicoloninvalid
Sass Curly Bracketsinvalid

Customise Color Scheme

More information about Scope Selectors and Color Scheme, see Textmate Scope Selectors and Textmate Themes.

Contributors

mannieschumpert, pepelsbey

Credits

nathos's sass-textmate-bundle

Textmate Language Grammars