Add static pages and styles

frontend/src/pages/MarathonsPage.tsx

@@ -5,6 +5,7 @@ import type { MarathonListItem } from '@/types'
 import { NeonButton, GlassCard, StatsCard } from '@/components/ui'
 import { Plus, Users, Calendar, Loader2, Trophy, Gamepad2, ChevronRight, Hash, Sparkles } from 'lucide-react'
 import { TelegramBotBanner } from '@/components/TelegramBotBanner'
+import { AnnouncementBanner } from '@/components/AnnouncementBanner'
 import { format } from 'date-fns'
 import { ru } from 'date-fns/locale'
 
@@ -146,6 +147,11 @@ export function MarathonsPage() {
         </div>
       )}
 
+      {/* Announcement Banner */}
+      <div className="mb-4">
+        <AnnouncementBanner />
+      </div>
+
       {/* Telegram Bot Banner */}
       <div className="mb-8">
         <TelegramBotBanner />

frontend/src/pages/StaticContentPage.tsx

@@ -0,0 +1,107 @@
+import { useState, useEffect } from 'react'
+import { useParams, useLocation, Link } from 'react-router-dom'
+import { contentApi } from '@/api/admin'
+import type { StaticContent } from '@/types'
+import { GlassCard } from '@/components/ui'
+import { ArrowLeft, Loader2, FileText } from 'lucide-react'
+
+// Map routes to content keys
+const ROUTE_KEY_MAP: Record<string, string> = {
+  '/terms': 'terms_of_service',
+  '/privacy': 'privacy_policy',
+}
+
+export function StaticContentPage() {
+  const { key: paramKey } = useParams<{ key: string }>()
+  const location = useLocation()
+  const [content, setContent] = useState<StaticContent | null>(null)
+  const [isLoading, setIsLoading] = useState(true)
+  const [error, setError] = useState<string | null>(null)
+
+  // Determine content key from route or param
+  const contentKey = ROUTE_KEY_MAP[location.pathname] || paramKey
+
+  useEffect(() => {
+    if (!contentKey) return
+
+    const loadContent = async () => {
+      setIsLoading(true)
+      setError(null)
+      try {
+        const data = await contentApi.getPublicContent(contentKey)
+        setContent(data)
+      } catch {
+        setError('Контент не найден')
+      } finally {
+        setIsLoading(false)
+      }
+    }
+
+    loadContent()
+  }, [contentKey])
+
+  if (isLoading) {
+    return (
+      <div className="flex flex-col items-center justify-center py-24">
+        <Loader2 className="w-12 h-12 animate-spin text-neon-500 mb-4" />
+        <p className="text-gray-400">Загрузка...</p>
+      </div>
+    )
+  }
+
+  if (error || !content) {
+    return (
+      <div className="max-w-3xl mx-auto">
+        <GlassCard className="text-center py-16">
+          <div className="w-20 h-20 mx-auto mb-6 rounded-2xl bg-dark-700 flex items-center justify-center">
+            <FileText className="w-10 h-10 text-gray-600" />
+          </div>
+          <h3 className="text-xl font-semibold text-white mb-2">Страница не найдена</h3>
+          <p className="text-gray-400 mb-6">Запрашиваемый контент не существует</p>
+          <Link
+            to="/"
+            className="inline-flex items-center gap-2 text-neon-400 hover:text-neon-300 transition-colors"
+          >
+            <ArrowLeft className="w-4 h-4" />
+            На главную
+          </Link>
+        </GlassCard>
+      </div>
+    )
+  }
+
+  return (
+    <div className="max-w-3xl mx-auto">
+      <Link
+        to="/"
+        className="inline-flex items-center gap-2 text-gray-400 hover:text-neon-400 mb-6 transition-colors group"
+      >
+        <ArrowLeft className="w-4 h-4 group-hover:-translate-x-1 transition-transform" />
+        На главную
+      </Link>
+
+      <GlassCard>
+        <h1 className="text-2xl md:text-3xl font-bold text-white mb-6">{content.title}</h1>
+        <div
+          className="prose prose-invert prose-gray max-w-none
+            prose-headings:text-white prose-headings:font-semibold
+            prose-p:text-gray-300 prose-p:leading-relaxed
+            prose-a:text-neon-400 prose-a:no-underline hover:prose-a:text-neon-300
+            prose-strong:text-white
+            prose-ul:text-gray-300 prose-ol:text-gray-300
+            prose-li:marker:text-gray-500
+            prose-hr:border-dark-600 prose-hr:my-6
+            prose-img:rounded-xl prose-img:shadow-lg"
+          dangerouslySetInnerHTML={{ __html: content.content }}
+        />
+        <div className="mt-8 pt-6 border-t border-dark-600 text-sm text-gray-500">
+          Последнее обновление: {new Date(content.updated_at).toLocaleDateString('ru-RU', {
+            day: 'numeric',
+            month: 'long',
+            year: 'numeric'
+          })}
+        </div>
+      </GlassCard>
+    </div>
+  )
+}

frontend/src/pages/admin/AdminContentPage.tsx

@@ -3,7 +3,8 @@ import { adminApi } from '@/api'
 import type { StaticContent } from '@/types'
 import { useToast } from '@/store/toast'
 import { NeonButton } from '@/components/ui'
-import { FileText, Plus, Pencil, X, Save, Code } from 'lucide-react'
+import { FileText, Plus, Pencil, X, Save, Code, Trash2 } from 'lucide-react'
+import { useConfirm } from '@/store/confirm'
 
 function formatDate(dateStr: string) {
   return new Date(dateStr).toLocaleString('ru-RU', {
@@ -28,6 +29,7 @@ export function AdminContentPage() {
   const [formContent, setFormContent] = useState('')
 
   const toast = useToast()
+  const confirm = useConfirm()
 
   useEffect(() => {
     loadContents()
@@ -101,6 +103,30 @@ export function AdminContentPage() {
     }
   }
 
+  const handleDelete = async (content: StaticContent) => {
+    const confirmed = await confirm({
+      title: 'Удалить контент?',
+      message: `Вы уверены, что хотите удалить "${content.title}"? Это действие нельзя отменить.`,
+      confirmText: 'Удалить',
+      cancelText: 'Отмена',
+      variant: 'danger',
+    })
+
+    if (!confirmed) return
+
+    try {
+      await adminApi.deleteContent(content.key)
+      setContents(contents.filter(c => c.id !== content.id))
+      if (editing?.id === content.id) {
+        handleCancel()
+      }
+      toast.success('Контент удалён')
+    } catch (err) {
+      console.error('Failed to delete content:', err)
+      toast.error('Ошибка удаления')
+    }
+  }
+
   if (loading) {
     return (
       <div className="flex items-center justify-center h-64">
@@ -155,15 +181,28 @@ export function AdminContentPage() {
                       {content.content.replace(/<[^>]*>/g, '').slice(0, 100)}...
                     </p>
                   </div>
-                  <button
-                    onClick={(e) => {
-                      e.stopPropagation()
-                      handleEdit(content)
-                    }}
-                    className="p-2 text-gray-400 hover:text-accent-400 hover:bg-accent-500/10 rounded-lg transition-colors ml-3"
-                  >
-                    <Pencil className="w-4 h-4" />
-                  </button>
+                  <div className="flex items-center gap-1 ml-3">
+                    <button
+                      onClick={(e) => {
+                        e.stopPropagation()
+                        handleEdit(content)
+                      }}
+                      className="p-2 text-gray-400 hover:text-accent-400 hover:bg-accent-500/10 rounded-lg transition-colors"
+                      title="Редактировать"
+                    >
+                      <Pencil className="w-4 h-4" />
+                    </button>
+                    <button
+                      onClick={(e) => {
+                        e.stopPropagation()
+                        handleDelete(content)
+                      }}
+                      className="p-2 text-gray-400 hover:text-red-400 hover:bg-red-500/10 rounded-lg transition-colors"
+                      title="Удалить"
+                    >
+                      <Trash2 className="w-4 h-4" />
+                    </button>
+                  </div>
                 </div>
                 <p className="text-xs text-gray-500 mt-4 pt-3 border-t border-dark-600">
                   Обновлено: {formatDate(content.updated_at)}