-
Recent Activity
+
{t('activity.title')}
{recentChats.map((chat, index) => (
@@ -141,7 +144,7 @@ function App() {
-
🏆 Top Players
+
{t('activity.topPlayers')}
1. ProGamer99 - 2,450 pts
2. SniperElite - 2,180 pts
@@ -149,11 +152,11 @@ function App() {
-
🎯 Quick Stats
+
{t('activity.quickStats')}
-
Avg Match Time: 12m 34s
-
Most Popular Map: Dust2
-
Peak Hours: 8-11 PM
+
{t('activity.avgMatchTime')}
+
{t('activity.mostPopularMap')}
+
{t('activity.peakHours')}
@@ -164,32 +167,32 @@ function App() {
diff --git a/src/components/LanguageSelector.css b/src/components/LanguageSelector.css
new file mode 100644
index 0000000..997717c
--- /dev/null
+++ b/src/components/LanguageSelector.css
@@ -0,0 +1,35 @@
+.language-selector {
+ position: relative;
+}
+
+.language-dropdown {
+ background: rgba(0, 0, 0, 0.8);
+ border: 1px solid var(--primary-red);
+ color: var(--text-primary);
+ padding: 0.5rem 1rem;
+ border-radius: 6px;
+ font-size: 0.9rem;
+ cursor: pointer;
+ min-width: 100px;
+ transition: all 0.3s ease;
+}
+
+.language-dropdown:focus {
+ outline: none;
+ border-color: var(--primary-red-hover);
+ box-shadow: 0 0 0 2px rgba(255, 70, 85, 0.2);
+}
+
+.language-dropdown option {
+ background: var(--dark-bg);
+ color: var(--text-primary);
+}
+
+/* Mobile responsive */
+@media (max-width: 768px) {
+ .language-dropdown {
+ font-size: 0.8rem;
+ padding: 0.4rem 0.8rem;
+ min-width: 80px;
+ }
+}
\ No newline at end of file
diff --git a/src/components/LanguageSelector.tsx b/src/components/LanguageSelector.tsx
new file mode 100644
index 0000000..12842bd
--- /dev/null
+++ b/src/components/LanguageSelector.tsx
@@ -0,0 +1,33 @@
+import { useTranslation } from 'react-i18next'
+import './LanguageSelector.css'
+
+function LanguageSelector() {
+ const { i18n, t } = useTranslation()
+
+ const changeLanguage = (lng: string) => {
+ i18n.changeLanguage(lng)
+ }
+
+ const languages = [
+ { code: 'en', name: t('languages.english') },
+ { code: 'zh', name: t('languages.chinese') }
+ ]
+
+ return (
+
+ changeLanguage(e.target.value)}
+ className="language-dropdown"
+ >
+ {languages.map((lang) => (
+
+ {lang.name}
+
+ ))}
+
+
+ )
+}
+
+export default LanguageSelector
\ No newline at end of file
diff --git a/src/i18n.ts b/src/i18n.ts
new file mode 100644
index 0000000..2714b36
--- /dev/null
+++ b/src/i18n.ts
@@ -0,0 +1,36 @@
+import i18n from 'i18next'
+import { initReactI18next } from 'react-i18next'
+import LanguageDetector from 'i18next-browser-languagedetector'
+
+import en from './locales/en.json'
+import zh from './locales/zh.json'
+
+const resources = {
+ en: {
+ translation: en
+ },
+ zh: {
+ translation: zh
+ }
+}
+
+i18n
+ .use(LanguageDetector) // Detect user language
+ .use(initReactI18next) // Pass i18n down to react-i18next
+ .init({
+ resources,
+ fallbackLng: 'en', // Fallback to English if detection fails
+ debug: false,
+
+ interpolation: {
+ escapeValue: false // React already does escaping
+ },
+
+ detection: {
+ order: ['localStorage', 'navigator', 'htmlTag'],
+ lookupLocalStorage: 'language',
+ caches: ['localStorage']
+ }
+ })
+
+export default i18n
\ No newline at end of file
diff --git a/src/locales/en.json b/src/locales/en.json
new file mode 100644
index 0000000..d9bdfc3
--- /dev/null
+++ b/src/locales/en.json
@@ -0,0 +1,74 @@
+{
+ "nav": {
+ "logo": "CS Community",
+ "servers": "Servers",
+ "blog": "Blog",
+ "git": "Git",
+ "forum": "Forum",
+ "joinNow": "Join Now"
+ },
+ "hero": {
+ "title": "Welcome to the Ultimate",
+ "titleHighlight": "Counter-Strike",
+ "titleEnd": "Community",
+ "subtitle": "Join thousands of players in competitive matches, casual games, and community events. Experience the best gaming community with dedicated servers and passionate players.",
+ "startPlaying": "🎮 Start Playing",
+ "viewStats": "📊 View Stats"
+ },
+ "stats": {
+ "onlinePlayers": "Online Players",
+ "activeServers": "Active Servers",
+ "hoursPlayed": "Hours Played",
+ "liveMatches": "Live Matches"
+ },
+ "features": {
+ "title": "Community Features",
+ "serverBrowser": {
+ "title": "Server Browser",
+ "description": "Find and join the best Counter-Strike servers. Browse by game mode, region, and player count."
+ },
+ "blog": {
+ "title": "Community Blog",
+ "description": "Stay updated with the latest news, tournament results, and community announcements."
+ },
+ "git": {
+ "title": "Open Source",
+ "description": "Contribute to our open-source projects. Custom maps, configs, and community tools."
+ },
+ "forum": {
+ "title": "Discussion Forum",
+ "description": "Join discussions about strategies, share your experiences, and connect with fellow gamers."
+ },
+ "browseServers": "Browse Servers",
+ "readBlog": "Read Blog",
+ "viewGitHub": "View GitHub",
+ "joinForum": "Join Forum"
+ },
+ "activity": {
+ "title": "Recent Activity",
+ "topPlayers": "🏆 Top Players",
+ "quickStats": "🎯 Quick Stats",
+ "avgMatchTime": "Avg Match Time: 12m 34s",
+ "mostPopularMap": "Most Popular Map: Dust2",
+ "peakHours": "Peak Hours: 8-11 PM"
+ },
+ "footer": {
+ "community": "🎯 CS Community",
+ "communityDesc": "The ultimate destination for Counter-Strike enthusiasts worldwide.",
+ "quickLinks": "Quick Links",
+ "communityLinks": "Community",
+ "legal": "Legal",
+ "discord": "Discord",
+ "steamGroup": "Steam Group",
+ "tournaments": "Tournaments",
+ "support": "Support",
+ "privacyPolicy": "Privacy Policy",
+ "termsOfService": "Terms of Service",
+ "contact": "Contact",
+ "copyright": "© 2025 CS Community. All rights reserved. | Made with ❤️ for gamers"
+ },
+ "languages": {
+ "english": "English",
+ "chinese": "中文"
+ }
+}
\ No newline at end of file
diff --git a/src/locales/zh.json b/src/locales/zh.json
new file mode 100644
index 0000000..e0969ce
--- /dev/null
+++ b/src/locales/zh.json
@@ -0,0 +1,74 @@
+{
+ "nav": {
+ "logo": "CS 社区",
+ "servers": "服务器",
+ "blog": "博客",
+ "git": "开源",
+ "forum": "论坛",
+ "joinNow": "立即加入"
+ },
+ "hero": {
+ "title": "欢迎来到终极",
+ "titleHighlight": "反恐精英",
+ "titleEnd": "社区",
+ "subtitle": "加入数千名玩家参与竞技比赛、休闲游戏和社区活动。在专用服务器和热情玩家中体验最佳游戏社区。",
+ "startPlaying": "🎮 开始游戏",
+ "viewStats": "📊 查看统计"
+ },
+ "stats": {
+ "onlinePlayers": "在线玩家",
+ "activeServers": "活跃服务器",
+ "hoursPlayed": "游戏时长",
+ "liveMatches": "实时比赛"
+ },
+ "features": {
+ "title": "社区功能",
+ "serverBrowser": {
+ "title": "服务器浏览器",
+ "description": "查找并加入最佳反恐精英服务器。按游戏模式、地区和玩家数量浏览。"
+ },
+ "blog": {
+ "title": "社区博客",
+ "description": "及时了解最新新闻、锦标赛结果和社区公告。"
+ },
+ "git": {
+ "title": "开源项目",
+ "description": "为我们的开源项目做出贡献。自定义地图、配置和社区工具。"
+ },
+ "forum": {
+ "title": "讨论论坛",
+ "description": "加入关于策略的讨论，分享您的经验，与其他玩家交流。"
+ },
+ "browseServers": "浏览服务器",
+ "readBlog": "阅读博客",
+ "viewGitHub": "查看 GitHub",
+ "joinForum": "加入论坛"
+ },
+ "activity": {
+ "title": "最近活动",
+ "topPlayers": "🏆 顶级玩家",
+ "quickStats": "🎯 快速统计",
+ "avgMatchTime": "平均比赛时长：12分34秒",
+ "mostPopularMap": "最受欢迎地图：Dust2",
+ "peakHours": "高峰时段：晚上8-11点"
+ },
+ "footer": {
+ "community": "🎯 CS 社区",
+ "communityDesc": "反恐精英爱好者的终极目的地。",
+ "quickLinks": "快速链接",
+ "communityLinks": "社区",
+ "legal": "法律",
+ "discord": "Discord",
+ "steamGroup": "Steam 群组",
+ "tournaments": "锦标赛",
+ "support": "支持",
+ "privacyPolicy": "隐私政策",
+ "termsOfService": "服务条款",
+ "contact": "联系我们",
+ "copyright": "© 2025 CS 社区。保留所有权利。| 用 ❤️ 为玩家打造"
+ },
+ "languages": {
+ "english": "English",
+ "chinese": "中文"
+ }
+}
\ No newline at end of file
diff --git a/src/main.tsx b/src/main.tsx
index bef5202..cd81cee 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -1,6 +1,7 @@
import { StrictMode } from 'react'
import { createRoot } from 'react-dom/client'
import './index.css'
+import './i18n'
import App from './App.tsx'
createRoot(document.getElementById('root')!).render(