Шаблоны улучшены и обновлены, новая
автоформа краткой анкеты прилагается.

Анкета создается новой темой в этом разделе. Название темы: Род деятельности Описание темы: Раса, возраст

[html]
<style>
          body {
            font-family: Arial, sans-serif;
            background-color: #f0f0f0;
        }

.custom_tag_quote2 {
    margin: 0.3em;
}

        .form-group {
            margin-bottom: 20px;
        }

    label {
    display: block;
}

label b {
    font-family: 'Alegreya SC';
    font-size: 1.8em;
    /* text-shadow: #a9a37c 1px 1px 1px; */
}

input[type="text"], textarea {
    width: 96%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 3px;
    background-color: rgba(27, 14, 4, 0.1) !important;
    border: 3px double rgba(42, 14, 8, 0.28) !important;
    padding: 10px;
    margin: 5px -4px 0px -4px;
    box-shadow: 0 0px 4px 0px rgb(53 41 25 / 58%), 0px 0px 6px #543c2447 inset !important;
}

        textarea {
            height: 270px;
            width: 100% !important;
            box-sizing: border-box;
            resize: vertical;
            border-radius: 5px;
            border: 3px double rgba(42, 14, 8, 0.28) !important;
            background-color: rgba(27, 14, 4, 0.1) !important;
        }
        button {
            padding: 5px 10px !important;
            margin: 10px;
            background: radial-gradient(ellipse at center, #2e1408 14%,#200702 100%);
            border-left: solid 1px #2F2C25;
            border-radius: 3px;
            color: #806E48 !important;
            box-shadow: inset 0px 0px 6px #855d42c7, 0px 3px 5px rgba(102, 48, 27, 0.553);
            border: none;
            cursor: pointer;
            width: 120px;
            height: 40px;
        }
        button:hover {
            text-shadow: rgba(100%, 80%, 0%, 0.5) 1px 0 10px;
  }
       ::-webkit-input-placeholder {
             color: rgba(0%, 0%, 0%, 0.6);
}
       ::-moz-placeholder {
            color: rgba(0%, 0%, 0%, 0.6);
            opacity: 1;
}
       ::-moz-placeholder {
            color: rgba(0%, 0%, 0%, 0.6);
            opacity: 1;
}
       ::-ms-input-placeholder {
            color: rgba(0%, 0%, 0%, 0.6);
}

#reputation, #skills, #additionalInfo, #igrok, #post {
    background-color: rgba(27, 14, 4, 0.1) !important;
    border-radius: 2px;
    box-shadow: 0 0px 4px 0px rgb(53 41 25 / 58%), 0px 0px 6px #543c2447 inset !important;
    padding: 8px 5px!important;
}

#reputation, #skills {
    max-height: 225px;
}

#additionalInfo, #igrok, #post {
    max-height: 68px;
}

       #endResult {
             border: 1px solid #ccc;
             padding: 10px;
             white-space: pre;
             width: 96%;
             height: 200px;
             resize: vertical;
             overflow: auto;
             background-color: rgba(27, 14, 4, 0.1);
             border: 3px double rgba(42, 14, 8, 0.28);
             border-radius: 3px;
}

button.jGrowl-close {
    width: 2.5em;
    height: 2.5em;
}

.jGrowl-notification.alert.ui-state-highlight.ui-corner-all.default {
    position: relative;
    top: 2300px;
}
</style>
<div class="custom_tag_quote2">
        <div class="custom_tag_moa">АвтоФорма</div>

<br>

        <form>

            <div class="form-group">
                <label for="imageLink"><b>1. Иллюстрация</b> (вертикальная)</label>
                <input type="text" id="imageLink" name="imageLink" placeholder="прямая ссылка на картинку">
            </div>

            <div class="form-group">
                <label for="fullName"><b>2. Имя и Фамилия</b></label>
                <input type="text" id="fullName" name="fullName" placeholder="полные имя и фамилия">
            </div>

            <div class="form-group">
                <label for="nickname"><b>3. Прозвища</b> (если есть)</label>
                <input type="text" id="nickname" name="nickname" placeholder="укажите прозвища">
            </div>

            <div class="form-group">
                <label for="race"><b>4. Раса</b></label>
                <input type="text" id="race" name="race" placeholder="раса и, если есть, её подвид">
            </div>

            <div class="form-group">
                <label for="Age"><b>5. Возраст</b></label>
                <input type="text" id="Age" name="Age" placeholder="возраст. Опционально: на сколько выглядит">
            </div>

            <div class="form-group">
                <label for="residence"><b>6. Страна</b></label>
                <input type="text" id="residence" name="residence" placeholder="место проживания, подданство">
            </div>

            <div class="form-group">
                <label for="occupation"><b>7. Статус</b></label>
                <input type="text" id="occupation" name="occupation" placeholder="титулы (если есть). Род деятельности, положение в обществе, участие в гильдиях">
            </div>

            <div class="form-group">
                <label for="concept"><b>8. Концепция</b> (максимум слов десять)</label>
                <input type="text" id="concept" name="concept" placeholder="Краткий концепт персонажа. Например: Обнищавший аристократ">
            </div>

            <div class="form-group">
                <label for="faceclaim"><b>9. Занять внешность</b> — [Франшиза] Персонаж (by актер если есть)</label>
                <input type="text" id="faceclaim" name="faceclaim" placeholder="на английском">
            </div>

            <div class="form-group">
                <label for="reputation"><b>10. Репутация</b></label>
                <textarea id="reputation" name="reputation" placeholder="Важнейший пункт анкеты.

◾ ВИЗИТКА персонажа: кратко опишите, чем и где он известен.

◾ Что знает о нем публика? Общий имидж, слава в определенных кругах, особые приметы и пр.

◾ Парой предложений можете также резюмировать идею и КОНЦЕПТ героя.

◾ Информативный и ЛАКОНИЧНЫЙ пункт, с ясным, ёмким описанием. Не более 1-2 абзацев* в сумме.

◾ АМС могут редактировать его в зависимости от логики мира и результатов игры."></textarea>
            </div>

            <div class="form-group">
                <label for="skills"><b>11. Способности</b> (опционально)</label>
                <textarea id="skills" name="skills" placeholder="ОПЦИОНАЛЬНЫЙ ПУНКТ

◾ ЧАРОДЕИ: укажите свой почерк заклинаний.

◾ НА ВЫБОР: заполнять при регистрации или позже, когда освоитесь. Также можно указать лишь часть умений, а остальные дораскидать потом, в любой момент подав на проверку.

◾ Заполняя пункт: четко и кратко перечислите важные навыки персонажа.

ТАЛАНТЫ (боевые навыки, чары, ремесла) изучаются по срокам расы.
По шаблону:
— Название таланта — средне / хорошо / отлично / превосходно. (1-4)* Ступеней"></textarea>
            </div>

            <div class="form-group">
                <label for="additionalInfo"><b>Дополнительно:</b> (опционально)</label>
                <textarea id="additionalInfo" name="additionalInfo" placeholder="Не более 1-3 к. Если имеется — любая важная доп. информация (иначе пункт можно удалить)"></textarea>
            </div>

            <div class="form-group">
                <label for="proverka"><b>Тип проверки:</b></label>
                <input type="text" id="proverka" name="proverka" placeholder="Через ЛС или в теме анкеты">
            </div>

            <div class="form-group">
                <label for="plan"><b>Планы и пожелания:</b></label>
                <input type="text" id="plan" name="plan" placeholder="Чего ждете и хотите от игры?">
            </div>

            <div class="form-group">
                <label for="igrok"><b>Об игроке:</b></label>
                <textarea id="igrok" name="igrok" placeholder="Скорость отписи, предпочитаемый объем постов, что вам нравится и что категорически не играете, а также все то, что стоит знать потенциальным соигрокам"></textarea>
            </div>

            <div class="form-group">
                <label for="svyaz"><b>Связь с вами:</b></label>
                <input type="text" id="svyaz" name="svyaz" placeholder="(скрыто) сюжетным диск или телега ОБЯЗАТЕЛЬНО">
            </div>

            <div class="form-group">
                <label for="akki"><b>Ваши профили:</b></label>
                <input type="text" id="akki" name="akki" placeholder="(скрыто) все предыдущие регистрации (даже удаленные), приватно согласовать с АМС обязательно">
            </div>

            <div class="form-group">
                <label for="otkuda"><b>Откуда о нас узнали:</b></label>
                <input type="text" id="otkuda" name="otkuda"  placeholder="(скрыто) нам это будет полезно">
            </div>

            <div class="form-group">
                <label for="post"><b>Пример поста</b></label>
                <textarea id="post" name="post" placeholder="Ваш пост с любой ролевой"></textarea>
            </div>

            <button id="paste">Сгенерировать</button>
            <div class="form-group">
                <br>
                <br><label for="endResult"><b>Итог:</b></label>
<textarea id="endResult" name="resultend"></textarea>
            </div>
            <button id="copy">Скопировать</button>
   </form>
</div>

<script>

function iconRedir(element) {
console.log("Перенаправление...");
}

document.getElementById("paste").addEventListener("click", function(event) {
    event.preventDefault();

    const imageLink = document.getElementById("imageLink").value;
    const fullName = document.getElementById("fullName").value;
    const nickname = document.getElementById("nickname").value;
    const race = document.getElementById("race").value;
    const Age = document.getElementById("Age").value;
    const occupation = document.getElementById("occupation").value;
    const residence = document.getElementById("residence").value;
    const faceclaim = document.getElementById("faceclaim").value;
    const concept = document.getElementById("concept").value;
    const reputation = document.getElementById("reputation").value;
    const skills = document.getElementById("skills").value;
    const additionalInfo = document.getElementById("additionalInfo").value;
    const plan = document.getElementById("plan").value;
    const igrok = document.getElementById("igrok").value;
    const proverka = document.getElementById("proverka").value;
    const svyaz = document.getElementById("svyaz").value;
    const akki = document.getElementById("akki").value;
    const otkuda = document.getElementById("otkuda").value;
    const post = document.getElementById("post").value;

    const insertedCode = `\[mark\]Анкета\[/mark\]

\[rulka0\]${fullName}
\[rulka01\]\[b\]${nickname}\[/b\]\[/rulka01\]\[/rulka0\]

\[table layout=fixed width=100%\]
\[tr\]
\[td\]

\[rul\]РАСА:\[/rul\] ${race}

\[b\]\[/b\]
\[rul\]ВОЗРАСТ:\[/rul\] ${Age}

\[b\]\[/b\]
\[rul\]СТРАНА:\[/rul\] ${residence}

\[b\]\[/b\]
\[rul\]СТАТУС:\[/rul\] ${occupation}

\[b\]\[/b\]
\[rul\]FC:\[/rul\] ${faceclaim}
(если внешности нет — удалите пункт)

\[b\]\[/b\]
\[b\]\[/b\]
\[quote2\]\[align=center\]\[font=Georgia\]\[i\]${concept}\[/i\]\[/font\]\[/align\]\[/quote2\]

\[/td\]

\[td width=308px\]\[imgframe\]\[img\]${imageLink}\[/img\]\[/imgframe\]\[/td\]
\[/tr\]
\[/table\]

\[b\]\[/b\]
\[rulka\]РЕПУТАЦИЯ\[/rulka\]

${reputation}

\[b\]\[/b\]
\[rulka\]СПОСОБНОСТИ\[/rulka\]

${skills}

\[b\]\[/b\]
\[rulka\]ДОПОЛНИТЕЛЬНО\[/rulka\]

${additionalInfo}

\[b\]\[/b\]
\[rulka\]ОБ АВТОРЕ\[/rulka\]

\[ul\]
\[b\]Тип проверки:\[/b\] ${proverka}

\[b\]Планы и пожелания:\[/b\] ${plan}

\[b\]Об игроке:\[/b\] ${igrok}

\[/ul\]

\[hide=99999\]
• \[b\]Связь:\[/b\] ${svyaz}

• \[b\]Ваши профили:\[/b\] ${akki}

• \[b\]Откуда у нас узнали:\[/b\] ${otkuda}

Сюда вы также можете дописать все то, что не готовы разглашать во всеуслышание и хотите сообщить только АМС (о персонаже или игроке).

\[/hide\]

\[b\]\[/b\]

\[spoiler="ПРИМЕР ПОСТА"\]${post}

\[/spoiler\]`;

    document.getElementById("endResult").textContent = insertedCode;
});

document.getElementById("copy").addEventListener("click", function(event) {
            event.preventDefault();

                   // Select the text content of the "endResult" div
        const endResult = document.getElementById("endResult");
        const range = document.createRange();
        range.selectNode(endResult);
    window.getSelection().removeAllRanges();
    window.getSelection().addRange(range);
    document.execCommand("copy");
    window.getSelection().removeAllRanges();

        // Optionally, provide user feedback (e.g., an alert)
        alert("Содержимое скопировано в буфер обмена.");

    $.jGrowl("КОД скопирован! Вставьте в сообщение");
        });
</script>
[/html]

Благодарим @Каэль Дома Аметиста за помощь с созданием формы!