CSS-club – настройка внешнего вида сайта

Шаблоны, код которых импортируется с помощью правила @import. Основная идея – упростить установку шаблона, избавиться от повторяющегося кода в настройках пользователей и необходимости обновлять его вручную. Из-за особенностей работы @import на Шикимори все шаблоны с @media рекомендуется делать в виде импортируемых шаблонов. О самом правиле можно прочитать тут: webref.ru.

Работа @import на Шикимори имеет свои особенности:

• @import встаивается в стиль
  Все @import'ы автоматически скачиваются на сервер Шикимори и встраиваются в готовый пользовательский стиль в открытом виде вне медиа-запроса, которым оборачиваются другие правила.

Пример:

спойлер

CSS в настройках


body {
  color: red;
}

@import url("https://example.com/css/import.css");


Обработанный CSS


/* https://example.com/css/import.css */
.example::after { content: "Imported!"; }

@media only screen and (min-width: 1024px) {
  body {
    color: red;
  }
}



• @import можно писать где угодно
  Из-за предыдущей особенности вы можете указывать @import там, где вам будет удобнее.


• @import можно делать напрямую с гитхаба
  Опять же из-за первой особенности @import не требует жесткой привязки к content-type импортируемого стиля: просто указывайте ссылку на raw.githubusercontent.com!


• @import кешируется!
  Эта информация для авторов стилей!
Стили по ссылке из import загружаются лишь один раз и кешируются сайтом. Из-за этого, изменяя импортируемый стиль, вы не увидите изменений на Шикимори: чтобы они отобразились, вам потребуется вручную сбросить кеш. Сделать это можно на странице /tests/reset_styles_cache – в поле ввода укажите ссылку на загружаемый стиль и нажмите кнопку «Submit».

Сброс кеша необходимо делать после обновления стилей. Сделав сброс кеша один раз, изменения увидят все пользователи импортирующие ваш стиль.