Add Friends page with layout and navigation; update localization for new content

This commit is contained in:
2025-10-03 15:59:25 +08:00
parent 0149a79bef
commit 1b745c7ffc
10 changed files with 440 additions and 60 deletions

View File

@@ -1,6 +1,5 @@
import { useTranslation } from 'react-i18next'
import LanguageSelector from './components/LanguageSelector'
import ThemeToggle from './components/ThemeToggle'
import Layout from './components/Layout'
import './App.css'
function App() {
@@ -23,26 +22,7 @@ function App() {
]
return (
<div className="app">
{/* Navigation Header */}
<nav className="navbar">
<div className="nav-container">
<div className="nav-logo">
<h2>🎯 {t('nav.logo')}</h2>
</div>
<div className="nav-links">
<a href="#servers">{t('nav.servers')}</a>
<a href="#blog">{t('nav.blog')}</a>
<a href="https://git.cialloo.com">{t('nav.git')}</a>
<a href="#forum">{t('nav.forum')}</a>
<a href="#friends">{t('nav.friends')}</a>
<ThemeToggle />
<LanguageSelector />
<button className="join-btn">{t('nav.joinNow')}</button>
</div>
</div>
</nav>
<Layout currentPage="home">
{/* Hero Section */}
<section className="hero">
<div className="hero-content">
@@ -165,41 +145,7 @@ function App() {
</div>
</div>
</section>
{/* Footer */}
<footer className="footer">
<div className="footer-container">
<div className="footer-section">
<h4>{t('footer.community')}</h4>
<p>{t('footer.communityDesc')}</p>
</div>
<div className="footer-section">
<h4>{t('footer.quickLinks')}</h4>
<a href="#servers">{t('nav.servers')}</a>
<a href="#blog">{t('nav.blog')}</a>
<a href="https://git.cialloo.com">{t('nav.git')}</a>
<a href="#forum">{t('nav.forum')}</a>
<a href="#friends">{t('nav.friends')}</a>
</div>
<div className="footer-section">
<h4>{t('footer.communityLinks')}</h4>
<a href="#">{t('footer.discord')}</a>
<a href="#">{t('footer.steamGroup')}</a>
<a href="#">{t('footer.tournaments')}</a>
<a href="#">{t('footer.support')}</a>
</div>
<div className="footer-section">
<h4>{t('footer.legal')}</h4>
<a href="#">{t('footer.privacyPolicy')}</a>
<a href="#">{t('footer.termsOfService')}</a>
<a href="#">{t('footer.contact')}</a>
</div>
</div>
<div className="footer-bottom">
<p>{t('footer.copyright')}</p>
</div>
</footer>
</div>
</Layout>
)
}