Fandom Developers Wiki
Advertisement

Quote — модуль для создания стилизованных цитат. Модуль позволяет создавать как цитаты, так и диалоги.

Особенности[]

  • Кастомизация при помощи классов, стилей и таблиц CSS.
  • Хорошая производительность а также совместимость с предыдущей версией шаблона (без Lua).
  • Используется современная разметка для SEO, доступности и поддержки мобильных устройств.
  • Дополнительные опции, такие как позиционирование цитаты слева или справа. Если не все важные параметры заданы, то шаблон всё ещё будет нормально функционировать.

Установка[]

Модуль[]

Для начала нужно импортировать модуль. Для этого не нужно копировать весь код, достаточно создать страницу Модуль:Quote, в котором будет код ниже:

return require('Dev:Quote')

CSS[]

После этого добавьте содержимое страницы MediaWiki:Global Lua Modules/Quote.css в ваш Common.css или FandomDesktop.css, или же скопировать туда код ниже:

:root {
    --pull-quote-max-width: 80%;
    --pull-quote-text-color: var(--theme-page-text-color, rgba(0, 0, 0, .8));
    --pull-quote-mark-color: rgba(var(--theme-page-text-color--rgb), .15);
    --pull-quote-mark-font: "Times New Roman", serif;
    --pull-quote-hyphens: auto;
    --pull-quote-frame-color: #bbb;
}

/* #content added as a parent selector to the following in order to override default blockquote styles. */

#content .pull-quote {
    display: flex;
    flex-wrap: wrap;
    max-width: var(--pull-quote-max-width);
    margin: 1em auto;
    font-size: 1em;
    line-height: 1.8;
    overflow: hidden;
}

#content .pull-quote__text {
    flex-basis: 100%;
    position: relative;
    padding: 0 2em;
    hyphens: var(--pull-quote-hyphens);
    color: var(--pull-quote-text-color);
    font-size: inherit;
}

#content .pull-quote__text::before, #content .pull-quote__text::after {
    display: inline;
    position: absolute;
    font-size: 3em;
    font-family: var(--pull-quote-mark-font);
    font-weight: 700;
    color: var(--pull-quote-mark-color);
}

#content .pull-quote__text::before {
    content: "“";
    top: 0;
    left: 0;
    line-height: 1;
}

#content .pull-quote__text::after {
    content: "”";
    bottom: 0;
    right: 0.1em; /* avoid clipping to edge due to italics */
    line-height: 0.2;
}

#content .pull-quote__text p:last-child {
    margin-bottom: 0;
}

/* render newline (\n) characters inside quote contents */
#content .pull-quote__text p {
    white-space: pre-line;
}
#content .pull-quote__line p {
    display: inline;
    white-space: pre-line;
}

#content .pull-quote__source {
    margin-left: auto;
}

#content .pull-quote__source cite {
    display: inline;
}

#content .pull-quote__source::before {
    content: "—"; 
}

#content .pull-quote--right, #content .pull-quote--left {
    border: 1px solid var(--pull-quote-frame-color);
    border-left: 0;
    border-right: 0;
    padding: 1em 0;
    text-align: justify;
}

#content .pull-quote--right {
    float: right;
    margin: 1em 0 1em 2em;
}

#content .pull-quote--left {
    float: left;
    margin: 1em 2em 1em 0;
}

Шаблон[]

Данный модуль был разработан для работы через шаблон. Чтобы создать шаблон (например Шаблон:Quote) вставьте код ниже:

{{#invoke:Quote|quote}}

Теперь этот шаблон может принимать параметры перечисленные ниже.

Чтобы создать шаблон для диалогов (например Шаблон:Dialogue), вставьте код ниже:

{{#invoke:Quote|dialogue}}

Теперь этот шаблон может принимать параметры перечисленные ниже.

Параметры можно вводить напрямую в функцию {{#invoke:}} или через шаблон. Значения введённые напрямую перекрывают занчения введённые через шаблон.

Значения[]

См. примеры использования параметров ниже.

Цитата[]

Название параметра Описание Обязательный? Значение по умолчанию
безымянный параметр 1, или text, или quotetext Текст цитаты. Да
безымянный параметр 2, или person, или personquoted Имя персоны, которая сказала цитату. Нет
безымянный параметр 3, или source, или quotesource Источник цитаты (например название книги, фильма, игры и т.д.) Нет

Диалог[]

Название параметра Описание Обязательный? Значение по умолчанию
Нечётные безымянные параметры Персоны, которые произносят цитаты. Да
Чётные безымянные параметры Текст персоны из прошлого введённого параметра. Да
context Контекст диалога (например событие). Нет
source Источник цитаты (например название книги, фильма, игры и т.д.) Нет

Оба шаблона[]

Название параметра Описание Обязательный? Значение по умолчанию
align Расположение шаблона, может быть left, right или center. По умолчанию цитата будет расположена посередине страницы. Нет center
width Ширина цитаты в пикселях. Этот параметр влияет только на шаблоны слева и справа (параметр align задан как left или right). Нет 300px
class Дополнительные классы CSS. Нет
style Дополнительные стили цитаты. Нет

Дизайн[]

Некоторые вики-сообщества хотят кастомизировать внешний вид цитат. Стили для этого шаблона были написаны с пониманием этого факта, добавляя параметры изменения внешнего видя при помощи свойств и переменных. Чтобы изменить их, измените их значения в селекторе :root. Они приведены ниже:

:root {
  /* Максимальная ширина цитат, расположенных по центру. */
  --pull-quote-max-width: ;

  /* Цвет текста цитаты. */
  --pull-quote-text-color: ;

  /* Цвет знака ". */
  --pull-quote-mark-color: ;

  /* Шрифт знака ". Шрифты с засечками подходят лучше всего для волнистых кавычек. */
  --pull-quote-mark-font: ;

  /* Determines how lines are broken; the default value is to use hyphens. */
  --pull-quote-hyphens: ;

  /* Для цитат слева и справа задаёт цвет нижней и верхней границы шаблона. */
  --pull-quote-frame-color: ;
}

Чтобы изменить остальные элементы вам нужно изменять стили вручную.

Примеры[]

Простейший[]

{{quote
|text   = Съешь ещё этих мягких французских булок, да выпей же чаю.
|person = Иван Иванов
|source = ''Новая надежда''
}}

Даёт:

Съешь ещё этих мягких французских булок, да выпей же чаю.

Иван Иванов, Новая надежда

С левой стороны[]

{{quote
|text   = Съешь ещё этих мягких французских булок, да выпей же чаю.
|person = Иван Иванов
|source = ''Новая надежда''
|align  = left
}}

Даёт:

Съешь ещё этих мягких французских булок, да выпей же чаю.

Иван Иванов, Новая надежда

С правой стороны[]

{{quote
|text   = Съешь ещё этих мягких французских булок, да выпей же чаю.
|person = Иван Иванов
|source = ''Новая надежда''
|align  = right
}}

Даёт:

Съешь ещё этих мягких французских булок, да выпей же чаю.

Иван Иванов, Новая надежда

Диалог[]

{{dialogue
|Восслер
|Послушай меня, Баш. В твоей клетке нет решёток, но это по-прежднему клетка. Глаза Сопротивления смотрят не моргая.
|Баш
|Дай же им смотреть. Я знаю кое-что о клетках.
|context = Восслер и Баш
|source  = ''Final Fantasy XII''
}}

Даёт:

Восслер:

Послушай меня, Баш. В твоей клетке нет решёток, но это по-прежднему клетка. Глаза Сопротивления смотрят не моргая.

Баш:

Дай же им смотреть. Я знаю кое-что о клетках.

Восслер и Баш, Final Fantasy XII
Advertisement