Примечание:
Эта страница содержит визуальную тему, используемую на данной вики.
Подключение темы к другим страницам осуществляется с помощью следующего кода (указывается в начале страницы) Нажмите на блок, чтобы скопировать код:
Страница, объединяющая все визуальные темы в единый список, расположена по ссылке: Хаб визуальных тем.
Рейтинг:
Пример форматирования
Что это?
Это тема, созданная Lt Flops. Она является эстетическим улучшением Sigma-101, на которой основана.
Используйте данную тему, только если понимаете, что вы делаете.
Данная тема несовместима с Black Highlighter, BASALT или Sigma+.
Как использовать
Для подключения этой темы, пожалуйста, скопируйте данный синтаксис и вставьте его в самое начало своей статьи:
[[include theme:flopstyle]]
Если вы хотите использовать эту тему с другой темой, основанной на Sigma-9 или Sigma-10, сначала вставьте Flopstyle, а потом уже выбранную вами тему. Также может потребоваться тонкая настройка визуальной темы.
Прошу также учесть, что данная тема включает в себя следующие компоненты:
- Croqstyle за авторством Croquembouche
- Визуальный элемент Fade In (с параметром speed=1) за авторством Croquembouche
- Визуальный элемент Toggle Sidebar за авторством EstrellaYoshte
Эта тема была создана с учётом следующих компонентов…
Центрированный заголовок Sigma-9
Для использования этого компонента, вставьте код ниже после подключения Flopstyle. Если ваша статья использует тему на базе Sigma-9 помимо Flopstyle, вставьте этот код после подключения второй темы:
[[include component:centered-header-sigma-9]]
Вы можете по своему желанию изменить заголовок, подзаголовок, их цвета и логотип в хедэре. Просто вставьте этот код после include с компонентом заголовка, а затем отредактируйте соответствующим образом:
[[module CSS]]
:root {
--header-title: "ЗАГОЛОВОК";
--header-subtitle: "ПОДЗАГОЛОВОК";
--titleColor: цвет_заголовка;
--subtitleColor: цвет_подзаголовка;
--lgurl: url(АДРЕС_ЛОГОТИПА);
}
[[/module]]
Плашка Flops
[[include component:flops-header
item=
containment=
level=
security=
disruption=
disruption-bg-color=
]]
Sidebox'ы
Адаптированы из темы Penumbra за авторством EstrellaYoshte.
Sidebox'ы - встроенные компоненты, которые бывают двух типов:
- authorbox
- sidebox
Инструкции по использованию зависят от типа.
- authorbox не отображается на экранах с шириной меньше width=1200px, включая мобильные устройства. Его можно использовать для отображения информации о статье и авторе.
- sidebox сворачивается за границу страницы на экранах с шириной меньше width=1200px. На таких экранах он доступен при нажатии на него или наведении курсора. Его можно использовать для отображения дополнительной информации.
Учтите эти ограничения перед тем как добавлять эти компоненты в свою статью — большая часть аудитории SCP вики просматривает сайт с мобильных устройств.
1. Authorbox
(См. верхний левый угол страницы)
По умолчанию, authorbox включён на всех страницах, что используют Flopstyle: LITE. Если вы хотите убрать его, замените:
[[include theme:flopstyle]]
На это:
[[div style="display: none;"]]
[[include theme:flopstyle]]
[[/div]]
Альтернатива 1: После удаления authorbox, вы можете заменить его собственной версией, которая будет отображать ту информацию, которую вы хотите. Этот функционал может быть особенно полезен для совместных, переписанных или переведённых статей. Для примера, вот код для создания authorbox:
[[div class="anchor"]]Устанавливает позицию authorbox'а.
[[div class="authorbox"]]
[[module ListPages name="="]]
||~ %%title%% ||
||= **By:** %%created_by_linked%% ||
||~ Published on %%created_at|%d %b %Y%% ||
[[/module]]
|| Опциональный текст ||
[[/div]]
[[/div]]Устанавливает конец якоря.
По умолчанию, authorbox использует ListPages для автоматического отображения метаданных. В теории, можно было бы скопировать часть authorbox с ListPages на любую страницу на вики и эти поля отображали бы корректную информацию. Вы, конечно же, можете менять эти поля как вам угодно.
Вы также можете отредактировать свой пользовательский authorbox, чтобы в нём отображалась специфический для вашей страницы текст. Например, заметка для читателей.
Обратитесь к левой части этой страницы за примером рабочего authorbox.
Внутри authorbox вы можете использовать только flavorbox и никакие другие блоки.
Альтернатива 2: Если хотите, вы можете переместить authorbox на правую часть страницы. Для этого вставьте код ниже в модуль CSS в начале вашей статьи:
.authorbox {
right: unset;
left: 103.5%;
padding: 0 0 0 1em;
}
Если вы используете это на своей странице, я настоятельно рекомендую не добавлять дополнительных sideboxов на той же странице, иначе всё может поломаться.
Если вы планируете добавить на свою страницу sidecontainerы, я настоятельно рекомендую использовать стандартное расположение authorbox, по той причине, что когда правосторонний authorbox используется вместе с sidecontainer, произойдёт визуальное наложение элементов, что будет выглядеть очень некрасиво. Это может запутать читателей, так что лучше оставить всё на безопасной стороне.
2. Sidebox
sidebox по умолчанию выключен. Создать его можно следующим образом:
[[div class="limit"]] Устанавливает начало якоря.
[[div class="anchor"]] Устанавливает позицию sidebox'а.
[[div class="sidebox"]]
Тут пишется желаемый текст для sidebox.
[[/div]]
[[/div]]
А тут уже текст, рядом с которым должен висеть sidebox.
[[/div]] Устанавливает конец якоря.
Я рекомендую вручную ставить перенос строки после текста, рядом с которым висит sidebox. Это можно сделать, добавив @@ с двух сторон от пробела на пустой строке2. sidebox появится возле этого текста, когда вы прокрутите мимо него.
Помните про div limit. Без limit, anchor заставит sidebox висеть на протяжении всей статьи, после того как вы прокрутите мимо точки начала якоря.
Прочие изменяемые секции
При надобности вы можете также изменить любые из этих свойств CSS, чтобы они лучше подходили под ваши нужды. Этот список не покрывает все стили Flopstyle, однако он является хорошей отправной точкой.
Изменить свойства компонента Info
.info-container {
/* = Изменяйте цвет в соответствии с темой сайта = */
--barColour: цвет_полосы;
}
#u-author_block {
display: none;
}
Изменить цвет подзаголовка lite-heading
.lite-heading h3 {
/* = Изменяйте цвет в соответствии с темой сайта = */
color: цвет_lite_heading;
}
Изменить цвет левого края card-block и sidebox
:root {
--accentColor: акцентный_цвет;
}
Изменить логотип простого блока-предупреждения
(Изображение должно быть прозрачным)
.warning-notice {
background-image: url(АДРЕС_ЛОГОТИПА);
background-size: 400px;
}
Изменить логотип продвинутого блока-предупреждения
(Изображение должно быть прозрачным)
.council {
background-image: url(АДРЕС_ЛОГОТИПА);
}
Изменить фон навигации по циклу
.series-nav {
background:
linear-gradient(
to bottom right,
hsla(0, 0%, 100%, 1),
ЦВЕТ_СЮДА);
}
Скрыть заголовок страницы
#page-title {
display: none;
}
Скрыть футер со сносками
.footnotes-footer {
display: none;
}