fixed start page and scroll in modal window

src/pages/RulesModal.jsx

@@ -0,0 +1,187 @@
+import { useEffect } from 'react';
+import { useTranslation } from 'react-i18next';
+import CloseIcon from "../components/icons/CloseIcon";
+import "../styles/rules.css";
+
+const RULES = [
+  {
+    num: "1",
+    titleKey: "rules.section1Title",
+    content: (
+      <p>
+        Платформа «Находка» предназначена исключительно для помощи людям в поиске утерянных вещей
+        и возврате найденных предметов их владельцам. Размещая объявление, вы соглашаетесь
+        соблюдать настоящие правила и законодательство Российской Федерации.
+      </p>
+    ),
+  },
+  {
+    num: "2",
+    titleKey: "rules.section2Title",
+    content: (
+      <ul>
+        <li>Объявления о потере личных вещей, документов, животных, транспортных средств</li>
+        <li>Объявления о находке чужого имущества с целью возврата владельцу</li>
+        <li>Фотографии найденного или утерянного предмета</li>
+        <li>Контактные данные для связи с владельцем или нашедшим</li>
+      </ul>
+    ),
+  },
+  {
+    num: "3",
+    titleKey: "rules.section3Title",
+    content: (
+      <>
+        <p className="rules-sub-title">3.1. Запрещённый контент</p>
+        <ul>
+          <li>Объявления с целью продажи найденного имущества — это является присвоением чужого имущества и преследуется по <span className="rules-law">ст. 160 УК РФ</span></li>
+          <li>Заведомо ложные объявления и фиктивные находки</li>
+          <li>Объявления с целью мошенничества (<span className="rules-law">ст. 159 УК РФ</span>)</li>
+          <li>Дубликаты одного и того же объявления</li>
+        </ul>
+        <p className="rules-sub-title">3.2. Запрещённые предметы</p>
+        <ul>
+          <li>Оружие, боеприпасы, взрывчатые вещества</li>
+          <li>Наркотические и психотропные вещества</li>
+          <li>Похищенное имущество</li>
+          <li>Документы третьих лиц с целью использования в корыстных целях</li>
+        </ul>
+        <p className="rules-sub-title">3.3. Запрещённые действия</p>
+        <ul>
+          <li>Указывать вознаграждение в обмен на молчание или отказ от обращения в полицию</li>
+          <li>Требовать оплату за возврат найденных документов — паспорт и иные документы подлежат безвозмездному возврату</li>
+          <li>Публиковать персональные данные третьих лиц без их согласия (<span className="rules-law">ст. 137 УК РФ, 152-ФЗ</span>)</li>
+        </ul>
+      </>
+    ),
+  },
+  {
+    num: "4",
+    titleKey: "rules.section4Title",
+    content: (
+      <ul>
+        <li>Описание должно быть достоверным и точным</li>
+        <li>Фотографии должны соответствовать описанию</li>
+        <li>Контактные данные должны быть актуальными</li>
+        <li>Место и дата потери или находки указываются максимально точно</li>
+        <li>Запрещено использовать оскорбительные, нецензурные выражения</li>
+      </ul>
+    ),
+  },
+  {
+    num: "5",
+    titleKey: "rules.section5Title",
+    content: (
+      <>
+        <p>Предложение вознаграждения нашедшему является добровольным и законным правом владельца. При этом:</p>
+        <ul>
+          <li>Размер вознаграждения определяет только владелец вещи</li>
+          <li>Нашедший не вправе требовать вознаграждение как условие возврата</li>
+          <li>Согласно <span className="rules-law">ст. 229 ГК РФ</span> нашедший имеет право на вознаграждение до 20% от стоимости вещи, если владелец публично его объявил</li>
+        </ul>
+      </>
+    ),
+  },
+  {
+    num: "6",
+    titleKey: "rules.section6Title",
+    content: (
+      <>
+        <p>Нахождение чужих документов обязывает вас согласно законодательству РФ:</p>
+        <ul>
+          <li>Сдать документы в ближайшее отделение полиции, либо</li>
+          <li>Разместить объявление на платформе для возврата владельцу</li>
+          <li>Хранить документы до момента возврата или передачи в полицию</li>
+        </ul>
+        <p className="rules-warn">Продажа, использование или удержание чужих документов преследуется по закону.</p>
+      </>
+    ),
+  },
+  {
+    num: "7",
+    titleKey: "rules.section7Title",
+    content: (
+      <ul>
+        <li>Найденное животное необходимо по возможности обеспечить едой и кровом до возврата владельцу</li>
+        <li>Запрещено размещать объявления о продаже найденных животных</li>
+        <li>Если владелец не найден в течение 6 месяцев, право собственности на животное может перейти к нашедшему согласно <span className="rules-law">ст. 231 ГК РФ</span></li>
+      </ul>
+    ),
+  },
+  {
+    num: "8",
+    titleKey: "rules.section8Title",
+    content: (
+      <ul>
+        <li>Не публикуйте в объявлении избыточные персональные данные — достаточно способа связи</li>
+        <li>Не раскрывайте данные владельца или нашедшего третьим лицам без их согласия</li>
+        <li>Платформа не несёт ответственности за передачу данных пользователями напрямую</li>
+      </ul>
+    ),
+  },
+  {
+    num: "9",
+    titleKey: "rules.section9Title",
+    content: (
+      <>
+        <p>Администрация платформы вправе:</p>
+        <ul>
+          <li>Удалить объявление без предупреждения при нарушении правил</li>
+          <li>Заблокировать аккаунт пользователя при систематических нарушениях</li>
+          <li>Передать данные пользователя в правоохранительные органы при наличии признаков противоправных действий</li>
+        </ul>
+      </>
+    ),
+  },
+  {
+    num: "10",
+    titleKey: "rules.section10Title",
+    content: (
+      <p>
+        Пользователь самостоятельно несёт ответственность за содержание размещаемых объявлений.
+        Платформа «Находка» является информационным посредником и не несёт ответственности
+        за действия пользователей вне платформы.
+      </p>
+    ),
+  },
+];
+
+export default function RulesModal({ onClose }) {
+  const { t } = useTranslation();
+
+  useEffect(() => {
+    const prev = document.body.style.overflow;
+    document.body.style.overflow = 'hidden';
+    return () => { document.body.style.overflow = prev; };
+  }, []);
+
+  return (
+    <div className="f-modal-bg" onClick={e => e.target === e.currentTarget && onClose()}>
+      <div className="f-modal rules-modal">
+        {/* Header */}
+        <div className="f-modal-head">
+          <div className="rules-modal-title-wrap">
+            <span className="rules-modal-icon">📋</span>
+            <span className="f-modal-title">{t('rules.title')}</span>
+          </div>
+          <button className="f-close-btn" onClick={onClose}>
+            <CloseIcon />
+          </button>
+        </div>
+
+        {/* Rules list */}
+        <div className="rules-list">
+          {RULES.map(rule => (
+            <div key={rule.num} className="rules-section">
+              <div className="rules-section-head">
+                <span className="rules-num">{rule.num}</span>
+                <span className="rules-title">{t(rule.titleKey)}</span>
+              </div>
+              <div className="rules-body">{rule.content}</div>
+            </div>
+          ))}
+        </div>
+      </div>
+    </div>
+  );
+}