2022.1

Using a Sass file
A CSS preprocessor is a CSS extension language that allows you to enhance CSS with code
(variables, for example) and then compile it into plain CSS. CSS Preprocessor Sass is
integrated in Connect.
For more information about Sass, see: https://sass-lang.com/.
Adding a Sass file
To add a Sass file:
1. Right-click the Stylesheet folder on the Resources pane, and click New Stylesheet >
SCSS file.
2. Enter a name for the file as it appears in the Stylesheet resources.
When the name of Sass file begins with an underscore, it is considered a partial .scss file
(e.g. _mySass.scss). Partial files are typically imported in a base .scss file. They may
include Sass variables or other directives declared in the base file, and they cannot be
compiled.
Compiling a Sass file
A Sass file needs to be compiled into a plain CSS file before it can be applied to a section. To
compile it:
1. Open the Stylesheet folder on the Resources pane.
2. Right-click the .scss file and select Compile.
The compiled style sheet will have the same name as the Sass file, but with the extension .css.
Compiled CSS files can be recognized by their first line:/* Compiled by https://sass-
lang.com/libsass */.
Compiler options can be set in the Preferences; see "Editing preferences" on page898.
Note
l Re-compiling a .scss file overwrites any manual changes made to the .css file.
l Partial .scss files cannot be compiled.
Page 798