Как изменить эффект дополнения кода в gitbook?

Question

Это эффект кода уценки в стеке:

Code from stackru
Nearly no extra space at the beginning

И это эффект кода уценки в gitbook:

Дополнительные пробелы в начале сбивают меня с толку. Поэтому я решил изменить это сам.

Я сделал:

cd /usr/local/lib/node_modules/gitbook/theme/stylesheets/base
vim markdown.less

В котором есть блок кода, который выглядит так:

code {
    padding: 0;
    padding-top: 0.2em;
    padding-bottom: 0.2em;
    margin: 0;
    font-size: 85%;
    background-color: #f7f7f7;
    border-radius: 3px;
}

Я изменил font-size в 385% а также border-radius в 0px, я использовал git serve . перезапустить сервер gitbook, но эффект кода не изменился.

Я получил эти файлы, которые havs code Ключевое слово в каталоге темы, которое я должен изменить?

.//assets/app.js
.//assets/fonts/fontawesome/fontawesome-webfont.svg
.//assets/fonts/fontawesome/fontawesome-webfont.ttf
.//assets/fonts/fontawesome/FontAwesome.otf
.//assets/print.css
.//assets/style.css
.//javascript/utils/sharing.js
.//stylesheets/base/markdown.less
.//stylesheets/base/normalize.less
.//stylesheets/website/highlight/night.less
.//stylesheets/website/highlight/white.less
.//stylesheets/website/markdown.less
.//templates/book/includes/exercise.html
.//templates/ebook/includes/exercise.html

Что еще я должен сделать?

Answer 1

Это должен быть комментарий, но вы не можете возиться с комментариями.

Как вы можете видеть ниже, информация о стиле, которую вы дали, не включает стили, которые вы хотите изменить, вы упустили некоторую важную информацию откуда-то.
Код, который вы включили, показан слева, описанная вами проблема - справа.

code {
    padding: 0;
    padding-top: 0.2em;
    padding-bottom: 0.2em;
    margin: 0;
    font-size: 85%;
    background-color: #f7f7f7;
    border-radius: 3px;
}

.described {
    padding: 20px;
}

<code>fprintf(...);</code>
<code class="described">fprintf(...);</code>

Answer 2

Чтобы переопределить стили Gitbook по умолчанию, создайте файл 'styles/website.css` в корневом каталоге вашего проекта gitbook.

Изменить book.json файл и добавьте следующее, чтобы определить источник ваших собственных стилей

{
    "styles": {
        "website": "styles/website.css",
        "ebook": "styles/ebook.css",
        "pdf": "styles/pdf.css",
        "mobi": "styles/mobi.css",
        "epub": "styles/epub.css"
    }
}

Все, что находится в этом файле, превзойдет стили Gitbook (если вы правильно назвали имена).

Затем выясните имена HTML-элементов, которые вы хотите применить, или измените стили, используя инспектор браузера. Откройте ваш проект Gitbook в браузере и щелкните правой кнопкой мыши на блоке кода, это вызовет меню с Inspect или Inspect Element.

Вам нужно будет перезагрузить gitbook serve при изменении стилей, так как он читает только styles/website.css файл при запуске.

Стили, которые я определил, чтобы переиграть Gitbook, можно увидеть в этом Github Gist

https://gist.github.com/jr0cket/9cc41eb9dd0b6c6d091831be43fa3e42

Результаты этих стилей банок можно увидеть по адресу:

https://practicalli.github.io/clojure/basic-clojure/

Спасибо