Welcome!

By registering with us, you'll be able to discuss, share and private message with other members of our community.

SignUp Now!

Решено Как сделать такие же правила форума?

Статус
В этой теме нельзя размещать новые ответы.
Янв
37
6
Пользователь
Как сделать, ну вот так же?
1774172307171.png
 
Последнее редактирование модератором:
Решение
Держи
HTML:
<div class="block">
        <div class="block-container">
            <div class="block-body block-row">
                


  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Правила форума — CRMP ONLINE</title>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
  <style>
    @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }

    body {
      background: linear-gradient(135deg, #0b0b0f 0%, #1a1a24 100%);
      font-family: 'Inter', system-ui, -apple-system, sans-serif;
      line-height...
Rising Star?
Июн
2,998
2,335
Редактор
Последнее редактирование модератором:
Янв
37
6
Пользователь
Последнее редактирование модератором:
never stress
Дек
617
425
Заблокированный
Обратите внимание, пользователь заблокирован на форуме. Не рекомендуется проводить сделки. Мы не несем ответственности за действия пользователя вне форума.
Мне HTML код нужен жля правил. Страница то понятно
OFFTOP

это сам сможешь скопировать

 
never stress
Дек
617
425
Заблокированный
Обратите внимание, пользователь заблокирован на форуме. Не рекомендуется проводить сделки. Мы не несем ответственности за действия пользователя вне форума.
Взять бы где то
OFFTOP

самому сделать тоже можно

 
Мар
9
2
Пользователь
Держи
HTML:
<div class="block">
        <div class="block-container">
            <div class="block-body block-row">
                


  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Правила форума — CRMP ONLINE</title>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
  <style>
    @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }

    body {
      background: linear-gradient(135deg, #0b0b0f 0%, #1a1a24 100%);
      font-family: 'Inter', system-ui, -apple-system, sans-serif;
      line-height: 1.6;
      color: #e8eef2;
      min-height: 100vh;
    }

    .container {
      max-width: 1000px;
      margin: 0 auto;
      padding: 32px 24px;
    }

    .glass-card {
      background: rgba(26, 26, 35, 0.8);
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
      border: 1px solid rgba(255, 184, 43, 0.1);
      border-radius: 24px;
      box-shadow: 0 20px 40px -15px rgba(0, 0, 0, 0.5);
    }

    .header {
      margin-bottom: 32px;
      padding: 24px 32px;
      background: linear-gradient(145deg, rgba(255, 184, 43, 0.1) 0%, rgba(255, 184, 43, 0.02) 100%);
      border-radius: 32px;
      border-left: 6px solid #ffb82b;
      position: relative;
      overflow: hidden;
    }

    .header::before {
      content: '';
      position: absolute;
      top: -50%;
      right: -50%;
      width: 200%;
      height: 200%;
      background: radial-gradient(circle, rgba(255, 184, 43, 0.1) 0%, transparent 70%);
      animation: glow 15s infinite linear;
    }

    @keyframes glow {
      from { transform: rotate(0deg); }
      to { transform: rotate(360deg); }
    }

    .title {
      font-size: 36px;
      font-weight: 700;
      margin: 0 0 8px 0;
      color: #fff;
      letter-spacing: -0.02em;
      text-shadow: 0 2px 10px rgba(255, 184, 43, 0.3);
      position: relative;
    }

    .title i {
      margin-right: 16px;
      color: #ffb82b;
      filter: drop-shadow(0 0 8px rgba(255, 184, 43, 0.5));
    }

    .sub {
      color: #a0a8b8;
      font-size: 16px;
      font-weight: 400;
      position: relative;
    }

    .legend {
      display: flex;
      flex-wrap: wrap;
      gap: 16px;
      margin-bottom: 40px;
      padding: 20px 24px;
      background: rgba(20, 20, 28, 0.6);
      backdrop-filter: blur(8px);
      border-radius: 40px;
      border: 1px solid rgba(255, 184, 43, 0.15);
    }

    .rule-punish {
      display: inline-flex;
      align-items: center;
      padding: 8px 18px;
      border-radius: 40px;
      font-size: 14px;
      font-weight: 600;
      letter-spacing: 0.02em;
      transition: all 0.3s ease;
      cursor: default;
    }

    .rule-punish i {
      margin-right: 10px;
      font-size: 16px;
    }

    .rule-punish:hover {
      transform: translateY(-2px);
      filter: brightness(1.2);
    }

    .punish-warn {
      background: rgba(255, 184, 43, 0.15);
      border: 1px solid #ffb82b;
      color: #ffb82b;
      box-shadow: 0 5px 15px -5px rgba(255, 184, 43, 0.3);
    }

    .punish-temp {
      background: rgba(255, 184, 43, 0.08);
      border: 1px solid rgba(255, 184, 43, 0.4);
      color: #ffd700;
      box-shadow: 0 5px 15px -5px rgba(255, 184, 43, 0.15);
    }

    .punish-perm {
      background: rgba(255, 70, 70, 0.08);
      border: 1px solid rgba(255, 140, 140, 0.3);
      color: #ff9f9f;
      box-shadow: 0 5px 15px -5px rgba(255, 70, 70, 0.15);
    }

    .section-header {
      margin: 48px 0 24px 0;
      position: relative;
    }

    .section-header h2 {
      font-size: 24px;
      font-weight: 700;
      color: #fff;
      letter-spacing: -0.01em;
      display: inline-block;
      padding: 0 24px 0 16px;
      background: linear-gradient(90deg, #ffb82b 0%, transparent 100%);
      border-radius: 0 40px 40px 0;
      line-height: 48px;
      text-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
    }

    .rule-block {
      padding: 24px 28px;
      margin-bottom: 20px;
      background: rgba(30, 30, 40, 0.6);
      backdrop-filter: blur(8px);
      border-radius: 24px;
      border: 1px solid rgba(255, 184, 43, 0.1);
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
      position: relative;
      overflow: hidden;
    }

    .rule-block::before {
      content: '';
      position: absolute;
      left: 0;
      top: 0;
      height: 100%;
      width: 4px;
      background: linear-gradient(180deg, #ffb82b 0%, #ff8c42 100%);
      border-radius: 4px 0 0 4px;
    }

    .rule-block:hover {
      transform: translateX(8px) scale(1.01);
      background: rgba(35, 35, 45, 0.8);
      border-color: rgba(255, 184, 43, 0.3);
      box-shadow: 0 15px 30px -10px rgba(255, 184, 43, 0.2);
    }

    .rule-title {
      font-size: 18px;
      font-weight: 700;
      color: #ffb82b;
      margin-bottom: 12px;
      display: flex;
      align-items: center;
      letter-spacing: -0.01em;
    }

    .rule-title::before {
      content: '•';
      margin-right: 12px;
      font-size: 28px;
      color: #ffb82b;
      line-height: 1;
    }

    .rule-text {
      font-size: 15px;
      color: #d0d8e5;
      margin-bottom: 16px;
      padding-left: 24px;
      border-left: 2px solid rgba(255, 184, 43, 0.2);
    }

    .punish-row {
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
      padding-top: 8px;
    }

    .rule-block .rule-punish {
      font-size: 13px;
      padding: 6px 16px;
      background: rgba(0, 0, 0, 0.3);
    }

    footer {
      margin-top: 60px;
      padding: 32px 24px;
      background: rgba(15, 15, 20, 0.8);
      backdrop-filter: blur(8px);
      border-radius: 32px;
      border: 1px solid rgba(255, 184, 43, 0.15);
      text-align: center;
      font-size: 14px;
      color: #a0a8b8;
    }

    a.admin-link {
      color: #ffb82b;
      text-decoration: none;
      font-weight: 600;
      padding: 4px 12px;
      border-radius: 20px;
      background: rgba(255, 184, 43, 0.1);
      transition: all 0.3s ease;
      display: inline-block;
      margin: 0 4px;
    }

    a.admin-link:hover {
      background: rgba(255, 184, 43, 0.25);
      transform: scale(1.05);
      color: #fff;
    }

    .gradient-nick {
      background: linear-gradient(135deg, #FF0000, #8B0000);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      font-weight: 700;
      text-shadow: none;
      letter-spacing: -0.5px;
      display: inline-block;
    }

    .admin-contact {
      background: rgba(20, 20, 28, 0.8);
      backdrop-filter: blur(8px);
      border-radius: 40px;
      padding: 16px 24px;
      margin: 30px 0 20px;
      border: 1px solid rgba(255, 184, 43, 0.15);
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      justify-content: center;
      gap: 20px;
    }

    .admin-contact-item {
      display: flex;
      align-items: center;
      gap: 12px;
      font-size: 16px;
    }

    .admin-contact-item i {
      color: #ffb82b;
      font-size: 20px;
    }

    .telegram-link {
      color: #ffb82b;
      text-decoration: none;
      font-weight: 600;
      padding: 8px 18px;
      border-radius: 40px;
      background: rgba(255, 184, 43, 0.1);
      border: 1px solid rgba(255, 184, 43, 0.3);
      transition: all 0.3s ease;
      display: inline-flex;
      align-items: center;
      gap: 8px;
    }

    .telegram-link:hover {
      background: rgba(255, 184, 43, 0.2);
      transform: translateY(-2px);
      box-shadow: 0 10px 20px -10px rgba(255, 184, 43, 0.4);
    }

    .badge {
      display: inline-block;
      padding: 2px 10px;
      border-radius: 20px;
      background: rgba(255, 184, 43, 0.15);
      border: 1px solid rgba(255, 184, 43, 0.3);
      font-size: 12px;
      font-weight: 500;
      margin-left: 10px;
    }

    @keyframes fadeInUp {
      from {
        opacity: 0;
        transform: translateY(20px);
      }
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    .rule-block {
      animation: fadeInUp 0.5s ease-out forwards;
    }

    .rule-block:nth-child(2) { animation-delay: 0.1s; }
    .rule-block:nth-child(3) { animation-delay: 0.2s; }
    .rule-block:nth-child(4) { animation-delay: 0.3s; }
    .rule-block:nth-child(5) { animation-delay: 0.4s; }

    @media (max-width: 768px) {
      .container { padding: 16px; }
      .title { font-size: 28px; }
      .header { padding: 20px; }
      .legend { padding: 16px; }
      .section-header h2 { font-size: 20px; line-height: 40px; }
      .rule-block { padding: 20px; }
      .rule-block:hover { transform: translateX(4px); }
      .admin-contact { flex-direction: column; gap: 12px; }
    }

    @media (max-width: 480px) {
      .rule-punish { width: 100%; justify-content: center; }
      .punish-row { gap: 8px; }
      .rule-title { font-size: 16px; }
      .rule-text { font-size: 14px; padding-left: 16px; }
    }
  </style>


<div class="container">

  <div class="header glass-card">
    <h1 class="title">
      <i class="fas fa-clipboard-list"></i>ПРАВИЛА ФОРУМА
    </h1>
    <div class="sub">CRMP ONLINE — официальный регламент и меры наказания</div>
    <div style="margin-top: 12px; display: flex; gap: 10px; flex-wrap: wrap;">
      <span class="badge">Версия 2.1</span>
      <span class="badge">Обновлено 2026</span>
    </div>
  </div>

  <div class="admin-contact">
    <div class="admin-contact-item">
      <i class="fas fa-crown"></i>
      <span>Администратор форума: <span class="gradient-nick">Keleen Dalaner</span></span>
    </div>
    <div class="admin-contact-item">
      <i class="fab fa-telegram"></i>
      <a href="https://t.me/azxfalens" target="_blank" class="telegram-link">
        <i class="fab fa-telegram-plane"></i> @azxfalens
      </a>
    </div>
  </div>

  <div class="legend">
    <span class="rule-punish punish-warn"><i class="fas fa-exclamation-triangle"></i>Предупреждение</span>
    <span class="rule-punish punish-temp"><i class="fas fa-hourglass-half"></i>Временный бан</span>
    <span class="rule-punish punish-perm"><i class="fas fa-ban"></i>Перманентный бан</span>
    <span class="rule-punish punish-temp"><i class="fas fa-gavel"></i>По решению адм.</span>
  </div>

  <div class="section-header"><h2>1. Общие положения</h2></div>

  <div class="rule-block" id="s1-01">
    <div class="rule-title">§1.01 Все пользователи обязаны соблюдать правила форума</div>
    <div class="rule-text">Нарушение общих правил приводит к дисциплинарным мерам в соответствии с регламентом. Администрация вправе применять санкции по своему усмотрению в зависимости от тяжести нарушения.</div>
    <div class="punish-row">
      <span class="rule-punish punish-warn"><i class="fas fa-exclamation-triangle"></i>Предупреждение</span>
      <span class="rule-punish punish-temp"><i class="fas fa-hourglass-half"></i>Бан 1–3 дня (при повторе)</span>
    </div>
  </div>

  <div class="rule-block" id="s1-02">
    <div class="rule-title">§1.02 Регистрация = согласие с правилами</div>
    <div class="rule-text">Регистрируясь на форуме, вы подтверждаете знание и согласие с этими правилами. Незнание правил не освобождает от ответственности.</div>
    <div class="punish-row">
      <span class="rule-punish punish-warn"><i class="fas fa-exclamation-triangle"></i>Предупреждение</span>
    </div>
  </div>

  <div class="rule-block" id="s1-03">
    <div class="rule-title">§1.03 Дополнительные правила разделов</div>
    <div class="rule-text">Отдельные разделы могут содержать дополнительные требования — их нарушение наказывается отдельно. Перед созданием темы рекомендуется ознакомиться с закрепленными правилами раздела.</div>
    <div class="punish-row">
      <span class="rule-punish punish-warn"><i class="fas fa-exclamation-triangle"></i>Предупреждение</span>
      <span class="rule-punish punish-temp"><i class="fas fa-hourglass-half"></i>Бан 1–3 дня</span>
    </div>
  </div>

  <div class="rule-block" id="s1-04">
    <div class="rule-title">§1.04 Официальный язык общения — русский</div>
    <div class="rule-text">Форум ведётся на русском языке; использование иных языков допускается в отдельных ветках по согласованию с модераторами.</div>
    <div class="punish-row">
      <span class="rule-punish punish-warn"><i class="fas fa-exclamation-triangle"></i>Предупреждение</span>
    </div>
  </div>

  <div class="rule-block" id="s1-05">
    <div class="rule-title">§1.05 Санкции в игровом пространстве</div>
    <div class="rule-text">Некоторые нарушения на форуме могут привести к санкциям в игре (баны, ограничения, конфискация имущества).</div>
    <div class="punish-row">
      <span class="rule-punish punish-temp"><i class="fas fa-hourglass-half"></i>Бан форума 3–7 дней + игровые санкции</span>
    </div>
  </div>

  <div class="rule-block" id="s1-06">
    <div class="rule-title">§1.06 Администрация вправе редактировать/удалять контент</div>
    <div class="rule-text">Администрация имеет право редактировать или удалять контент без предварительного уведомления, если он нарушает правила.</div>
    <div class="punish-row">
      <span class="rule-punish punish-temp"><i class="fas fa-hourglass-half"></i>Бан 3–7 дней за оспаривание/провокации</span>
    </div>
  </div>

  <div class="section-header"><h2>2. Аватары и профили</h2></div>

  <div class="rule-block" id="s2-01">
    <div class="rule-title">§2.01 Запрещённая символика в аватаре</div>
    <div class="rule-text">Аватары с националистической, экстремистской или провокационной символикой строго запрещены. Администрация вправе запросить смену аватара без объяснения причин.</div>
    <div class="punish-row">
      <span class="rule-punish punish-perm"><i class="fas fa-ban"></i>Бан 7–30 дней / навсегда</span>
    </div>
  </div>

  <div class="rule-block" id="s2-02">
    <div class="rule-title">§2.02 Оскорбления и ненормативная лексика в профиле</div>
    <div class="rule-text">Нецензурная лексика и оскорбительные надписи в профиле, статусах и подписях запрещены.</div>
    <div class="punish-row">
      <span class="rule-punish punish-warn"><i class="fas fa-exclamation-triangle"></i>Предупреждение</span>
      <span class="rule-punish punish-temp"><i class="fas fa-hourglass-half"></i>Бан 3–5 дней при повторе</span>
    </div>
  </div>

  <div class="rule-block" id="s2-03">
    <div class="rule-title">§2.03 Порнографический и эротический контент</div>
    <div class="rule-text">Аватары и подписи с эротическим или порнографическим содержанием запрещены. Возрастной контент допускается только в специальных разделах.</div>
    <div class="punish-row">
      <span class="rule-punish punish-perm"><i class="fas fa-ban"></i>Бан 14–30 дней / навсегда</span>
    </div>
  </div>

  <div class="rule-block" id="s2-04">
    <div class="rule-title">§2.04 Реклама в аватарках и подписях</div>
    <div class="rule-text">Размещение рекламы в аватаре или подписи запрещено без письменного согласия администрации.</div>
    <div class="punish-row">
      <span class="rule-punish punish-warn"><i class="fas fa-exclamation-triangle"></i>Предупреждение</span>
      <span class="rule-punish punish-temp"><i class="fas fa-hourglass-half"></i>Бан 3–7 дней при повторе</span>
    </div>
  </div>

  <div class="rule-block" id="s2-05">
    <div class="rule-title">§2.05 Повторяющиеся имена пользователей</div>
    <div class="rule-text">Если имя пользователя совпадает или визуально похоже на имя другого пользователя, пользователь с поздней регистрацией обязан сменить никнейм в течение 24 часов.</div>
    <div class="punish-row">
      <span class="rule-punish punish-temp"><i class="fas fa-hourglass-half"></i>24 часа на смену, иначе удаление профиля</span>
    </div>
  </div>

  <div class="section-header"><h2>3. Сообщения и темы</h2></div>

  <div class="rule-block" id="s3-01">
    <div class="rule-title">§3.01 Заголовки тем, написанные ЗАГЛАВНЫМИ БУКВАМИ</div>
    <div class="rule-text">Заголовки в CAPS LOCK расцениваются как некорректные и мешают чтению. Используйте нормальный регистр.</div>
    <div class="punish-row">
      <span class="rule-punish punish-warn"><i class="fas fa-exclamation-triangle"></i>Предупреждение</span>
    </div>
  </div>

  <div class="rule-block" id="s3-02">
    <div class="rule-title">§3.02 Оскорбления и ненормативная лексика</div>
    <div class="rule-text">Любые оскорбления и мат в сообщениях, подписях и темах запрещены. Замена букв символами не освобождает от ответственности.</div>
    <div class="punish-row">
      <span class="rule-punish punish-temp"><i class="fas fa-hourglass-half"></i>Бан 1–3 дня</span>
    </div>
  </div>

  <div class="rule-block" id="s3-03">
    <div class="rule-title">§3.03 Названия тем должны отражать содержание</div>
    <div class="rule-text">Название темы обязано чётко соответствовать содержанию обсуждения. Кликбейтные заголовки запрещены.</div>
    <div class="punish-row">
      <span class="rule-punish punish-warn"><i class="fas fa-exclamation-triangle"></i>Предупреждение + корректировка темы</span>
    </div>
  </div>

  <div class="rule-block" id="s3-04">
    <div class="rule-title">§3.04 Создание дублирующих тем</div>
    <div class="rule-text">Повторная публикация темы с идентичной информацией запрещена. Используйте поиск перед созданием темы.</div>
    <div class="punish-row">
      <span class="rule-punish punish-temp"><i class="fas fa-hourglass-half"></i>Бан 3–5 дней</span>
    </div>
  </div>

  <div class="rule-block" id="s3-05">
    <div class="rule-title">§3.05 Искусственное накручивание сообщений и лайков</div>
    <div class="rule-text">Использование ботов, мультиаккаунтов или иных способов накрутки строго запрещено.</div>
    <div class="punish-row">
      <span class="rule-punish punish-temp"><i class="fas fa-hourglass-half"></i>Бан 7–14 дней + сброс активности</span>
    </div>
  </div>

  <div class="rule-block" id="s3-06">
    <div class="rule-title">§3.06 Торговля неигровыми предметами и аккаунтами</div>
    <div class="rule-text">Объявления о продаже аккаунтов или неигровых предметов запрещены.</div>
    <div class="punish-row">
      <span class="rule-punish punish-perm"><i class="fas fa-ban"></i>Бан 14–30 дней / навсегда</span>
    </div>
  </div>

  <div class="rule-block" id="s3-07">
    <div class="rule-title">§3.07 Оскорбление родственников и близких</div>
    <div class="rule-text">Оскорбления в адрес родственников и близких пользователей недопустимы и караются максимально строго.</div>
    <div class="punish-row">
      <span class="rule-punish punish-perm"><i class="fas fa-ban"></i>Бан 7–30 дней / навсегда</span>
    </div>
  </div>

  <div class="rule-block" id="s3-08">
    <div class="rule-title">§3.08 Сообщения не по существу в темах-жалобах</div>
    <div class="rule-text">В темах жалоб запрещены оффтоп и сообщения, не относящиеся к сути жалобы. Только жалобщик и ответчик.</div>
    <div class="punish-row">
      <span class="rule-punish punish-warn"><i class="fas fa-exclamation-triangle"></i>Предупреждение</span>
      <span class="rule-punish punish-temp"><i class="fas fa-hourglass-half"></i>Бан 1–3 дня при повторе</span>
    </div>
  </div>

  <div class="rule-block" id="s3-09">
    <div class="rule-title">§3.09 Соблюдение правил русского языка</div>
    <div class="rule-text">Просьба писать разборчиво и соблюдать орфографию/пунктуацию; преднамеренные искажения ("олбанский", падонкафф) недопустимы.</div>
    <div class="punish-row">
      <span class="rule-punish punish-warn"><i class="fas fa-exclamation-triangle"></i>Предупреждение</span>
    </div>
  </div>

  <div class="rule-block" id="s3-10">
    <div class="rule-title">§3.10 Целенаправленное создание конфликтных ситуаций</div>
    <div class="rule-text">Разжигание конфликтов, провокации, троллинг и намеренные подстрекательства запрещены.</div>
    <div class="pun
 
Статус
В этой теме нельзя размещать новые ответы.
Сверху