Подсветка закрывающихся тегов (Highlighting matching tags Sublime Text)

#sublime_text

Возможно ли кастомизировать подстветку закрывающихся тегов в Sublime Text 3 подобно
тому, как на скриншоте ниже(Так реализовано в Brackets)?.
Есть плагин для этих целей BracketHighlighter (https://github.com/facelessuser/BracketHighlighter),
но перебрав имеющиеся конфиги, не 


    

Ответы

Ответ 1

Подчерк, а не подсветка тегов и скобок в Sublime Text 3 реализовывается без плагинов.

Для начала на всякий случай кликаем на Preferences → Settings - User , в открывшийся
файл между {} добавляем следующие строки:

"match_brackets": true,
"match_brackets_angle": true,
"match_brackets_square": true,
"match_brackets_braces": true,
"match_brackets_content":true,
"match_tags": true,


Сохраняем. В Sublime Text 3 всем этим параметрам кроме match_brackets_angle присвоено
значение true, но мало ли, в последующих сборках могут и поменять на false. match_brackets
— подчёркивание различных разновидностей скобок, match_tags — подчерк тегов.

Далее открываем файл привычной цветовой схемы с расширением tm.Theme. В самом его
начале находим примерно следующие строки ( значения цветов могут отличаться от приведённых
в примере):

lineHighlight
lightslategray
foreground
#ffdab9
invisibles
#BFBFBF
selection
dimgray


Где-нибудь между ними до закрывающих тегов  вставляем следующие теги:

            bracketContentsForeground
            yellow
                bracketContentsOptions
                underline
            bracketsForeground
            cyan
                bracketsOptions
                squiggly_underline
            tagsForeground
            lawngreen
                tagsOptions
                underline


Пояснения:


bracketContentsForeground — цвет подчёркивания любых скобок, между которыми расположена
каретка. Между тегами  вписывается цвет, лучше в формате HEX, чем
X11, поскольку в Sublime Text могут возникнуть проблемы как минимум с отображением
цветов aqua, fuchsia и lime.
bracketContentsOptions — стиль подчёркивания скобок, между которыми расположена каретка.
Значения: underline — подчерк прямой линией, stippled_underline — пунктирной, squiggly_underline
— волнистой. По умолчанию underline.





bracketsForeground — цвет подчёркивания скобок, когда рядом со скобками расположена
каретка.  Между тегами  вписывается цвет.
bracketsOptions — стиль подчёркивания скобок, рядом с которыми расположена каретка.
Значения: underline — подчерк прямой линией, stippled_underline — пунктирной, squiggly_underline
— волнистой. По умолчанию underline.





tagsForeground — цвет подчёркивания тегов. Когда каретка находится внутри тега, подчёркивается
как он сам, так и соответствующий ему открывающий/закрывающий тег.
tagsOptions — стиль подчёркивания тегов. Значения: underline — подчерк прямой линией,
stippled_underline — пунктирной, squiggly_underline — волнистой. По умолчанию stippled_underline .




Мне этого вполне хватает. Спасибо.


Ответ 2

Лучше, чем так, воспользоваться плагином BracketHighlighter. 

Частая проблема — скобки и кавычки как в коде, так и gutter (полоса, где номера строк)
подсвечиваются тем же цветом, что и текст. Чтобы её исправить, необходимо:


Preferences → Package Settings → BracketHighlighter → Bracket Settings - User → в
открывшийся файл вставляем следующий код → сохраняем файл.

{
"bracket_styles": {
    // This particular style is used to highlight
    // unmatched bracket pairs. It is a special
    // style.
    "unmatched": {
        "icon": "question",
        "color": "brackethighlighter.unmatched",
        "style": "highlight"
    },
    // User defined region styles
    "curly": {
        "icon": "curly_bracket",
        "color": "brackethighlighter.curly",
        "style": "highlight"
    },
    "round": {
        "icon": "round_bracket",
        "color": "brackethighlighter.round",
        "style": "outline"
    },
    "square": {
        "icon": "square_bracket",
        "color": "brackethighlighter.square",
        "style": "outline"
    },
    "angle": {
        "icon": "angle_bracket",
        "color": "brackethighlighter.angle",
        "style": "outline"
    },
    "tag": {
        "icon": "tag",
        "color": "brackethighlighter.tag",
        "style": "outline"
    },
    "single_quote": {
        "icon": "single_quote",
        "color": "brackethighlighter.quote",
        "style": "outline"
    },
    "double_quote": {
        "icon": "double_quote",
        "color": "brackethighlighter.quote",
        "style": "outline"
    },
    "regex": {
        "icon": "regex",
        "color": "brackethighlighter.quote",
        "style": "outline"
    }
  }
}

В файл своей цветовой схемы с расширением tmTheme (если не знаете, как его открыть,
см. здесь в самом начале) где-нибудь между тегами  вставляем следующие
строки:




    name
    Unmatched
    scope
    brackethighlighter.unmatched
    settings
    
        foreground
        #FD971F
    



    name
    BracketHighlighter: Curly
    scope
    brackethighlighter.curly
    settings
    
        foreground
        #FF0000
    



    name
    BracketHighlighter: Round
    scope
    brackethighlighter.round
    settings
    
        foreground
        lightblue
    



    name
    BracketHighlighter: Square
    scope
    brackethighlighter.square
    settings
    
        foreground
        pink
    



    name
    BracketHighlighter: Angle
    scope
    brackethighlighter.angle
    settings
    
        foreground
        #FEFE22
    



    name
    BracketHighlighter: Bracket Tag
    scope
    brackethighlighter.tag
    settings
    
        foreground
        violet
    



    name
    BracketHighlighter: Single Quote | Double Quote | Regex
    scope
    brackethighlighter.quote
    settings
    
        foreground
        palegreen
    




Между тегами  под foreground меняем цвета, как душе угодно.
Лучше прописывать их в HEX, а не X11 colors, поскольку в Sublime Text 3 могут некорректно
отображаться как минимум цвета aqua, fuchsia и lime.

Скобки, кавычки и их выделения в тексте должны получиться разноцветными: