Как сделать так, чтобы вложенные маркированные списки уценки имели разные стили маркеров в vscode

Я хочу иметь списки рендеринга vscode в уценке с маркерами вместо символа звездочки (*), чтобы верхний уровень использовал •, следующий - ◦ и т. Д.

Мой первый подход заключался в создании лигатурного шрифта с FontForge, который заменял * на ◦, пробел плюс * на ◦, два пробела плюс * на ▪ и так далее, но использование лигатур имеет очевидную проблему, заключающуюся в том, что они не зависят от контекста, поэтому все звездочки будут заменены, а не только перед строкой.

Глядя на API оформления текста vscode, кажется, что он ограничен простым изменением стиль и цвет шрифта, а не семейство шрифтов. Есть ли способ визуально заменить символы в vscode? Они по-прежнему должны быть сохранены как звездочки в исходном коде, чтобы иметь действительную уценку.


visual-studio-code vscode-extensions markdown monaco-editor ligature
person slikts    schedule 28.08.2018    source источник
comment
Вы говорите о выделении синтаксиса уценки или панели предварительного просмотра? В любом случае, вы можете добиться этого с помощью CSS.   -  person mb21    schedule 29.08.2018
comment
Об окне редактора, а не превью; в предварительном просмотре уже есть разные стили маркеров. Я не нашел способа стилизовать синтаксис редактора с помощью CSS за пределами API украшения, и он поддерживает только очень ограниченный CSS.   -  person slikts    schedule 29.08.2018
comment
да, похоже, в отличие от Atom, пользовательский CSS без темы не поддерживается VSCode. Я не очень хорошо знаю vscode, но полагаю, что правильный способ - создать тему и настроить ее грамматика textmate для уценки. Возможно, см. code.visualstudio.com/docs/extensions/   -  person mb21    schedule 30.08.2018

Ответы (1)


arrow_upward
2
arrow_downward

Начиная с VS Code 1.27, лучше всего написать расширение, которое для этого добавляет декораторы к символам *. Чтобы получить начал

Я не думаю, что текущий vscode API позволяет вам перезаписывать сам текст *, но вы можете попробовать эмулировать это, сделав символ * прозрачным и добавив после него свой собственный маркер:

const level1DecorationType = vscode.window.createTextEditorDecorationType({
    color: 'transparent',
    after: {
        contentText: "◦"
    }
});

Затем ваше расширение просто должно применить этот стиль к пунктам списка в документе.

Неофициально вы также можете использовать этот декоратор, чтобы полностью заменить символ *:

const level1DecorationType = vscode.window.createTextEditorDecorationType({
    color: 'transparent',
    textDecoration: `none; display: inline-block; width: 0;`,
    after: {
        contentText: "◦"
    }
});

Однако это не гарантирует правильной работы или продолжения работы в будущем.

Рассмотрите возможность открыть запрос функции, чтобы получить лучшую поддержку декораторов для этого

person Matt Bierner    schedule 05.09.2018
comment
Спасибо, в этом есть смысл; это фактически напомнило мне, где я видел элементы, добавленные к редактору - в CSS, где он добавляет предварительный просмотр цвета, но они работают не очень хорошо и часто немного запаздывают. - person slikts; 05.09.2018