TiddlyWiki5 и highlight.js — Как изменить стиль/тему подсветки синтаксиса?

Я использую TiddlyWiki версии 5.1.13. Я добавил плагин выделения (версия 5.1.13), который использует highlight.js (версия 8.8.0).

В тиддлере я успешно выделяю XML следующим образом:

```xml
  <html>
    <body>
    </body>
  </html>
```

Как я могу изменить стиль/тему выделения на один из различных стилей highlight.js? (стили Highlight.js)


themes highlight highlight.js tiddlywiki tiddlywiki5
person Dennis    schedule 20.04.2017    source источник
comment
Кстати, именно так можно выделить код и в SO. подмигнуть   -  person s3c    schedule 14.02.2021

Ответы (3)


arrow_upward
13
arrow_downward

Когда вы добавляете Highlight.js в каталог вашего сайта, он содержит каталог с именем styles. Внутри этого каталога у вас есть стили для всех тем, доступных в Highlight.js.

Чтобы переключиться на другую тему, просто переключите эту строку

<link rel="stylesheet" href="/path/to/styles/default.css">

к чему-то вроде этого:

<link rel="stylesheet" href="/path/to/styles/pick-theme-name-here.css">

person MadPhysicist    schedule 23.09.2017

arrow_upward
4
arrow_downward

Вот URL-адрес каталога стилей в репозитории highlight.js.

Мне показалось полезным найти название темы Vs 2015, которое не vs-2015, а скорее vs2015.

Я импортирую стили из CDN:

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/10.0.3/styles/default.min.css">
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/10.0.3/styles/vs2015.min.css">

Кроме того, для справки, Vs 2015 очень похож на тему Dark+ (default dark) VS Code. Это тема по умолчанию, которая поставляется с VS Code.

person agm1984    schedule 28.05.2020

arrow_upward
0
arrow_downward

Ответ MadPhysicist ниже не так прав, как может быть. Я использую версию highlight.js 10.3.1, а стиль css доступен только в .min на cdnjs. Таким образом, вы должны указать «выбрать-имя-темы-здесь.min.css», а не «выбрать-имя-темы-здесь.js».

Ex :

https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.3.1/styles/solarized-light.css

=> 404

https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.3.1/styles/solarized-light.min.css

=› доступно

person lsmpascal    schedule 29.10.2020
comment
Это больше похоже на описание проблемы, чем на ответ. Не могли бы вы уточнить, как это помогает решить описанную проблему? - person Yunnosch; 29.10.2020
comment
Вы правы, но я действительно не знал, куда это поместить. Ответ MadPhysicist неверен, так как вы должны указать имя-темы-здесь.min.css, а не имя-темы-здесь.js. Может быть, мне следует только прокомментировать его сообщение, а не создавать ответ. - person lsmpascal; 30.10.2020
comment
Либо сделайте это, чтобы предоставить полезную обратную связь, либо добавьте всю информацию и контекст здесь (с противопоставлением или без противопоставления другому ответу), чтобы сделать полный конкурентоспособный ответ. - person Yunnosch; 30.10.2020
comment
Я не уверен, что полностью понял то, что вы объяснили: с моим редактированием мой ответ теперь правильный? - person lsmpascal; 02.11.2020
comment
Выглядит хорошо сейчас. - person Yunnosch; 02.11.2020