шаблон анкеты

hide-autor
[html]
<style type="text/css">
.otsttext{
padding: 15px !important;
font-size: 12px;
}

</style>
<div class="fon">
<div class="bac">
<div class="namet">
<div class="bacname"><center>шаблон анкеты</center></div></div></div><br/><br/>
<div class="otsttext"><center>
для того, чтобы туманный Эврика-Спрингс открыл для вас свои двери, вам следует создать анкету в данном разделе новой темой по следующему принципу: имя и фамилия на англ., возраст, например: john smith, 45. если берете персонажа из акции или сюжетной ветки, не забудьте добавить ее название в квадратных скобках: john smith, 45 [отель/колледж/хранители].</center></div></div></div>[/html]

заполнить анкету

[html]
<div class="anketaGen" data-anketa-gen>

<div class="anketaGen__alert anketaGen__alert--err" data-anketa-alert="error" style="display:none"></div>
<div class="anketaGen__alert anketaGen__alert--ok" data-anketa-alert="success" style="display:none"></div>

<div class="anketaGen__box">
<div class="anketaGen__head">
<div class="anketaGen__title"><center>шаблон анкеты</center></div>
</div>
<div class="anketaGen__hint anketaGen__hint--pill">
заполняем поля формы, нажимаем «сгенерировать», копируем готовый код и публикуем его в новой теме в <a href="https://rehaze.ru/viewforum.php?id=5" target="_blank" rel="noopener">раздела регистрации</a>.
</div>
<div class="anketaGen__grid2">
<label class="anketaGen__field">
<div class="anketaGen__label">ИМЯ ФАМИЛИЯ (АНГЛ.)</div>
<input class="anketaGen__input" type="text" data-anketa-field="nameEn" placeholder="NAME SURNAME">
</label>

<label class="anketaGen__field">
<div class="anketaGen__label">ИМЯ ФАМИЛИЯ (РУ.)</div>
<input class="anketaGen__input" type="text" data-anketa-field="nameRu" placeholder="имя фамилия">
</label>
</div>

<div class="anketaGen__grid2">
<label class="anketaGen__field">
<div class="anketaGen__label">ВОЗРАСТ</div>
<input class="anketaGen__input" type="text" data-anketa-field="age" placeholder="xx лет">
</label>

<label class="anketaGen__field">
<div class="anketaGen__label">СЕМЕЙНОЕ ПОЛОЖЕНИЕ</div>
<input class="anketaGen__input" type="text" data-anketa-field="family"
placeholder="холост / не замужем / замужем / женат / в разводе">
</label>
</div>

<div class="anketaGen__grid2">
<label class="anketaGen__field">
<div class="anketaGen__label">ЗАНЯТОСТЬ</div>
<input class="anketaGen__input" type="text" data-anketa-field="job" placeholder="например: бармен / студент / ...">
</label>

<label class="anketaGen__field">
<div class="anketaGen__label">ВНЕШНОСТЬ ПЕРСОНАЖА</div>
<input class="anketaGen__input" type="text" data-anketa-field="face" placeholder="внешность персонажа на англ., например: brad pitt">
</label>
</div>

<label class="anketaGen__field">
<div class="anketaGen__label">ИЗОБРАЖЕНИЯ</div>
<div class="anketaGen__hint">можно добавить до 5 изображений, но одинаковой высоты и суммарной шириной не более 700 px.</div>

<div class="anketaGen__images" data-anketa-images>
<div class="anketaGen__imgRow" data-anketa-image-row>
<input class="anketaGen__input" type="url" data-anketa-image placeholder="https://i.imgur.com/...">
<button type="button" class="anketaGen__iconBtn" data-anketa-action="removeImage" title="Удалить">−</button>
</div>
</div>

<button type="button" class="anketaGen__addBtn" data-anketa-action="addImage">+</button>
</label>


<details class="anketaGen__hprev" data-anketa-hprev>
<summary class="anketaGen__hprevSum">превью шапки</summary>

<div class="anketaGen__hprevBody">
<div class="anketaHdrPrev">
<div class="anketaHdrPrev__nameEn" data-hprev="nameEn">NAME SURNAME</div>
<div class="anketaHdrPrev__nameRu" data-hprev="nameRu">имя фамилия</div>
<div class="anketaHdrPrev__meta" data-hprev="meta">✧ возраст ✧ занятость ✧ семейное положение ✧</div>

<div class="anketaHdrPrev__imgs" data-hprev="imgs"></div>

<div class="anketaHdrPrev__face" data-hprev="face">— внешность персонажа англ. —</div>
</div>

<div class="anketaHdrPrev__stats">
<span class="anketaHdrPrev__warn" data-hprev="warn" style="display:none"></span>
</div>
</div>
</details>

<label class="anketaGen__field">
<div class="anketaGen__label">ЗАГОЛОВОК</div>
<input class="anketaGen__input" type="text" data-anketa-field="title"
value="откуда ты? как попал в эврика-спрингс?">
</label>

<div class="anketaGen__field">
<div class="anketaGen__label">ИНФОРМАЦИЯ О ПЕРСОНАЖЕ</div>

<div class="anketaGen__toolbar" data-anketa-toolbar></div>

<textarea class="anketaGen__input anketaGen__textarea anketaGen__textarea--bio" rows="8"
data-anketa-field="bio"
placeholder="информация о вашем персонаже в свободной форме; упрощенный вариант — 5 любых фактов"></textarea>
</div>

<label class="anketaGen__field">
<div class="anketaGen__label">ОТКУДА УЗНАЛИ О НАС?</div>
<input class="anketaGen__input" type="text" data-anketa-field="howFound"
placeholder="рпг-топ / партнерка / реклама / ...">
</label>

<div class="anketaGen__grid2">
<label class="anketaGen__field">
<div class="anketaGen__label">СВЯЗЬ С ВАМИ</div>
<textarea class="anketaGen__input anketaGen__textarea anketaGen__textarea--sm" rows="3"
data-anketa-field="contact"
placeholder="например: tg @name, желательно не просто «лс»"></textarea>
</label>

<label class="anketaGen__field">
<div class="anketaGen__label">ТВИНКИ</div>
<textarea class="anketaGen__input anketaGen__textarea anketaGen__textarea--sm" rows="3"
data-anketa-field="twinks"
placeholder="заполняется обязательно; мы никого не сдеаноним без разрешения, но это нужно для понимания амс. если нет — пишем «нет»"></textarea>
</label>
</div>


<div class="anketaGen__actionsBar">
<div class="anketaGen__actions">
<button type="button" class="anketaGen__btn" data-anketa-action="generate">Сгенерировать</button>
<button type="button" class="anketaGen__btn anketaGen__btn--ghost" data-anketa-action="copy" disabled>Копировать</button>
</div>

<div class="anketaGen__checks anketaGen__checks--bar">
<label class="anketaGen__check">
<input type="checkbox" data-anketa-field="hideContact">
<span>связь в хайде</span>
</label>

<label class="anketaGen__check">
<input type="checkbox" data-anketa-field="hideTwinks">
<span>связь и твинки в хайде</span>
</label>
</div>
</div>

<div class="anketaGen__outHead">
<textarea class="anketaGen__output" rows="8" data-anketa-output
placeholder="здесь появится сгенерированный код для вставки"></textarea>
</div>
</div>

<link rel="stylesheet" href="https://forumstatic.ru/files/001b/d4/18/88291.css">

<script src="https://forumstatic.ru/files/001b/d4/18/65758.js" defer></script>

<script>
document.addEventListener("DOMContentLoaded", () => {
document.querySelectorAll("[data-anketa-gen]").forEach((root) => {
const imagesBox = root.querySelector("[data-anketa-images]");
const addBtn = root.querySelector('[data-anketa-action="addImage"]');
if (!imagesBox || !addBtn) return;

const MAX = 5;

// делаем кнопку “встроенной” по стилю
addBtn.classList.add("anketaGen__addBtn--inline");

const refresh = () => {
const rows = Array.from(imagesBox.querySelectorAll("[data-anketa-image-row]"));
if (!rows.length) return;

const count = rows.length;
const lastRow = rows[rows.length - 1];

// если достигли лимита — прячем кнопку
if (count >= MAX) {
addBtn.style.display = "none";
return;
}

// иначе показываем и переносим в последнюю строку (перед минусом)
addBtn.style.display = "";

const rm = lastRow.querySelector('[data-anketa-action="removeImage"]');
if (rm && addBtn.parentNode !== lastRow) {
lastRow.insertBefore(addBtn, rm);
} else if (addBtn.parentNode !== lastRow) {
lastRow.appendChild(addBtn);
}
};

// первичная раскладка
refresh();
// на случай, если внешний скрипт успевает дорисовать DOM чуть позже
setTimeout(refresh, 0);

// после кликов на +/− обновляем раскладку
root.addEventListener("click", (e) => {
const btn = e.target.closest("[data-anketa-action]");
if (!btn) return;
const act = btn.getAttribute("data-anketa-action");
if (act === "addImage" || act === "removeImage") {
setTimeout(refresh, 0);
}
});

// если строки меняются не только через клики (на всякий)
new MutationObserver(() => refresh()).observe(imagesBox, { childList: true });
});
});
</script>[/html]

hide-autor

NAME SURNAME
имя и фамилия на русском
✧ дата рождения ✧ профессия ✧ семейное положение
-- --
— на англ имя внешности —

[indent]
❛❛
откуда ты? как попал в эврика-спрингс?

несколько фактов о персонаже

связь с вами / твинки: можно под хайдом или в открытую

Код:

[align=center][/align]
[align=center][size=32][b][font=AromeDisplay] NAME SURNAME[/font][/b][/size]
[font=Montserrat][size=16]имя и фамилия на русском[/size]
✧  дата рождения ✧ профессия ✧ семейное положение[/font]
[img]картинка[/img] [img]картинка[/img]
[font=Sirius Cursiv]— на англ имя внешности — [/font][/align]
[table layout=fixed width=100%][tr][td width=5%][/td][td width=75%] [indent] 
[size=50]❛❛[/size]
[align=center][font=Foglihtenno][b][size=16]откуда ты? как попал в эврика-спрингс?[/size][/b][/font][/align]

[quote]

несколько фактов о персонаже


[b]связь с вами / твинки:[/b] можно под хайдом или в открытую
[/quote]
[/td][td width=5%][/td][/tr][/table]

hide-autor