This project is read-only.

CSS (SCSS) support

Topics: User Forum
Mar 18, 2015 at 9:54 PM
Do you guys plan on, at all, incorporating CSS into the default langauges? Sort of surprised it was ignored in the first place.

And, apparently, there is even an SCSS modification to that as well:
http://sourceforge.net/p/scintilla/feature-requests/799/

The list of supported languages hasn't changed since 2011 and can't believe that the popular CSS hasn't been included in this list. If this stuff was documented better, maybe I would do it, but I've tried and am having problems with using custom styling and am stumped.
Mar 19, 2015 at 4:24 AM
ScintillaNET may not support it, but as you said Scintilla does. Try this:
const int SCE_CSS_DEFAULT = 0;
const int SCE_CSS_TAG = 1;
const int SCE_CSS_CLASS = 2;
const int SCE_CSS_PSEUDOCLASS = 3;
const int SCE_CSS_UNKNOWN_PSEUDOCLASS = 4;
const int SCE_CSS_OPERATOR = 5;
const int SCE_CSS_IDENTIFIER = 6;
const int SCE_CSS_UNKNOWN_IDENTIFIER = 7;
const int SCE_CSS_VALUE = 8;
const int SCE_CSS_COMMENT = 9;
const int SCE_CSS_ID = 10;
const int SCE_CSS_IMPORTANT = 11;
const int SCE_CSS_DIRECTIVE = 12;
const int SCE_CSS_DOUBLESTRING = 13;
const int SCE_CSS_SINGLESTRING = 14;
const int SCE_CSS_IDENTIFIER2 = 15;
const int SCE_CSS_ATTRIBUTE = 16;
const int SCE_CSS_IDENTIFIER3 = 17;
const int SCE_CSS_PSEUDOELEMENT = 18;
const int SCE_CSS_EXTENDED_IDENTIFIER = 19;
const int SCE_CSS_EXTENDED_PSEUDOCLASS = 20;
const int SCE_CSS_EXTENDED_PSEUDOELEMENT = 21;
const int SCE_CSS_MEDIA = 22;
const int SCE_CSS_VARIABLE = 23;

// Reset all styles to Consolas, 10
scintilla.Styles.ResetDefault();
scintilla.Styles.Default.FontName = "Consolas";
scintilla.Styles.Default.Size = 10;
scintilla.Styles.ClearAll();

// Set colors on CSS styles
scintilla.Styles[SCE_CSS_DEFAULT].ForeColor = Color.Silver;
scintilla.Styles[SCE_CSS_COMMENT].ForeColor = Color.FromArgb(0, 128, 0); // Green
scintilla.Styles[SCE_CSS_CLASS].ForeColor = Color.FromArgb(163, 21, 21); // Red
scintilla.Styles[SCE_CSS_TAG].ForeColor = Color.FromArgb(163, 21, 21); // Red
scintilla.Styles[SCE_CSS_IDENTIFIER].ForeColor = Color.Red;
scintilla.Styles[SCE_CSS_VALUE].ForeColor = Color.Blue;
scintilla.Styles[SCE_CSS_DIRECTIVE].ForeColor = Color.Blue;
scintilla.Styles[SCE_CSS_MEDIA].ForeColor = Color.Orange;
scintilla.Styles[SCE_CSS_VARIABLE].ForeColor = Color.Purple;
// Etc...

// Enable the CSS lexer and SASS option
scintilla.Lexing.Lexer = Lexer.Css;
scintilla.Lexing.SetProperty("lexer.css.scss.language", "1");

// Set keywords
// 0. "CSS1 Properties",
// 1. "Pseudo-classes",
// 2. "CSS2 Properties",
// 3. "CSS3 Properties",
// 4. "Pseudo-elements",
// 5. "Browser-Specific CSS Properties",
// 6. "Browser-Specific Pseudo-classes",
// 7. "Browser-Specific Pseudo-elements",
scintilla.Lexing.SetKeywords(0, "color background-color background-image background-repeat background-attachment background-position background font-family font-style font-variant font-weight font-size font word-spacing letter-spacing text-decoration vertical-align text-transform text-align text-indent line-height margin-top margin-right margin-bottom margin-left margin padding-top padding-right padding-bottom padding-left padding border-top-width border-right-width border-bottom-width border-left-width border-width border-top border-right border-bottom border-left border border-color border-style width height float clear display white-space list-style-type list-style-image list-style-position list-style");
// Etc...
Jacob