Centralize common elements

[michaelblyons]

It strikes me that most of Sass and SCSS are the same. It might help maintenance to pull the common bits into a shared .sublime-syntax and have only the differences in Sass.sublime-syntax and SCSS.sublime-syntax. Then if you add additional CSS attributes to one, they are already part of the other. See for example the Git Formats part of the default packages and its Git Common.

At one point (though no longer), this was the diff of your two syntax files:

diff --git a/Syntaxes/SCSS.sublime-syntax b/Syntaxes/Sass.sublime-syntax
index b7986d7..c07e256 100644
--- a/Syntaxes/SCSS.sublime-syntax
+++ b/Syntaxes/Sass.sublime-syntax
@@ -1,9 +1,10 @@
 %YAML 1.2
 ---
 # http://www.sublimetext.com/docs/3/syntax.html
-name: SCSS
-file_extensions: [scss]
-scope: source.css.scss
+name: Sass
+file_extensions: [sass]
+scope: source.css.sass
+

 variables:
   unicode: '\\\h{1,6}[ \t\n\f]?'
@@ -19,20 +20,18 @@ contexts:
     - include: comment-block
     - include: comment-line
     - include: commas
-    - include: terminator
     - include: css-variables
     - include: literal-string
     - include: at-rules
     - include: selector
     - include: rule-list
-    - include: numeric-values
+    # - include: numeric-values
     - include: property-names
-    - include: property-list
     - include: scss-declarations
     - include: scss-variables
-    - include: scss-functions
-    - include: scss-operators
-    - include: scss-parameters
+    # - include: scss-functions
+    # - include: scss-operators
+    # - include: scss-parameters

   qualified-name:
     - match: '(?:({{ident}})|(\*))?([|])(?!=)'
@@ -46,11 +45,6 @@ contexts:
       captures:
         1: punctuation.separator.css

-  terminator:
-    - match: '\s*(;)\s*'
-      captures:
-        1: punctuation.terminator.statement.css
-
   color-values:
     - match: \b(yellowgreen|yellow|whitesmoke|white|wheat|violet|turquoise|tomato|thistle|teal|tan|steelblue|springgreen|snow|slategrey|slategray|slateblue|skyblue|silver|sienna|seashell|seagreen|sandybrown|salmon|saddlebrown|royalblue|rosybrown|red|rebeccapurple|purple|powderblue|plum|pink|peru|peachpuff|papayawhip|palevioletred|paleturquoise|palegreen|palegoldenrod|orchid|orangered|orange|olivedrab|olive|oldlace|navy|navajowhite|moccasin|mistyrose|mintcream|midnightblue|mediumvioletred|mediumturquoise|mediumspringgreen|mediumslateblue|mediumseagreen|mediumpurple|mediumorchid|mediumblue|mediumaquamarine|maroon|linen|limegreen|lime|lightyellow|lightsteelblue|lightslategrey|lightslategray|lightskyblue|lightseagreen|lightsalmon|lightpink|lightgrey|lightgreen|lightgray|lightgoldenrodyellow|lightcyan|lightcoral|lightblue|lemonchiffon|lawngreen|lavenderblush|lavender|khaki|ivory|indigo|indianred|hotpink|honeydew|grey|greenyellow|green|gray|goldenrod|gold|ghostwhite|gainsboro|fuchsia|forestgreen|floralwhite|firebrick|dodgerblue|dimgrey|dimgray|deepskyblue|deeppink|darkviolet|darkturquoise|darkslategrey|darkslategray|darkslateblue|darkseagreen|darksalmon|darkred|darkorchid|darkorange|darkolivegreen|darkmagenta|darkkhaki|darkgrey|darkgreen|darkgray|darkgoldenrod|darkcyan|darkblue|crimson|cornsilk|cornflowerblue|coral|chocolate|chartreuse|cadetblue|burlywood|brown|blueviolet|blue|blanchedalmond|black|bisque|beige|azure|aquamarine|aqua|antiquewhite|aliceblue)\b
       comment: http://www.w3.org/TR/CSS21/syndata.html#value-def-color
@@ -84,8 +78,9 @@ contexts:
       scope: punctuation.definition.comment.css
       push:
         - meta_scope: comment.line.double-slash.scss
-        - match: $\n?
-          scope: punctuation.definition.comment.css
+        - match: (?=^\s*\n)
+          pop: true
+        - match: (?=^\S)
           pop: true

   at-rules:
@@ -104,7 +99,7 @@ contexts:
         3: entity.name.function.scss
       push:
         - meta_scope: meta.at-rule.scss
-        - match: '\s*(?=[\{;])'
+        - match: '(?=$)'
           pop: true
         - include: scss-parameters
     - match: ((@)(?:-(?:webkit|moz|o)-)?(charset|import|namespace|page|font-face|supports|document)\b)
@@ -113,7 +108,7 @@ contexts:
         2: punctuation.definition.keyword.css
       push:
         - meta_scope: meta.at-rule.css
-        - match: '\s*(?=[\{;])'
+        - match: '(?=$)'
           pop: true
         - match: (url)(\()
           captures:
@@ -135,7 +130,7 @@ contexts:
         2: punctuation.definition.keyword.css
       push:
         - meta_scope: meta.at-rule.keyframes.css
-        - match: '\s*(?=[\{;])'
+        - match: '(?=$)'
           pop: true
         - include: comment-block
         - match: '[a-zA-Z0-9_-]+'
@@ -147,7 +142,7 @@ contexts:
         3: support.constant.media.css
       push:
         - meta_scope: meta.at-rule.media.css
-        - match: '\s*(?=\{)'
+        - match: '(?=$)'
           pop: true
         - include: comment-block
         - include: scss-operators
@@ -182,7 +177,6 @@ contexts:
             - include: comment-block
             - include: comment-line
             - include: numeric-values
-            - include: property-list
             - include: property-names
             - include: property-values
             - include: css-variables
@@ -219,7 +213,6 @@ contexts:
           scope: punctuation.separator.key-value.css
         - include: comment-block
         - include: commas
-        - include: terminator
         - include: color-values
         - include: numeric-values
         - include: css-variables
@@ -238,17 +231,6 @@ contexts:
       captures:
         1: keyword.operator.scss

-  property-list:
-    - match: '(\s*)\{'
-      scope: punctuation.section.property-list.begin.css
-      captures:
-        1: meta.selector.css
-      push:
-        - match: '\}'
-          scope: punctuation.section.property-list.end.css
-          pop: true
-        - include: main
-
   scss-parameters:
     - match: '\('
       scope: punctuation.definition.group.begin.scss
@@ -262,8 +244,6 @@ contexts:
         - include: comment-line
         - include: comment-block
         - include: commas
-        - include: terminator
-        - include: property-list
         - include: color-values
         - include: numeric-values
         - include: css-variables
@@ -518,14 +498,18 @@ contexts:
     - include: property-names

   rule-list:
-    - include: property-names
-    - match: (:)\s*
+    - match: ':'
       captures:
-        1: punctuation.separator.key-value.css
+        0: punctuation.separator.key-value.css
       push:
-        - meta_scope: meta.property-value.css
-        - match: '\s*(?=;|(?=[{}]))'
+        - match: '(?:$)'
           pop: true
+        - include: property-names
+        - match: '\s+'
+          push:
+          - match: '(?:$)'
+            pop: true
+          - meta_content_scope: meta.property-value.css
           - include: property-values

   selector:

[braver]

I think it might be tricky to keep them separate in a way that makes sense, but sure, there is a lot of overlap. With LESS as well. So, usually I try to fix one and then sync the change to the other two. I'm behind on doing that for Sass because I don't use it myself, but usually writing the commit message is more complicated.

[braver]

@michaelblyons as I understand it, it's possible to create a "common" file, and then import where needed parts from that? Starting from line 1111 it's mostly the same between the two syntaxes, so it does sound like a good idea to merge the two.

[michaelblyons]

Starting from line 1111 it's mostly the same between the two syntaxes, so it does sound like a good idea to merge the two.

Neat! I think that will help with future maintainability. My ST3 doesn't seem to like my current package symlinking at the moment**, so I can't verify the work until I straighten it out. If you want, I can push my branch and you can take a look. I just don't know if it works or not. (Also, it's several commits behind master, because the Sass and SCSS files diverged.)

---

** It says it can't find the Sass Common file's scopes in the index. Also true for another language I want to do this with.

[braver]

@michaelblyons That's ok, I think I got the gist of it. I'll have a go, see what it does on my machine.