.rf-block { background: #121212; border: 1px solid #232323; border-radius: 12px; padding: 24px 22px; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; color: #e8e8e8; max-width: 900px; margin: 0 auto; box-shadow: 0 8px 20px rgba(0, 0, 0, 0.5); } .rf-block__header { display: flex; align-items: center; gap: 12px; border-bottom: 2px solid #b2344d; padding-bottom: 16px; margin-bottom: 24px; } .rf-block__header h2 { font-size: 22px; font-weight: 600; letter-spacing: -0.3px; color: #e8e8e8; margin: 0; } .rf-block__header span { font-size: 26px; line-height: 1; } .rf-block__criteria { background: #1a1a1a; border-left: 4px solid #b2344d; padding: 14px 16px; border-radius: 8px; margin-bottom: 24px; font-size: 14px; color: #b8b8b8; border: 1px solid #232323; border-left-width: 4px; } .rf-block__criteria strong { display: block; color: #e8e8e8; font-weight: 500; margin-bottom: 6px; font-size: 13px; text-transform: uppercase; letter-spacing: 0.3px; } .rf-block__criteria ul { list-style: none; padding: 0; margin: 0; } .rf-block__criteria li { padding: 3px 0 3px 24px; background: url('data:image/svg+xml;utf8, ') left center no-repeat; background-size: 18px; color: #b8b8b8; line-height: 1.5; } .rf-block__criteria li + li { margin-top: 2px; } .rf-block__field { margin-bottom: 18px; } .rf-block__field label { display: block; font-size: 14px; font-weight: 500; color: #b8b8b8; margin-bottom: 5px; letter-spacing: 0.2px; } .rf-block__field input, .rf-block__field textarea { width: 100%; padding: 12px 14px; background: #1a1a1a; border: 1px solid #2e2e2e; border-radius: 10px; color: #e8e8e8; font-size: 14px; font-family: inherit; transition: border 0.2s, box-shadow 0.2s; outline: none; } .rf-block__field input:focus, .rf-block__field textarea:focus { border-color: #b2344d; box-shadow: 0 0 0 3px rgba(178, 52, 77, 0.15); background: #1e1e1e; } .rf-block__field textarea { resize: vertical; min-height: 90px; } .rf-block__field input::placeholder, .rf-block__field textarea::placeholder { color: #6b6b6b; font-weight: 300; } .rf-block__actions { margin-top: 26px; } .rf-block__btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 100%; padding: 14px 20px; background: #b2344d; color: #ffffff; border: none; border-radius: 30px; font-size: 16px; font-weight: 600; cursor: pointer; transition: background 0.2s, transform 0.1s, box-shadow 0.2s; letter-spacing: 0.3px; } .rf-block__btn:hover { background: #d9204f; box-shadow: 0 4px 12px rgba(178, 52, 77, 0.25); } .rf-block__btn:active { transform: scale(0.97); } .rf-block__btn svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } /* адаптив */ @media (max-width: 600px) { .rf-block { padding: 18px 16px; border-radius: 10px; } .rf-block__header h2 { font-size: 20px; } .rf-block__field input, .rf-block__field textarea { padding: 10px 12px; font-size: 14px; } .rf-block__btn { font-size: 15px; padding: 13px 16px; } } @media (max-width: 420px) { .rf-block__criteria { font-size: 13px; padding: 12px 14px; } .rf-block__criteria li { padding-left: 22px; background-size: 16px; } } .rf-block__preview { background: #1a1a1a; border: 1px solid #2e2e2e; border-radius: 8px; padding: 16px; margin-top: 20px; font-family: 'Courier New', monospace; font-size: 13px; color: #b8b8b8; white-space: pre-wrap; word-break: break-word; display: none; } .rf-block__preview.active { display: block; } .rf-block__result { background: #1a1a1a; border: 1px solid #b2344d; border-radius: 8px; padding: 16px; margin-top: 20px; display: none; } .rf-block__result.active { display: block; } .rf-block__result h3 { color: #e8e8e8; font-size: 16px; margin-bottom: 12px; display: flex; align-items: center; gap: 8px; } .rf-block__result .forum-data { background: #121212; border: 1px solid #2e2e2e; border-radius: 8px; padding: 14px; font-family: 'Courier New', monospace; font-size: 13px; color: #b8b8b8; white-space: pre-wrap; word-break: break-word; max-height: 400px; overflow-y: auto; } .rf-block__result .copy-row { display: flex; gap: 12px; margin-top: 14px; flex-wrap: wrap; } .rf-block__result .copy-btn { background: #b2344d; color: #fff; border: none; padding: 10px 18px; border-radius: 30px; font-size: 14px; font-weight: 600; cursor: pointer; transition: background 0.2s; display: inline-flex; align-items: center; gap: 6px; } .rf-block__result .copy-btn:hover { background: #d9204f; } .rf-block__result .copy-btn.secondary { background: #2e2e2e; } .rf-block__result .copy-btn.secondary:hover { background: #3a3a3a; } .rf-block__checkbox { display: flex; align-items: center; gap: 10px; margin-top: 6px; color: #b8b8b8; font-size: 14px; } .rf-block__checkbox input[type="checkbox"] { width: 18px; height: 18px; accent-color: #b2344d; cursor: pointer; } .rf-block__btn-row { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 12px; } .rf-block__btn-row .rf-block__btn { flex: 1; min-width: 140px; } .rf-block__btn-row .rf-block__btn.secondary { background: #1e1e1e; border: 1px solid #2e2e2e; } .rf-block__btn-row .rf-block__btn.secondary:hover { background: #2e2e2e; border-color: #b2344d; } 📋 Заявка на восстановление ✅ Критерии восстановления (все обязательны) Снятие прошло не более 90 дней назад Нет нарушений за последние 15 дней Проявление активности в беседе Быть ознакомленным с правилами 1. Ваш VK 2. Должность до снятия 3. Дата снятия 4. Причина снятия 5. Почему вы должны быть восстановлены Я подтверждаю, что ознакомлен(а) с правилами и критериями 👁️ Предпросмотр 📋 Скопировать заявку 🗑️ Очистить 📄 Готовый текст для отправки 📋 Копировать текст 📝 Копировать заголовок (function() { const vkId = document.getElementById('vkId'); const oldRole = document.getElementById('oldRole'); const suspDate = document.getElementById('suspDate'); const reason = document.getElementById('reason'); const appeal = document.getElementById('appeal'); const agreeCheck = document.getElementById('agreeCheck'); const copyBtn = document.getElementById('copyBtn'); const previewBtn = document.getElementById('previewBtn'); const clearBtn = document.getElementById('clearBtn'); const previewArea = document.getElementById('previewArea'); const resultArea = document.getElementById('resultArea'); const forumData = document.getElementById('forumData'); const copyResultBtn = document.getElementById('copyResultBtn'); const copyTitleResultBtn = document.getElementById('copyTitleResultBtn'); let lastGenerated = { title: '', text: '' }; function getToday() { return new Date().toLocaleDateString('ru-RU', { day: '2-digit', month: '2-digit', year: 'numeric' }); } function getValues() { return { vk: vkId.value.trim() || '___________', role: oldRole.value.trim() || '___________', date: suspDate.value.trim() || '___________', reason: reason.value.trim() || '___________', appeal: appeal.value.trim() || '___________', agree: agreeCheck.checked }; } function buildTitle(data) { return `Заявка на восстановление модератора ${data.role} (${data.vk})`; } function buildFullText(data) { const lines = []; lines.push('═══════════════════════════════════════════'); lines.push('ЗАЯВКА НА ВОССТАНОВЛЕНИЕ МОДЕРАТОРА'); lines.push('═══════════════════════════════════════════'); lines.push(''); lines.push(`1. VK ID: ${data.vk}`); lines.push(`2. Должность: ${data.role}`); lines.push(`3. Дата отстранения: ${data.date}`); lines.push(`4. Причина: ${data.reason}`); lines.push(`5. Аргументы:\n${data.appeal}`); lines.push(''); lines.push(`Дата подачи: ${getToday()}`); lines.push('═══════════════════════════════════════════'); return lines.join('\n'); } function generateResult() { const data = getValues(); const title = buildTitle(data); const text = buildFullText(data); lastGenerated = { title, text }; return { title, text }; } function showPreview() { const data = getValues(); if (!data.vk && !data.role && !data.date && !data.reason && !data.appeal) { previewArea.textContent = '👆 Заполните поля формы для предпросмотра'; previewArea.classList.add('active'); return; } const full = buildFullText(data); previewArea.textContent = full; previewArea.classList.add('active'); resultArea.classList.remove('active'); } function showResult() { const data = getValues(); if (!data.agree) { // просто показываем предпросмотр с напоминанием previewArea.textContent = '⚠️ Для генерации итогового текста необходимо согласие с критериями (отметьте чекбокс).'; previewArea.classList.add('active'); resultArea.classList.remove('active'); return; } const { title, text } = generateResult(); forumData.textContent = `${title}\n\n${text}`; forumData.setAttribute('data-title', title); forumData.setAttribute('data-text', text); resultArea.classList.add('active'); previewArea.classList.remove('active'); } function copyToClipboard(text, btnElement) { if (navigator.clipboard && navigator.clipboard.writeText) { navigator.clipboard.writeText(text) .then(() => { const orig = btnElement.innerHTML; btnElement.innerHTML = '✅ Скопировано!'; setTimeout(() => { btnElement.innerHTML = orig; }, 2000); }) .catch(() => { fallbackCopy(text, btnElement); }); } else { fallbackCopy(text, btnElement); } } function fallbackCopy(text, btnElement) { const ta = document.createElement('textarea'); ta.value = text; ta.style.position = 'fixed'; ta.style.left = '-9999px'; ta.style.top = '-9999px'; ta.style.opacity = '0'; document.body.appendChild(ta); ta.select(); try { document.execCommand('copy'); const orig = btnElement.innerHTML; btnElement.innerHTML = '✅ Скопировано!'; setTimeout(() => { btnElement.innerHTML = orig; }, 2000); } catch (e) { // тихо } document.body.removeChild(ta); } // события copyBtn.addEventListener('click', function() { const data = getValues(); const text = buildFullText(data); copyToClipboard(text, this); }); previewBtn.addEventListener('click', showPreview); clearBtn.addEventListener('click', function() { vkId.value = ''; oldRole.value = ''; suspDate.value = ''; reason.value = ''; appeal.value = ''; agreeCheck.checked = false; previewArea.classList.remove('active'); resultArea.classList.remove('active'); lastGenerated = { title: '', text: '' }; // обратная связь const orig = this.innerHTML; this.innerHTML = '✅ Очищено!'; setTimeout(() => { this.innerHTML = orig; }, 1500); }); // кнопка "Скопировать текст" из результата copyResultBtn.addEventListener('click', function() { const text = forumData.getAttribute('data-text'); if (text) { copyToClipboard(text, this); } }); copyTitleResultBtn.addEventListener('click', function() { const title = forumData.getAttribute('data-title'); if (title) { copyToClipboard(title, this); } }); // Если пользователь нажимает Enter в любом поле - показываем предпросмотр document.querySelectorAll('.rf-block__field input, .rf-block__field textarea').forEach(el => { el.addEventListener('keydown', function(e) { if (e.key === 'Enter' && !e.shiftKey && this.tagName !== 'TEXTAREA') { e.preventDefault(); showPreview(); } }); }); // дополнительно: при изменении чекбокса — если включен, можно показать результат agreeCheck.addEventListener('change', function() { if (this.checked) { // можно автоматически сгенерировать результат, но не перекрываем предпросмотр // просто оставляем как есть } }); // Сделать кнопку предпросмотра ведущей: при клике на неё показываем preview, // а при клике на "скопировать" — копируем текущие данные // также добавим кнопку "Сгенерировать" которая покажет результат с чекбоксом // но чтобы не перегружать, сделаем через двойной клик по previewBtn или через отдельную функцию // добавим генерацию по длинному нажатию? нет, добавим отдельную кнопку в actions? // добавим дополнительную кнопку "Сформировать заявку" в панель действий const actions = document.querySelector('.rf-block__btn-row'); const genBtn = document.createElement('button'); genBtn.className = 'rf-block__btn'; genBtn.type = 'button'; genBtn.innerHTML = '📄 Сформировать заявку'; genBtn.style.background = '#1a1a1a'; genBtn.style.border = '1px solid #b2344d'; genBtn.addEventListener('click', function() { const data = getValues(); if (!data.agree) { previewArea.textContent = '⚠️ Для формирования заявки необходимо согласие с критериями (отметьте чекбокс).'; previewArea.classList.add('active'); resultArea.classList.remove('active'); return; } showResult(); }); actions.appendChild(genBtn); // при загрузке показываем подсказку previewArea.textContent = '👆 Заполните поля и нажмите "Предпросмотр" или "Сформировать заявку"'; previewArea.classList.add('active'); })();

Раздел навигации

Регистрация

Что нового? Поиск

Добро пожаловать!

Зарегистрировавшись у нас, вы сможете обсуждать, делиться личными сообщениями с другими участниками нашего сообщества.

Регистрируйтесь прямо сейчас!

JavaScript отключён. Чтобы полноценно использовать наш сайт, включите JavaScript в своём браузере.

Page Важно Правила подачи жалоб на модерацию

Автор темы Ivan_Lazarev
Дата начала 12 Июл 2025

Статус: В этой теме нельзя размещать новые ответы.

Ivan_Lazarev BLAT

Главный модератор

12 Июл 2025

Последнее редактирование модератором: Вторник в 23:17

Статус: В этой теме нельзя размещать новые ответы.

Ссылка

На данном сайте используются файлы cookie, чтобы персонализировать контент и сохранить Ваш вход в систему, если Вы зарегистрируетесь.
Продолжая использовать этот сайт, Вы соглашаетесь на использование наших файлов cookie.

Принять Узнать больше...

Сверху Снизу