Участник:Kemran2933/box

Готовый код для Шаблон:Procedure. Код для переноса находится в разделе «Код Procedure».

Пример

Пример процедурыПример процедуры

Содержимое процедуры. Нажмите в любом месте заголовка, чтобы раскрыть или свернуть блок.

• Первый пункт.
• Второй пункт со ссылкой.

Ещё одна процедураЕщё одна процедура

Этот блок раскрывается независимо от первого.

Использование

{{Procedure
|название=Название процедуры
|содержание=Текст процедуры.
* Первый пункт.
* Второй пункт.
}}

Параметры: название (по умолчанию «Процедура») и содержание. Старый параметр палитра можно оставить в вызовах: он не используется. Ширина — 100% родительского блока. Раскрытие и сворачивание — HTML-переключатель и CSS, без JavaScript.

RoleCollapsibleBox: пример

Капитан

КапитанКапитан

Капитан обязан:

• Поддерживать работоспособность станции и отделов.
• При отсутствии глав отделов на станции Капитан должен назначить ВрИО глав до прибытия официально назначенных руководителей отделов с Центрального Командования либо взять управление отделом на себя.
• Контролировать и координировать работу глав и сотрудников отделов, распоряжаться ими для обеспечения выполнения задачи станции и распоряжений Центрального Командования, Космического Закона, норм экипажа и СРП.
• Держать диск ядерной аутентификации при себе. Если это не представляется возможным, диск следует передать главе службы безопасности или офицеру «Синий щит».
• Хранить надлежащим образом в защищённом месте документы и канцелярские принадлежности, включающие в себя карту запасного доступа.
• Капитан должен попытаться решить проблемы, возникшие в командном составе, сам, перед тем как оповещать ЦК.
• Использовать официальную речь при общении с экипажем и Центральным Командованием, проявлять уважение к переданным в подчинение сотрудникам.
• Обеспечить по возможности возврат предметов класса "хайриск" уволенных/ликвидированных глав на место их изначального содержания.

Капитан имеет право:

• Обладать абсолютными полномочиями в рамках станции и может отменить приказ любого другого сотрудника станции.
• Носить при себе церемониальный меч, станнер и антикварный лазерный пистолет (смотреть запреты), и иное летальное оружие в случае утраты пистолета.
• Заменять своей печатью и подписью печать и/или подпись любого другого сотрудника станции.
• Принимать решение об эвакуации со станции после консультации с Центральным командованием.

Капитану запрещено:

• Брать антикварный лазерный пистолет, если нет чрезвычайной ситуации, требующей его использования.
• Покидать станцию, за исключением случаев: получения разрешения от ЦК, эвакуации, проверки статуса цели или окончания смены. Нарушения данной рабочей процедуры достаточно для снятия с должности капитана.
• Заниматься оперативно-розыскной деятельностью подобно службе безопасности.
• Брать предметы из оружейной при обычных обстоятельствах без разрешения главы службы безопасности.
• Заказывать оружие в отделе снабжения/отделе исследований без видимой угрозы станции.
• Проводить процедуру увольнения/понижения в должности глав отделов, офицера "Синий щит", если только они не действуют против благополучия и безопасности экипажа и станции.

Код RoleCollapsibleBox

Скопируйте содержимое следующего блока в Шаблон:RoleCollapsibleBox. Параметры: название, иконка, ссылка, содержание. Свободное место заголовка раскрывает блок; иконка и название ведут по ссылке.

{{#css:
.ss220-role.tabs-togglebox {display:block; box-sizing:border-box; width:100%; max-width:100%; margin:8px 0; border:1px solid #2b3139; border-radius:8px; overflow:hidden; background:#191f26; color:#c5c9ce;}
.ss220-role.tabs-togglebox > .tabs-container {position:relative; display:grid;  border:0; padding:0; background:transparent;}

.ss220-role.tabs-togglebox > .tabs-container > .tabs-input {display:block !important; position:absolute; top:0; left:0; width:100%; height:104px; margin:0; padding:0; opacity:0; z-index:2; cursor:pointer;}
.ss220-role.tabs-togglebox > .tabs-container > .tabs-label {display:flex; align-items:flex-end; gap:10px; box-sizing:border-box; width:100%; min-height:104px; margin:0; padding:6px 12px; border:0; border-radius:0; background:transparent; color:inherit; font:400 16px/1.3 Roboto,Arial,sans-serif; cursor:pointer; user-select:none;}
.ss220-role .tabs-label::before {content:""; width:5px; height:5px; flex:none; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:rotate(-45deg); transition:transform .25s ease;}
.ss220-role .tabs-input:checked + .tabs-label::before {transform:rotate(45deg);}
.ss220-role.tabs-togglebox .tabs-input:checked + .tabs-label .tabs-open, .ss220-role .tabs-label .tabs-open {display:inline !important;}
.ss220-role .tabs-label .tabs-close {display:none;}
.ss220-role .tabs-input:focus + .tabs-label {outline:none; box-shadow:none;}
.ss220-role.tabs-togglebox > .tabs-container > .tabs-content {display:grid; grid-template-rows:0fr; min-height:0; height:auto; max-height:none; overflow:hidden; margin:0; padding:0; border:0; opacity:0; visibility:hidden; transition:grid-template-rows .25s ease, opacity .25s ease, visibility .25s ease;}
.ss220-role.tabs-togglebox > .tabs-container > .tabs-input:checked ~ .tabs-content {grid-template-rows:1fr; opacity:1; visibility:visible;}
.ss220-role .ss220-role-body {min-height:0; overflow:hidden;}
.ss220-role .ss220-role-inner {border-top:2px solid #405a75; padding:14px 16px; line-height:1.55;}
.ss220-role .tabs-label::before {margin-bottom:8px;}
.ss220-role-shell {position:relative; width:100%; margin:8px 0;}
.ss220-role-shell > .role-header {position:absolute; top:6px; left:36px; max-width:calc(100% - 48px); height:92px; display:flex; align-items:flex-end; gap:10px;  z-index:3;}
.ss220-role.tabs-togglebox {margin:0;}
.ss220-role .tabs-label .tabs-open {color:transparent; font-size:0;}
.ss220-role-shell > .role-header .role-title {font-size:1.8em; font-weight:400;}
.ss220-role-shell > .role-header a {position:relative; }
.ss220-role .role-section-title {color:#fff; font-weight:600; font-size:1.05em; border-bottom:2px solid #3e5774; margin-top:16px; margin-bottom:1px;}
.ss220-role .role-section-title:first-child {margin-top:0;}
@media (prefers-reduced-motion:reduce) {.ss220-role.tabs-togglebox > .tabs-container, .ss220-role.tabs-togglebox > .tabs-container > .tabs-content, .ss220-role .tabs-label::before {transition:none;}
}
}}
<div class="ss220-role-shell">
<div class="role-header">{{#if:{{{иконка|}}}|[[File:{{{иконка}}}|92x92px|link={{{ссылка|}}}]]}}<span class="role-title">{{#if:{{{ссылка|}}}|[[{{{ссылка}}}|{{{название|Роль}}}]]|{{{название|Роль}}}}}</span></div>
{{#tag:tab|
<div class="ss220-role-body"><div class="ss220-role-inner">
{{{содержание|}}}
</div></div>
|class=ss220-role
|name={{{название|Роль}}}
|collapsed=collapsed
}}
</div>

Код Procedure

{{#css:
.ss220-procedure.tabs-togglebox {display:block; box-sizing:border-box; width:100%; max-width:100%; margin:8px 0; border:1px solid #2b3139; border-radius:8px; overflow:hidden; background:#191f26; color:#c5c9ce;}
.ss220-procedure.tabs-togglebox > .tabs-container {position:relative; display:grid;  border:0; padding:0; background:transparent;}

.ss220-procedure.tabs-togglebox > .tabs-container > .tabs-input {display:block !important; position:absolute; top:0; left:0; width:100%; height:27px; margin:0; padding:0; opacity:0; z-index:2; cursor:pointer;}
.ss220-procedure.tabs-togglebox > .tabs-container > .tabs-label {display:flex; align-items:center; gap:7px; box-sizing:border-box; width:100%; min-height:27px; margin:0; padding:4px 9px; border:0; border-radius:0; background:transparent; color:inherit; font:700 12px/18px Roboto,Arial,sans-serif; cursor:pointer; user-select:none;}
.ss220-procedure .tabs-label::before {content:""; width:5px; height:5px; flex:none; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:rotate(-45deg); transition:transform .25s ease;}
.ss220-procedure .tabs-input:checked + .tabs-label::before {transform:rotate(45deg);}
.ss220-procedure.tabs-togglebox .tabs-input:checked + .tabs-label .tabs-open, .ss220-procedure .tabs-label .tabs-open {display:inline !important;}
.ss220-procedure .tabs-label .tabs-close {display:none;}
.ss220-procedure .tabs-input:focus + .tabs-label {outline:none; box-shadow:none;}
.ss220-procedure.tabs-togglebox > .tabs-container > .tabs-content {display:grid; grid-template-rows:0fr; min-height:0; height:auto; max-height:none; overflow:hidden; margin:0; padding:0; border:0; opacity:0; visibility:hidden; transition:grid-template-rows .25s ease, opacity .25s ease, visibility .25s ease;}
.ss220-procedure.tabs-togglebox > .tabs-container > .tabs-input:checked ~ .tabs-content {grid-template-rows:1fr; opacity:1; visibility:visible;}
.ss220-procedure .ss220-procedure-body {min-height:0; overflow:hidden;}
.ss220-procedure .ss220-procedure-inner {border-top:2px solid #405a75; padding:12px 14px; line-height:1.5;}
@media (prefers-reduced-motion:reduce) {.ss220-procedure.tabs-togglebox > .tabs-container, .ss220-procedure.tabs-togglebox > .tabs-container > .tabs-content, .ss220-procedure .tabs-label::before {transition:none;}
}
}}
{{#tag:tab|
<div class="ss220-procedure-body"><div class="ss220-procedure-inner">
{{{содержание|}}}
</div></div>
|class=ss220-procedure
|name={{{название|Процедура}}}
|collapsed=collapsed
}}