import { Button, Card } from '@heroui/react'
import { useNavigate } from 'react-router-dom'

export default function AboutPage() {
  const navigate = useNavigate()

  return (
    <div className="container mx-auto max-w-4xl px-6 py-12">
      <Card>
        <Card.Header>
          <Card.Title className="text-3xl font-bold">
            关于 HLAE 中文站
          </Card.Title>
        </Card.Header>
        <Card.Content className="prose dark:prose-invert">
          <p className="text-default-500 mb-6 leading-relaxed">
            HLAE 中文站是一个致力于为 CS 视频制作者提供工具和资源的社区。
            我们旨在简化创作流程，提供各种实用的工具、录像分析和下载加速服务。
          </p>
        </Card.Content>
        <Card.Footer>
          <Button onPress={() => navigate('/')}>返回首页</Button>
        </Card.Footer>
      </Card>
    </div>
  )
}
