Sublime Forum

How to turn off (or change color of) error highlight

#1

Hi!
I’m using Sublime with HTML syntax, but a project I’m doing is actually a mix of HTML and other language. The problem is - Sublime makes a total mess with highlighting all the quotes and some other signs in the color syntax of this other language. It looks like this: https://prnt.sc/s039uy . Is there anyway to fix it/turn off the highlighting without creating a completely new syntax just for this project? (and by the way - is there anyway two syntaxes together? Because this other language is Twee, and I have a syntax for that, but then HTML is not colored and it’s a problem).
Thanks!

0 Likes

#2

Ok I’ve managed to achieve what I need with https://packagecontrol.io/packages/ColorSchemeEditor , but I wonder is there no other way of doing it than simply force change the background color of an error?

0 Likes

#3

The other way would be to use a custom syntax definition to either not use the invalid scope or properly support the language (HTML + Twee) that you’re using.

0 Likes

#4

Could you provide an example of actually Twee codes which you are dealing with or a decent source that can be used to test the syntax?

0 Likes

#5

Hi,

@bschaaf

Well, that would be awesome - how I can do it?:slight_smile:

@jfcherng

Basically, the main thing you need to know is that the Twee/Sugarcube syntax goes between << and >> . So in the example like this: https://jsfiddle.net/c378mq0n/ you’ll notice it right away.

Stuff like <<if>> / <<for>> need a closing tag <</if>> and <</for>>. The others like <<print don’t. More documentation on that: https://www.motoslave.net/sugarcube/2/docs/
As for the stuff like<<btn>> / <<media>> these are widgets that I wrote and they don’t need an ending tag. But there’s also JS functions, that need to be started, ended, and they might have tags inbetween, which look like this: <<chunks>> <<chunk>> <<chunk>> <<chunk>> <</chunks>> or <<events>> <<event>> <<event>> <</events>>

In general it’s pretty simple, although it sounds complicated, because you’re actually using couple things at the same time - HTML, Twine (Twee), Sugarcube and JS. But the core is HTML and the double brackets stuff - the rest is not that important.

0 Likes

#6

A modified less problematic Twee syntax here. There are still many problems but at least better than the one on PC… Since I dont use Twee personally, this is probably the end of my journey on this :slight_smile:

%YAML 1.2
---
# http://www.sublimetext.com/docs/3/syntax.html
name: Twee
file_extensions:
 - tw
scope: text.twee

variables:
 ascii_space: '\t\n\f '

 # https://html.spec.whatwg.org/multipage/syntax.html#attributes-2
 attribute_name_char: '[{{ascii_space}}=/>]'
 attribute_name_start: (?=[^{{attribute_name_char}}])
 attribute_name_break: (?={{attribute_name_char}})

 # https://html.spec.whatwg.org/multipage/syntax.html#syntax-attribute-value
 unquoted_attribute_start: (?=[^{{ascii_space}}=>])
 unquoted_attribute_break: (?=[{{ascii_space}}]|/?>)

 # https://html.spec.whatwg.org/multipage/parsing.html#tag-name-state
 tag_name_char: '[^{{ascii_space}}/<>]'
 tag_name_break: (?=[^{{tag_name_char}}])
 tag_name: '[A-Za-z]{{tag_name_char}}*'

 block_tag_name: |-
   (?ix:
     address|applet|article|aside|blockquote|center|dd|dir|div|dl|dt|figcaption|figure|footer|frame|frameset|h1|h2|h3|h4|h5|h6|header|iframe|menu|nav|noframes|object|ol|p|pre|section|ul
   ){{tag_name_break}}

 inline_tag_name: |-
   (?ix:
     abbr|acronym|area|audio|b|base|basefont|bdi|bdo|big|br|canvas|caption|cite|code|del|details|dfn|dialog|em|font|head|html|i|img|ins|isindex|kbd|li|link|map|mark|menu|menuitem|meta|noscript|param|picture|q|rp|rt|rtc|ruby|s|samp|script|small|source|span|strike|strong|style|sub|summary|sup|time|title|track|tt|u|var|video|wbr
   ){{tag_name_break}}

 form_tag_name: |-
   (?ix:
     button|datalist|input|label|legend|meter|optgroup|option|output|progress|select|template|textarea
   ){{tag_name_break}}

 javascript_mime_type: |-
   (?ix:
     # https://mimesniff.spec.whatwg.org/#javascript-mime-type
     (?:application|text)/(?:x-)?(?:java|ecma)script
     | text/javascript1\.[0-5]
     | text/jscript
     | text/livescript
   )

 custom_element_char: |-
   (?x:
     # https://html.spec.whatwg.org/multipage/custom-elements.html#custom-elements-core-concepts
       [-_a-z0-9\x{00B7}]
     | \\\.
     | [\x{00C0}-\x{00D6}]
     | [\x{00D8}-\x{00F6}]
     | [\x{00F8}-\x{02FF}]
     | [\x{0300}-\x{037D}]
     | [\x{037F}-\x{1FFF}]
     | [\x{200C}-\x{200D}]
     | [\x{203F}-\x{2040}]
     | [\x{2070}-\x{218F}]
     | [\x{2C00}-\x{2FEF}]
     | [\x{3001}-\x{D7FF}]
     | [\x{F900}-\x{FDCF}]
     | [\x{FDF0}-\x{FFFD}]
     | [\x{10000}-\x{EFFFF}]
   )

 script_close_lookahead: (?i:(?=(?:-->\s*)?</script))

contexts:
 main:
   - include: main-twee
   - include: main-html

 main-twee:
   - match: '(^::)(.+)(\[)(stylesheet)(\])'
     captures:
       1: storage.type.twee
       2: entity.name.type.css.twee
       3: punctuation.definition.tag.begin.twee
       4: storage.modifer.twee
       5: punctuation.definition.tag.end.twee
     push:
       - meta_scope: meta.css.twee
       - meta_content_scope: source.embeded.css.twee
       - match: ^(?=::)
         pop: true
       - include: scope:source.css
   - match: '(^::)(.+)(\[)(script)(\])'
     captures:
       1: storage.type.twee
       2: entity.name.type.js.twee
       3: punctuation.definition.tag.begin.twee
       4: storage.modifer.twee
       5: punctuation.definition.tag.end.twee
     push:
       - meta_scope: meta.js.twee
       - meta_content_scope: source.embeded.js.twee
       - match: ^(?=::)
         pop: true
       - include: scope:source.js
   - match: '(^::)\s*((Start|StoryTitle|StorySubtitle|StoryAuthor|StoryMenu)|([^\[]*))\s*((\[)([^\]]*)(\]))*'
     scope: meta.passage.twee
     captures:
       1: storage.type.twee
       3: support.class.passage.twee
       4: entity.name.function.passage.twee
       6: punctuation.definition.tag.begin.twee
       7: entity.name.tag.twee
       8: punctuation.definition.tag.end.twee
   - match: '\$\$'
   - match: '\$([A-Za-z_][A-Za-z0-9_]*)\b'
     scope: variable.parameter.twee
   - match: (?=<</?[a-zA-Z_])
     push:
       - meta_scope: meta.function.twee
       - match: (<</?)(back|choice|display|actions|pop|print|set|if|elseif|else|endif|remember|silently|endsilently|mask)
         captures:
           1: punctuation.definition.function.begin.twee
           2: keyword.control.twee
       - match: (<</?)([a-zA-Z_\-]+)
         captures:
           1: punctuation.definition.function.begin.twee
           2: keyword.control.custom.twee
       - match: (>>)
         captures:
           1: punctuation.definition.function.end.twee
         pop: true
       - match: '\$([A-Za-z_][A-Za-z0-9_]*)\b'
         scope: variable.parameter.twee
       - match: \b(eq|neq|gt|gte|lt|lte|and|or|not)\b
         scope: keyword.operator.twee
       - match: "('[^']*')"
         scope: string.quoted.single.twee
       - match: '("[^"]*")'
         scope: string.quoted.double.twee
       - match: "(/[^/]*/)"
         scope: string.regexp.twee
       - match: '!|%|&|\*|\-\-|\-|\+\+|\+|~|===|==|=|!=|!==|<=|>=|<<=|>>=|>>>=|<>|<|>|!|&&|\|\||\?\:|\*=|(?<!\()/=|%=|\+=|\-=|&=|\^=|\b(in|instanceof|new|delete|typeof|void)\b'
         scope: keyword.operator.js
       - match: '\b((0(x|X)[0-9a-fA-F]+)|([0-9]+(\.[0-9]+)?))\b'
         scope: constant.numeric.js
       - match: \btrue\b
         scope: constant.language.boolean.true.js
       - match: \bfalse\b
         scope: constant.language.boolean.false.js
       - match: \bnull\b
         scope: constant.language.null.js
       - match: \b(Infinity|NaN|undefined)\b
         scope: constant.language.js
   - match: '(\[)(\[)'
     captures:
       1: punctuation.definition.link.begin.twee
       2: punctuation.definition.link.divider.begin.twee
     push:
       - meta_scope: meta.markup.underline.link.twee
       - match: '(\])(\])'
         captures:
           1: punctuation.definition.link.divider.end.twee
           2: punctuation.definition.link.end.twee
         pop: true
       - match: '\|'
         scope: punctuation.definition.link.divider.twee
       - match: '\['
         scope: punctuation.definition.link.divider.begin.twee
       - match: '\]'
         scope: punctuation.definition.link.divider.end.twee
   - match: '(\[)(img)(\[)'
     captures:
       1: punctuation.definition.image.begin.twee
       2: support.type.image.twee
       3: punctuation.definition.image.divider.begin.twee
     push:
       - meta_scope: meta.markup.other.image.twee
       - match: '[^|\[\]]+'
       - match: '\|'
         scope: punctuation.definition.image.divider.twee
       - match: '(\])(\])'
         captures:
           1: punctuation.definition.image.divider.end.twee
           2: punctuation.definition.image.end.twee
         pop: true
       - match: '\['
         scope: punctuation.definition.image.divider.begin.twee
       - match: '\]'
         scope: punctuation.definition.image.divider.end.twee
   - match: (/%)
     captures:
       1: punctuation.definition.begin.twee
     push:
       - meta_scope: comment.block.twee
       - match: (%/)
         captures:
           1: punctuation.definition.end.twee
         pop: true
   - match: (/\*)
     captures:
       1: punctuation.definition.begin.twee
     push:
       - meta_scope: comment.block.twee
       - match: (\*/)
         captures:
           1: punctuation.definition.end.twee
         pop: true
   - match: ({{{)
     captures:
       1: punctuation.definition.begin.twee
     push:
       - meta_content_scope: meta.block.code.twee
       - match: (}}})
         captures:
           1: punctuation.definition.end.twee
         pop: true

 # ---- #
 # HTML #
 # ---- #

 immediately-pop:
   - match: ''
     pop: true

 else-pop:
   - match: (?=\S)
     pop: true

 main-html:
   - include: comment
   - include: cdata
   - include: doctype
   - match: (<\?)(xml)
     captures:
       1: punctuation.definition.tag.begin.html
       2: entity.name.tag.xml.html
     push:
       - meta_scope: meta.tag.preprocessor.xml.html
       - match: '\?>'
         scope: punctuation.definition.tag.end.html
         pop: true
       - include: tag-generic-attribute
       - include: string-double-quoted
       - include: string-single-quoted
   - match: (<)((?i:style)){{tag_name_break}}
     captures:
       0: meta.tag.style.begin.html
       1: punctuation.definition.tag.begin.html
       2: entity.name.tag.style.html
     push: style-css
   - match: '(<)((?i:script)){{tag_name_break}}'
     captures:
       0: meta.tag.script.begin.html
       1: punctuation.definition.tag.begin.html
       2: entity.name.tag.script.html
     push: script-javascript
   - match: (</?)((?i:body|head|html){{tag_name_break}})
     captures:
       1: punctuation.definition.tag.begin.html
       2: entity.name.tag.structure.any.html
     push:
       - meta_scope: meta.tag.structure.any.html
       - include: tag-end
       - include: tag-attributes
   - match: (</?)({{block_tag_name}})
     captures:
       1: punctuation.definition.tag.begin.html
       2: entity.name.tag.block.any.html
     push:
       - meta_scope: meta.tag.block.any.html
       - include: tag-end
       - include: tag-attributes
   - match: (</?)((?i:hr){{tag_name_break}})
     captures:
       1: punctuation.definition.tag.begin.html
       2: entity.name.tag.block.any.html
     push:
       - meta_scope: meta.tag.block.any.html
       - include: tag-end-maybe-self-closing
       - include: tag-attributes
   - match: (</?)((?i:form|fieldset){{tag_name_break}})
     captures:
       1: punctuation.definition.tag.begin.html
       2: entity.name.tag.block.form.html
     push:
       - meta_scope: meta.tag.block.form.html
       - include: tag-end
       - include: tag-attributes
   - match: (</?)({{inline_tag_name}})
     captures:
       1: punctuation.definition.tag.begin.html
       2: entity.name.tag.inline.any.html
     push:
       - meta_scope: meta.tag.inline.any.html
       - include: tag-end-maybe-self-closing
       - include: tag-attributes
   - match: (</?)({{form_tag_name}})
     captures:
       1: punctuation.definition.tag.begin.html
       2: entity.name.tag.inline.form.html
     push:
       - meta_scope: meta.tag.inline.form.html
       - include: tag-end-maybe-self-closing
       - include: tag-attributes
   - match: (</?)((?i:a){{tag_name_break}})
     captures:
       1: punctuation.definition.tag.begin.html
       2: entity.name.tag.inline.a.html
     push:
       - meta_scope: meta.tag.inline.a.html
       - include: tag-end-maybe-self-closing
       - include: tag-attributes
   - match: (</?)((?i:col|colgroup|table|tbody|td|tfoot|th|thead|tr){{tag_name_break}})
     captures:
       1: punctuation.definition.tag.begin.html
       2: entity.name.tag.inline.table.html
     push:
       - meta_scope: meta.tag.inline.table.html
       - include: tag-end-maybe-self-closing
       - include: tag-attributes
   - match: </?(?=[A-Za-z]{{tag_name_char}}*?-)
     scope: punctuation.definition.tag.begin.html
     push:
       - tag-custom-body
       - tag-custom-name
   - match: </?(?=[A-Za-z])
     scope: punctuation.definition.tag.begin.html
     push:
       - tag-other-body
       - tag-other-name
   - include: entities
   - match: <>
     scope: invalid.illegal.incomplete.html

 tag-custom-name:
     - meta_content_scope: entity.name.tag.custom.html
     - match: '{{tag_name_break}}'
       pop: true
     - match: '{{custom_element_char}}+'
       # no scope
     - match: '{{tag_name_char}}'
       scope: invalid.illegal.custom-tag-name.html

 tag-custom-body:
     - meta_scope: meta.tag.custom.html
     - include: tag-end-maybe-self-closing
     - include: tag-attributes

 tag-other-name:
     - meta_content_scope: entity.name.tag.other.html
     - match: '{{tag_name_break}}'
       pop: true

 tag-other-body:
     - meta_scope: meta.tag.other.html
     - include: tag-end-maybe-self-closing
     - include: tag-attributes

 entities:
   - match: (&#[xX])\h+(;)
     scope: constant.character.entity.hexadecimal.html
     captures:
       1: punctuation.definition.entity.html
       2: punctuation.terminator.entity.html
   - match: (&#)[0-9]+(;)
     scope: constant.character.entity.decimal.html
     captures:
       1: punctuation.definition.entity.html
       2: punctuation.terminator.entity.html
   - match: (&)[a-zA-Z0-9]+(;)
     scope: constant.character.entity.named.html
     captures:
       1: punctuation.definition.entity.html
       2: punctuation.terminator.entity.html

 cdata:
   - match: (<!\[)(CDATA)(\[)
     captures:
       1: punctuation.definition.tag.begin.html
       2: keyword.declaration.cdata.html
       3: punctuation.definition.tag.begin.html
     push:
       - meta_scope: meta.tag.sgml.cdata.html
       - meta_content_scope: string.unquoted.cdata.html
       - match: ']]>'
         scope: punctuation.definition.tag.end.html
         pop: true

 comment:
   - match: (<!--)(-?>)?
     captures:
       1: punctuation.definition.comment.begin.html
       2: invalid.illegal.bad-comments-or-CDATA.html
     push:
       - meta_scope: comment.block.html
       - match: '(<!-)?(--\s*>)'
         captures:
           1: invalid.illegal.bad-comments-or-CDATA.html
           2: punctuation.definition.comment.end.html
         pop: true
       - match: '<!--(?!-?>)|--!>'
         scope: invalid.illegal.bad-comments-or-CDATA.html

 doctype:
   - match: (<!)(DOCTYPE)
     captures:
       1: punctuation.definition.tag.begin.html
       2: keyword.declaration.doctype.html
     push:
       - doctype-meta
       - doctype-content
       - doctype-content-type
       - doctype-name

 doctype-meta:
   - meta_scope: meta.tag.sgml.doctype.html
   - match: '>'
     scope: punctuation.definition.tag.end.html
     pop: true

 doctype-name:
   - match: '{{tag_name}}'
     scope: constant.language.doctype.html
     pop: true
   - include: else-pop

 doctype-content-type:
   - match: (?:PUBLIC|SYSTEM)\b
     scope: keyword.content.external.html
     pop: true
   - include: else-pop

 doctype-content:
   - match: \[
     scope: punctuation.section.brackets.begin.html
     set:
       - meta_scope: meta.brackets.html meta.internal-subset.xml.html
       - match: \]
         scope: punctuation.section.brackets.end.html
         pop: true
       - include: comment
   - include: string-double-quoted
   - include: string-single-quoted
   - include: else-pop

 style-css:
   - meta_content_scope: meta.tag.style.begin.html
   - include: style-common
   - match: '>'
     scope: punctuation.definition.tag.end.html
     set:
       - include: style-close-tag
       - match: (?=\S)
         embed: scope:source.css
         embed_scope: source.css.embedded.html
         escape: (?i)(?=(?:-->\s*)?</style)

 style-other:
   - meta_content_scope: meta.tag.style.begin.html
   - include: style-common
   - match: '>'
     scope: punctuation.definition.tag.end.html
     set:
       - include: style-close-tag

 style-close-tag:
   - match: (?i)(</)(style)(>)
     scope: meta.tag.style.end.html
     captures:
       1: punctuation.definition.tag.begin.html
       2: entity.name.tag.style.html
       3: punctuation.definition.tag.end.html
     pop: true

 style-common:
   - include: style-type-attribute
   - include: tag-attributes
   - include: tag-end-self-closing

 style-type-attribute:
   - match: (?i)\btype\b
     scope: meta.attribute-with-value.html entity.other.attribute-name.html
     set:
       - meta_content_scope: meta.tag.style.begin.html meta.attribute-with-value.html
       - match: =
         scope: punctuation.separator.key-value.html
         set:
           - meta_content_scope: meta.tag.style.begin.html meta.attribute-with-value.html
           - include: style-type-decider
       - match: (?=\S)
         set: style-css

 style-type-decider:
   - match: (?i)(?=text/css{{unquoted_attribute_break}}|'text/css'|"text/css")
     set:
       - style-css
       - tag-generic-attribute-meta
       - tag-generic-attribute-value
   - match: (?i)(?=>|''|"")
     set:
       - style-css
       - tag-generic-attribute-meta
       - tag-generic-attribute-value
   - match: (?=\S)
     set:
       - style-other
       - tag-generic-attribute-meta
       - tag-generic-attribute-value

 script-javascript:
   - meta_content_scope: meta.tag.script.begin.html
   - include: script-common
   - match: '>'
     scope: punctuation.definition.tag.end.html
     set:
       - include: script-close-tag
       - match: (?=\S)
         embed: scope:source.js
         embed_scope: source.js.embedded.html
         escape: '{{script_close_lookahead}}'

 script-html:
   - meta_content_scope: meta.tag.script.begin.html
   - include: script-common
   - match: '>'
     scope: punctuation.definition.tag.end.html
     set:
       - meta_content_scope: text.html.embedded.html
       - include: comment
       - include: script-close-tag
       - include: main

 script-other:
   - meta_content_scope: meta.tag.script.begin.html
   - include: script-common
   - match: '>'
     scope: punctuation.definition.tag.end.html
     set:
       - include: script-close-tag

 script-close-tag:
   - match: <!--
     scope: comment.block.html punctuation.definition.comment.begin.html
   - match: '{{script_close_lookahead}}'
     set:
       - match: '-->'
         scope: comment.block.html punctuation.definition.comment.end.html
       - match: (?i:(</)(script))
         captures:
           1: punctuation.definition.tag.begin.html
           2: entity.name.tag.script.html
         set:
           - meta_scope: meta.tag.script.end.html
           - include: tag-end
           - include: tag-attributes

 script-common:
   - include: script-type-attribute
   - include: tag-attributes
   - include: tag-end-self-closing

 script-type-attribute:
   - match: (?i)\btype\b
     scope: meta.attribute-with-value.html entity.other.attribute-name.html
     set:
       - meta_content_scope: meta.tag.script.begin.html meta.attribute-with-value.html
       - match: =
         scope: punctuation.separator.key-value.html
         set:
           - meta_content_scope: meta.tag.script.begin.html meta.attribute-with-value.html
           - include: script-type-decider
       - match: (?=\S)
         set: script-javascript

 script-type-decider:
   - match: (?i)(?={{javascript_mime_type}}{{unquoted_attribute_break}}|'{{javascript_mime_type}}'|"{{javascript_mime_type}}")
     set:
       - script-javascript
       - tag-generic-attribute-meta
       - tag-generic-attribute-value
   - match: (?i)(?=module{{unquoted_attribute_break}}|'module'|"module")
     set:
       - script-javascript
       - tag-generic-attribute-meta
       - tag-generic-attribute-value
   - match: (?i)(?=>|''|"")
     set:
       - script-javascript
       - tag-generic-attribute-meta
       - tag-generic-attribute-value
   - match: (?i)(?=text/html{{unquoted_attribute_break}}|'text/html'|"text/html")
     set:
       - script-html
       - tag-generic-attribute-meta
       - tag-generic-attribute-value
   - match: (?=\S)
     set:
       - script-other
       - tag-generic-attribute-meta
       - tag-generic-attribute-value

 string-double-quoted:
   - match: '"'
     scope: punctuation.definition.string.begin.html
     push:
       - meta_scope: string.quoted.double.html
       - match: '"'
         scope: punctuation.definition.string.end.html
         pop: true
       - include: entities
 string-single-quoted:
   - match: "'"
     scope: punctuation.definition.string.begin.html
     push:
       - meta_scope: string.quoted.single.html
       - match: "'"
         scope: punctuation.definition.string.end.html
         pop: true
       - include: entities

 tag-generic-attribute:
   - match: '{{attribute_name_start}}'
     push:
       - tag-generic-attribute-meta
       - tag-generic-attribute-equals
       - tag-generic-attribute-name

 tag-generic-attribute-name:
   - meta_scope: entity.other.attribute-name.html
   - match: '{{attribute_name_break}}'
     pop: true
   - match: '["''`<]'
     scope: invalid.illegal.attribute-name.html

 tag-generic-attribute-meta:
   - meta_scope: meta.attribute-with-value.html
   - include: immediately-pop

 tag-generic-attribute-equals:
   - match: '='
     scope: punctuation.separator.key-value.html
     set: tag-generic-attribute-value
   - include: else-pop

 tag-generic-attribute-value:
   - match: '"'
     scope: punctuation.definition.string.begin.html
     set:
       - meta_scope: string.quoted.double.html
       - match: '"'
         scope: punctuation.definition.string.end.html
         pop: true
       - include: entities
   - match: "'"
     scope: punctuation.definition.string.begin.html
     set:
       - meta_scope: string.quoted.single.html
       - match: "'"
         scope: punctuation.definition.string.end.html
         pop: true
       - include: entities
   - match: '{{unquoted_attribute_start}}'
     set:
       - meta_scope: string.unquoted.html
       - match: '{{unquoted_attribute_break}}'
         pop: true
       - match: '["''`<]'
         scope: invalid.illegal.attribute-value.html
       - include: entities
   - include: else-pop

 tag-class-attribute:
   - match: '\bclass\b'
     scope: entity.other.attribute-name.class.html
     push:
       - tag-class-attribute-meta
       - tag-class-attribute-equals

 tag-class-attribute-meta:
   - meta_scope: meta.attribute-with-value.class.html
   - include: immediately-pop

 tag-class-attribute-equals:
   - match: '='
     scope: punctuation.separator.key-value.html
     set: tag-class-attribute-value
   - include: else-pop

 tag-class-attribute-value:
   - match: '"'
     scope: punctuation.definition.string.begin.html
     set:
       - meta_scope: string.quoted.double.html
       - meta_content_scope: meta.class-name.html
       - match: '"'
         scope: punctuation.definition.string.end.html
         pop: true
       - include: tag-attribute-value-separator
       - include: entities
   - match: "'"
     scope: punctuation.definition.string.begin.html
     set:
       - meta_scope: string.quoted.single.html
       - meta_content_scope: meta.class-name.html
       - match: "'"
         scope: punctuation.definition.string.end.html
         pop: true
       - include: tag-attribute-value-separator
       - include: entities
   - match: '{{unquoted_attribute_start}}'
     set:
       - meta_scope: string.unquoted.html meta.class-name.html
       - match: '{{unquoted_attribute_break}}'
         pop: true
       - match: '["''`<]'
         scope: invalid.illegal.attribute-value.html
       - include: entities
   - include: else-pop

 tag-id-attribute:
   - match: '\bid\b'
     scope: entity.other.attribute-name.id.html
     push:
       - tag-id-attribute-meta
       - tag-id-attribute-equals

 tag-id-attribute-meta:
   - meta_scope: meta.attribute-with-value.id.html
   - include: immediately-pop

 tag-id-attribute-equals:
   - match: '='
     scope: punctuation.separator.key-value.html
     set: tag-id-attribute-value
   - include: else-pop

 tag-id-attribute-value:
   - match: '"'
     scope: punctuation.definition.string.begin.html
     set:
       - meta_scope: string.quoted.double.html
       - meta_content_scope: meta.toc-list.id.html
       - match: '"'
         scope: punctuation.definition.string.end.html
         pop: true
       - include: tag-attribute-value-separator
       - include: entities
   - match: "'"
     scope: punctuation.definition.string.begin.html
     set:
       - meta_scope: string.quoted.single.html
       - meta_content_scope: meta.toc-list.id.html
       - match: "'"
         scope: punctuation.definition.string.end.html
         pop: true
       - include: tag-attribute-value-separator
       - include: entities
   - match: '{{unquoted_attribute_start}}'
     set:
       - meta_scope: string.unquoted.html meta.toc-list.id.html
       - match: '{{unquoted_attribute_break}}'
         pop: true
       - match: '["''`<]'
         scope: invalid.illegal.attribute-value.html
       - include: entities
   - include: else-pop

 tag-style-attribute:
   - match: '\bstyle\b'
     scope: entity.other.attribute-name.style.html
     push:
       - tag-style-attribute-meta
       - tag-style-attribute-equals

 tag-style-attribute-meta:
   - meta_scope: meta.attribute-with-value.style.html
   - include: immediately-pop

 tag-style-attribute-equals:
   - match: '='
     scope: punctuation.separator.key-value.html
     set: tag-style-attribute-value
   - include: else-pop

 tag-style-attribute-value:
   - match: '"'
     scope: string.quoted.double punctuation.definition.string.begin.html
     embed: scope:source.css#rule-list-body
     embed_scope: source.css
     escape: '"'
     escape_captures:
       0: string.quoted.double punctuation.definition.string.end.html
   - match: "'"
     scope: string.quoted.single punctuation.definition.string.begin.html
     embed: scope:source.css#rule-list-body
     embed_scope: source.css
     escape: "'"
     escape_captures:
       0: string.quoted.single punctuation.definition.string.end.html
   - include: else-pop

 tag-event-attribute:
   - match: |-
       (?x)\bon(
         abort|autocomplete|autocompleteerror|auxclick|blur|cancel|canplay
         |canplaythrough|change|click|close|contextmenu|cuechange|dblclick|drag
         |dragend|dragenter|dragexit|dragleave|dragover|dragstart|drop
         |durationchange|emptied|ended|error|focus|input|invalid|keydown
         |keypress|keyup|load|loadeddata|loadedmetadata|loadstart|mousedown
         |mouseenter|mouseleave|mousemove|mouseout|mouseover|mouseup|mousewheel
         |pause|play|playing|progress|ratechange|reset|resize|scroll|seeked
         |seeking|select|show|sort|stalled|submit|suspend|timeupdate|toggle
         |volumechange|waiting
       )\b
     scope: entity.other.attribute-name.event.html
     push:
       - tag-event-attribute-meta
       - tag-event-attribute-equals

 tag-event-attribute-meta:
   - meta_scope: meta.attribute-with-value.event.html
   - include: immediately-pop

 tag-event-attribute-equals:
   - match: '='
     scope: punctuation.separator.key-value.html
     set: tag-event-attribute-value
   - include: else-pop

 tag-event-attribute-value:
   - match: '"'
     scope: string.quoted.double punctuation.definition.string.begin.html
     embed: scope:source.js
     embed_scope: meta.attribute-with-value.event.html
     escape: '"'
     escape_captures:
       0: string.quoted.double punctuation.definition.string.end.html
   - match: "'"
     scope: string.quoted.single punctuation.definition.string.begin.html meta.attribute-with-value.event.html
     embed: scope:source.js
     embed_scope: meta.attribute-with-value.event.html
     escape: "'"
     escape_captures:
       0: string.quoted.single punctuation.definition.string.end.html
   - include: else-pop

 # This is to prevent breaking syntaxes referencing the old context name
 tag-stuff:
   - include: tag-attributes

 tag-attributes:
   - include: tag-id-attribute
   - include: tag-class-attribute
   - include: tag-style-attribute
   - include: tag-event-attribute
   - include: tag-generic-attribute

 tag-attribute-value-separator:
   - match: (?=[{{ascii_space}}])
     push:
       - clear_scopes: 1 # clear `meta.class-name` or `meta.toc-list.id`
       - include: else-pop

 tag-end:
   - match: '>'
     scope: punctuation.definition.tag.end.html
     pop: true

 tag-end-self-closing:
   - match: '/>'
     scope: punctuation.definition.tag.end.html
     pop: true

 tag-end-maybe-self-closing:
   - match: '/?>'
     scope: punctuation.definition.tag.end.html
     pop: true
0 Likes

#7

Hey,

That sounds awesome! But I’m not sure how would I load it into Sublime?:slight_smile:

0 Likes

#8

Just put it in Packages/.

On Windows, it’s %AppData%\Roaming\Sublime Text\Packages\

0 Likes

#9

Sorry but i’m new to this… I’ve created a folder “Twee” in this packages folder. And in this folder I added “twee.txt” with the content you gave me. When I list the packages - I see it’s there. But I don’t know how to activate it?

0 Likes

#10

Go to Packages/ via Browse Packages... in image.
Put Twee.sublime-syntax in Packages/ or any subdirectory.
That’s all.

But I don’t know how to activate it?

It should auto work for *.tw files.

0 Likes

#11

The file name must have the extension .sublime-syntax, not .txt. In your case you would name it twee.sublime-syntax.

0 Likes

#12

Ok, thank you!

0 Likes