Шаблон:FlexBox: различия между версиями
Aylong (обсуждение | вклад) мНет описания правки |
Aylong (обсуждение | вклад) мНет описания правки |
||
| Строка 1: | Строка 1: | ||
<includeonly><templatestyles src="FlexBox/styles.css" /> | <includeonly><templatestyles src="FlexBox/styles.css" /> | ||
<div class="flexbox-container tgui-background" {{ColorPaletteStyles|{{{Color}}} | <div class="flexbox-container tgui-background" style="{{ColorPaletteStyles|{{{Color}}}}}"> | ||
<div class="flexbox-header"> | <div class="flexbox-header"> | ||
{{#if:{{{SubTitle|}}}|<div class="flexbox-subtitle" background: {{{TitleGradient}}};">{{{SubTitle}}}</div>|}} | {{#if:{{{SubTitle|}}}|<div class="flexbox-subtitle" background: {{{TitleGradient}}};">{{{SubTitle}}}</div>|}} | ||
| Строка 19: | Строка 19: | ||
</div> | </div> | ||
</div></includeonly><noinclude> | </div></includeonly><noinclude> | ||
{{ | {{Notice|Category=Шаблоны|Title=FloatingUI|Content=Шаблон использует [https://floating-ui.com FloatingUI]. А конкретно [[:Шаблон:Dropdown|Dropdown]].<br>Его можно использовать в другом скине, однако придётся отказаться от Dropdown, заменив его на чистый CSS вариант.}} | ||
= Что это? = | = Что это? = | ||
Добро пожаловать на страницу шаблона FlexBox! | Добро пожаловать на страницу шаблона FlexBox! | ||
Текущая версия от 07:55, 5 июня 2025
Что это?
Добро пожаловать на страницу шаблона FlexBox!
Этот шаблон можно использовать для самых разных вещей, но изначально был сделан для Космического Закона, из-за чего могут возникать соответствующие несостыковки и ограничения.
Основное преимушество - адаптивность. Шаблон нормально выглядит как на телефонах, так и на ПК, при этом оставаясь компактным.
Класс, а как использовать?
Ниже перечислен список доступных пропсов, если кто-то будет это дополнять, просьба вписывать их сюда же.
| Название | Описание |
|---|---|
| Color | Красит весь шаблон в любой доступный цвет ColorPalette |
| SubTitle | Изначально использовалось для номера статьи в КЗ. Необязательный проп. |
| Title | Основной текст сверху. Если не задать SubTitle, то будет использован его стиль. Так же это одновременно и якорь. |
| TitleElement | Определяет каким элементом будет тайтл, по-умолчанию: span. Необходимо для отображения тайтла в Содержании. Рекомендуется использовать h3-h6 если необходимо. |
| Image | Изображение с указанием размера, но без File: Использование: Clown.png{{!}}96px
|
| ImagePadding | Отступ от краёв контейнера изображения. По-умолчанию: 0. |
| Content | Основной текст в шаблоне, например, описание. |
| DropdownTextAlign | Расположение текста внутри дропдауна. По-умолчанию он центрирован. |
| DropdownTitle | Не отображается если не заполнен проп DropdownContent, задаёт надпись на кнопке раскрытия DropdownContent. По-умолчанию: Подробно
|
| DropdownContent | Содержимое дропдауна, без этого пропса дропдауна не будет. Лучше всего использовать для второстепенной информации. |
Примеры
Всё заполнено
{{FlexBox
| Color = Lavaland
| SubTitle = Класс
| Title = Ну типа это что-то
| TitleElement = h3
| Image = Clown.png{{!}}96px
| Content = Самый обыкновенный клоун. Рекомендуется избиение.
| DropdownTitle = Чё там ещё?
| DropdownContent = Избиение клоуна без причины - является нарушением правил сервера.
}}
Клоун
Или же... приколист
Минимальное заполнение
{{FlexBox
| Title = Клоун
| Content = Кусок бесполезности
| Image = Generic_clown.png{{!}}64px
}}
