650 lines
30 KiB
TypeScript
650 lines
30 KiB
TypeScript
'use client';
|
||
|
||
import { useState, useCallback, useEffect } from 'react';
|
||
import { useTranslation } from '../lib/i18n/useTranslation';
|
||
import { languages } from '../lib/i18n/config';
|
||
import { getNewsById, getAllNews, parseMarkdownContent, type NewsItem } from '../lib/news';
|
||
|
||
interface NewsDetailPageProps {
|
||
initialLanguage?: string;
|
||
newsId: string;
|
||
}
|
||
|
||
// 只保留元信息，正文内容已迁移到 md 文件
|
||
interface NewsArticleMeta {
|
||
id: number;
|
||
category: string;
|
||
date: string;
|
||
readTime: string;
|
||
image: string;
|
||
}
|
||
|
||
// 仅示例，实际内容请从 md 文件读取
|
||
const newsArticles: NewsArticleMeta[] = [
|
||
{
|
||
id: 1,
|
||
category: 'product',
|
||
date: '2024-01-15',
|
||
readTime: '5 min',
|
||
image: 'https://images.unsplash.com/photo-1504711434969-e33886168f5c?w=800&h=600&fit=crop',
|
||
},
|
||
{
|
||
id: 2,
|
||
category: 'industry',
|
||
date: '2024-01-12',
|
||
readTime: '8 min',
|
||
image: 'https://images.unsplash.com/photo-1586953208448-b95a79798f07?w=800&h=600&fit=crop',
|
||
},
|
||
{
|
||
id: 3,
|
||
category: 'company',
|
||
date: '2024-01-10',
|
||
readTime: '3 min',
|
||
image: 'https://images.unsplash.com/photo-1552664730-d307ca884978?w=800&h=600&fit=crop',
|
||
},
|
||
];
|
||
|
||
// 分类图标映射
|
||
const categoryIcons = {
|
||
company: '🏢',
|
||
product: '📦',
|
||
industry: '🏭',
|
||
technology: '💻',
|
||
};
|
||
|
||
export default function NewsDetailPage({ initialLanguage, newsId }: NewsDetailPageProps) {
|
||
const { language, t, changeLanguage, getLocalizedPath, isInitialized } =
|
||
useTranslation(initialLanguage);
|
||
const [isMenuOpen, setIsMenuOpen] = useState(false);
|
||
const [showScrollTop, setShowScrollTop] = useState(false);
|
||
|
||
const handleLanguageChange = useCallback(
|
||
(newLanguage: string) => {
|
||
changeLanguage(newLanguage as any);
|
||
},
|
||
[changeLanguage],
|
||
);
|
||
|
||
// 获取新闻元信息
|
||
const article = newsArticles.find((article) => article.id.toString() === newsId);
|
||
|
||
// 滚动到顶部功能
|
||
const scrollToTop = () => {
|
||
window.scrollTo({ top: 0, behavior: 'smooth' });
|
||
};
|
||
|
||
// 监听滚动事件
|
||
useEffect(() => {
|
||
const handleScroll = () => {
|
||
setShowScrollTop(window.scrollY > 300);
|
||
};
|
||
window.addEventListener('scroll', handleScroll);
|
||
return () => window.removeEventListener('scroll', handleScroll);
|
||
}, []);
|
||
|
||
// 格式化日期
|
||
const formatDate = (dateString: string) => {
|
||
const date = new Date(dateString);
|
||
if (language === 'en') {
|
||
return date.toLocaleDateString('en-US', {
|
||
year: 'numeric',
|
||
month: 'long',
|
||
day: 'numeric',
|
||
});
|
||
} else {
|
||
return date.toLocaleDateString('zh-CN', {
|
||
year: 'numeric',
|
||
month: 'long',
|
||
day: 'numeric',
|
||
});
|
||
}
|
||
};
|
||
|
||
// 在语言初始化完成前显示加载状态
|
||
if (!isInitialized) {
|
||
return (
|
||
<div
|
||
className="min-h-screen bg-gradient-to-br from-blue-50 via-indigo-50 to-purple-50 flex items-center justify-center"
|
||
data-oid="0ta7hzw"
|
||
>
|
||
<div className="text-center" data-oid="08wl8cy">
|
||
<div
|
||
className="w-12 h-12 border-4 border-blue-600 border-t-transparent rounded-full animate-spin mx-auto mb-4"
|
||
data-oid="vl74wbo"
|
||
></div>
|
||
<p className="text-gray-600" data-oid="gfr0.6-">
|
||
Loading...
|
||
</p>
|
||
</div>
|
||
</div>
|
||
);
|
||
}
|
||
|
||
// 如果找不到文章，显示404页面
|
||
if (!article) {
|
||
return (
|
||
<div
|
||
className="min-h-screen bg-gradient-to-br from-blue-50 via-indigo-50 to-purple-50 flex items-center justify-center"
|
||
data-oid="dv3f8p5"
|
||
>
|
||
<div className="text-center" data-oid="oea:fzl">
|
||
<div className="text-8xl mb-4" data-oid="s2xkcxo">
|
||
📰
|
||
</div>
|
||
<h1 className="text-4xl font-bold text-gray-900 mb-4" data-oid="ef93e0s">
|
||
{language === 'en'
|
||
? 'Article Not Found'
|
||
: language === 'zh-CN'
|
||
? '文章未找到'
|
||
: '文章未找到'}
|
||
</h1>
|
||
<p className="text-lg text-gray-600 mb-8" data-oid="2irbjo7">
|
||
{language === 'en'
|
||
? 'The article you are looking for does not exist or has been moved.'
|
||
: language === 'zh-CN'
|
||
? '您查找的文章不存在或已被移动。'
|
||
: '您查找的文章不存在或已被移動。'}
|
||
</p>
|
||
<a
|
||
href={getLocalizedPath('/news')}
|
||
className="bg-gradient-to-r from-blue-600 to-purple-600 text-white px-8 py-3 rounded-full font-semibold hover:from-blue-700 hover:to-purple-700 transition-all duration-300 transform hover:scale-105 shadow-lg hover:shadow-xl"
|
||
data-oid="w.k9kpi"
|
||
>
|
||
{language === 'en'
|
||
? 'Back to News'
|
||
: language === 'zh-CN'
|
||
? '返回新闻'
|
||
: '返回新聞'}
|
||
</a>
|
||
</div>
|
||
</div>
|
||
);
|
||
}
|
||
|
||
// Navigation items
|
||
const navItems = [
|
||
{ key: 'home', label: t.nav.home, href: getLocalizedPath('/') },
|
||
{ key: 'products', label: t.nav.products, href: getLocalizedPath('/products') },
|
||
{ key: 'news', label: t.nav.news, href: getLocalizedPath('/news') },
|
||
{ key: 'support', label: t.nav.support, href: getLocalizedPath('/support') },
|
||
{ key: 'about', label: t.nav.about, href: getLocalizedPath('/about') },
|
||
];
|
||
|
||
return (
|
||
<div
|
||
className="min-h-screen bg-gradient-to-br from-blue-50 via-indigo-50 to-purple-50"
|
||
data-oid="pzoby69"
|
||
>
|
||
{/* Navigation */}
|
||
<nav
|
||
className="fixed top-0 left-0 w-full z-50 bg-white/80 backdrop-blur-md border-b border-white/20 shadow-sm"
|
||
data-oid="q6axiuz"
|
||
>
|
||
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8" data-oid="6.7qdqy">
|
||
<div className="flex justify-between items-center h-16" data-oid="wwgkjio">
|
||
{/* Logo */}
|
||
<div className="flex items-center" data-oid="or0niw4">
|
||
<div className="flex-shrink-0" data-oid="xb9n7.m">
|
||
<div
|
||
className="w-10 h-10 bg-gradient-to-r from-blue-600 to-purple-600 rounded-lg flex items-center justify-center"
|
||
data-oid=":ps6kar"
|
||
>
|
||
<span
|
||
className="text-white font-bold text-lg"
|
||
data-oid="3.i-xlz"
|
||
>
|
||
T
|
||
</span>
|
||
</div>
|
||
</div>
|
||
<div className="ml-3" data-oid="mo0ialc">
|
||
<span
|
||
className="text-xl font-semibold bg-gradient-to-r from-blue-600 to-purple-600 bg-clip-text text-transparent"
|
||
data-oid="6zwerlx"
|
||
>
|
||
TechCorp
|
||
</span>
|
||
</div>
|
||
</div>
|
||
|
||
{/* Desktop Navigation */}
|
||
<div className="hidden md:block" data-oid="u5chrs:">
|
||
<div className="ml-10 flex items-baseline space-x-8" data-oid="8lji8:h">
|
||
{navItems.map((item) => (
|
||
<a
|
||
key={item.key}
|
||
href={item.href}
|
||
className={`px-3 py-2 text-sm font-medium transition-colors duration-200 rounded-md ${
|
||
item.key === 'news'
|
||
? 'text-blue-600 bg-blue-50'
|
||
: 'text-gray-700 hover:text-blue-600 hover:bg-blue-50'
|
||
}`}
|
||
data-oid="xdfk9k7"
|
||
>
|
||
{item.label}
|
||
</a>
|
||
))}
|
||
</div>
|
||
</div>
|
||
|
||
{/* Language Selector & Mobile Menu */}
|
||
<div className="flex items-center space-x-4" data-oid="jes62r1">
|
||
{/* Language Selector */}
|
||
<div className="relative" data-oid="6xi2mpu">
|
||
<select
|
||
value={language}
|
||
onChange={(e) => handleLanguageChange(e.target.value)}
|
||
className="appearance-none bg-white/80 border border-gray-200 rounded-md px-3 py-1 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||
data-oid="28q4bda"
|
||
>
|
||
{languages.map((lang) => (
|
||
<option
|
||
key={lang.code}
|
||
value={lang.code}
|
||
data-oid="3qqkghq"
|
||
>
|
||
{lang.flag} {lang.label}
|
||
</option>
|
||
))}
|
||
</select>
|
||
</div>
|
||
|
||
{/* Mobile menu button */}
|
||
<div className="md:hidden" data-oid="vei0onh">
|
||
<button
|
||
onClick={() => setIsMenuOpen(!isMenuOpen)}
|
||
className="text-gray-700 hover:text-blue-600 p-2"
|
||
data-oid="l_mhpyq"
|
||
>
|
||
<svg
|
||
className="h-6 w-6"
|
||
fill="none"
|
||
viewBox="0 0 24 24"
|
||
stroke="currentColor"
|
||
data-oid=".ma02zl"
|
||
>
|
||
<path
|
||
strokeLinecap="round"
|
||
strokeLinejoin="round"
|
||
strokeWidth={2}
|
||
d="M4 6h16M4 12h16M4 18h16"
|
||
data-oid="zrh6s9r"
|
||
/>
|
||
</svg>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
{/* Mobile Navigation */}
|
||
{isMenuOpen && (
|
||
<div className="md:hidden" data-oid="ve3l6d_">
|
||
<div
|
||
className="px-2 pt-2 pb-3 space-y-1 bg-white/90 backdrop-blur-md rounded-lg mt-2"
|
||
data-oid="ii7_x3z"
|
||
>
|
||
{navItems.map((item) => (
|
||
<a
|
||
key={item.key}
|
||
href={item.href}
|
||
className={`block px-3 py-2 text-base font-medium transition-colors duration-200 ${
|
||
item.key === 'news'
|
||
? 'text-blue-600 bg-blue-50'
|
||
: 'text-gray-700 hover:text-blue-600'
|
||
}`}
|
||
data-oid="86wr5.a"
|
||
>
|
||
{item.label}
|
||
</a>
|
||
))}
|
||
</div>
|
||
</div>
|
||
)}
|
||
</div>
|
||
</nav>
|
||
|
||
{/* Breadcrumb */}
|
||
<section className="pt-20 pb-4 px-4 sm:px-6 lg:px-8" data-oid="8un-lq5">
|
||
<div className="max-w-4xl mx-auto" data-oid="zv4e73a">
|
||
<nav className="flex" data-oid="e3wvxn5">
|
||
<ol className="flex items-center space-x-2" data-oid="6wbmmil">
|
||
<li data-oid="e.aqwn.">
|
||
<a
|
||
href={getLocalizedPath('/')}
|
||
className="text-gray-500 hover:text-blue-600 transition-colors"
|
||
data-oid="pq4wa-o"
|
||
>
|
||
{t.nav.home}
|
||
</a>
|
||
</li>
|
||
<li data-oid="kdh1f8_">
|
||
<span className="text-gray-400" data-oid="86.6cka">
|
||
/
|
||
</span>
|
||
</li>
|
||
<li data-oid="2qz7txu">
|
||
<a
|
||
href={getLocalizedPath('/news')}
|
||
className="text-gray-500 hover:text-blue-600 transition-colors"
|
||
data-oid="ebn1xz1"
|
||
>
|
||
{t.nav.news}
|
||
</a>
|
||
</li>
|
||
<li data-oid="nd.e71w">
|
||
<span className="text-gray-400" data-oid="vjkez4f">
|
||
/
|
||
</span>
|
||
</li>
|
||
<li data-oid="3aru9ik">
|
||
<span className="text-gray-900 font-medium" data-oid="3th0wam">
|
||
{article.category.charAt(0).toUpperCase() +
|
||
article.category.slice(1)}
|
||
</span>
|
||
</li>
|
||
</ol>
|
||
</nav>
|
||
</div>
|
||
</section>
|
||
|
||
{/* Article Header */}
|
||
<section className="pb-8 px-4 sm:px-6 lg:px-8" data-oid="r21fm2p">
|
||
<div className="max-w-4xl mx-auto" data-oid="x8knt6x">
|
||
{/* Category Badge */}
|
||
<div className="mb-6" data-oid="5ku0o66">
|
||
<span
|
||
className="bg-gradient-to-r from-blue-600 to-purple-600 text-white px-4 py-2 rounded-full text-sm font-bold flex items-center gap-2 w-fit"
|
||
data-oid="6ih0cbm"
|
||
>
|
||
<span data-oid="6yhe.t9">
|
||
{categoryIcons[article.category as keyof typeof categoryIcons]}
|
||
</span>
|
||
{language === 'en'
|
||
? article.category.charAt(0).toUpperCase() +
|
||
article.category.slice(1)
|
||
: article.category === 'company'
|
||
? language === 'zh-CN'
|
||
? '公司'
|
||
: '公司'
|
||
: article.category === 'product'
|
||
? language === 'zh-CN'
|
||
? '产品'
|
||
: '產品'
|
||
: article.category === 'industry'
|
||
? language === 'zh-CN'
|
||
? '行业'
|
||
: '行業'
|
||
: article.category === 'technology'
|
||
? language === 'zh-CN'
|
||
? '技术'
|
||
: '技術'
|
||
: article.category}
|
||
</span>
|
||
</div>
|
||
|
||
{/* Title */}
|
||
<h1
|
||
className="text-4xl md:text-5xl font-bold text-gray-900 mb-6 leading-tight"
|
||
data-oid="x7.cek."
|
||
>
|
||
{article.category.charAt(0).toUpperCase() + article.category.slice(1)}
|
||
</h1>
|
||
|
||
{/* Meta Information */}
|
||
<div
|
||
className="flex flex-wrap items-center gap-6 text-gray-500 mb-8"
|
||
data-oid="jq69m::"
|
||
>
|
||
<div className="flex items-center gap-2" data-oid="ai7go_s">
|
||
<svg
|
||
className="w-5 h-5"
|
||
fill="none"
|
||
viewBox="0 0 24 24"
|
||
stroke="currentColor"
|
||
data-oid="6:hpmxn"
|
||
>
|
||
<path
|
||
strokeLinecap="round"
|
||
strokeLinejoin="round"
|
||
strokeWidth={2}
|
||
d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"
|
||
data-oid="p.4qqp."
|
||
/>
|
||
</svg>
|
||
<span data-oid="el170nw">{formatDate(article.date)}</span>
|
||
</div>
|
||
<div className="flex items-center gap-2" data-oid=":o1248:">
|
||
<svg
|
||
className="w-5 h-5"
|
||
fill="none"
|
||
viewBox="0 0 24 24"
|
||
stroke="currentColor"
|
||
data-oid="365g9tj"
|
||
>
|
||
<path
|
||
strokeLinecap="round"
|
||
strokeLinejoin="round"
|
||
strokeWidth={2}
|
||
d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"
|
||
data-oid="2tabb-7"
|
||
/>
|
||
</svg>
|
||
<span data-oid="rlt9gvp">{article.readTime}</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
{/* Featured Image */}
|
||
<section className="pb-12 px-4 sm:px-6 lg:px-8" data-oid="1ocsoa4">
|
||
<div className="max-w-4xl mx-auto" data-oid="28vuu78">
|
||
<div
|
||
className="relative h-64 md:h-96 rounded-2xl overflow-hidden shadow-2xl"
|
||
data-oid="ml734h9"
|
||
>
|
||
<img
|
||
src={article.image}
|
||
alt={
|
||
article.category.charAt(0).toUpperCase() + article.category.slice(1)
|
||
}
|
||
className="w-full h-full object-cover"
|
||
data-oid="-rq1me-"
|
||
/>
|
||
|
||
<div
|
||
className="absolute inset-0 bg-gradient-to-t from-black/20 to-transparent"
|
||
data-oid="q_a28lv"
|
||
></div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
{/* CTA Section */}
|
||
<section
|
||
className="py-20 px-4 sm:px-6 lg:px-8 bg-gradient-to-r from-blue-600 to-purple-600"
|
||
data-oid="0knjf6d"
|
||
>
|
||
<div className="max-w-4xl mx-auto text-center text-white" data-oid="vodcka5">
|
||
<h2 className="text-3xl md:text-4xl font-bold mb-6" data-oid="egkl-38">
|
||
{language === 'en'
|
||
? 'Stay Updated'
|
||
: language === 'zh-CN'
|
||
? '保持更新'
|
||
: '保持更新'}
|
||
</h2>
|
||
<p className="text-xl mb-8 opacity-90" data-oid="p2emj--">
|
||
{language === 'en'
|
||
? 'Subscribe to our newsletter and never miss important updates and insights.'
|
||
: language === 'zh-CN'
|
||
? '订阅我们的新闻通讯，不要错过重要的更新和见解。'
|
||
: '訂閱我們的新聞通訊，不要錯過重要的更新和見解。'}
|
||
</p>
|
||
<div
|
||
className="flex flex-col sm:flex-row gap-4 justify-center"
|
||
data-oid="w6xf7ts"
|
||
>
|
||
<button
|
||
className="bg-white text-blue-600 px-8 py-3 rounded-full font-semibold hover:bg-gray-100 transition-all duration-300 transform hover:scale-105"
|
||
data-oid="olut2he"
|
||
>
|
||
{language === 'en'
|
||
? 'Subscribe Newsletter'
|
||
: language === 'zh-CN'
|
||
? '订阅新闻'
|
||
: '訂閱新聞'}
|
||
</button>
|
||
<a
|
||
href={getLocalizedPath('/news')}
|
||
className="border-2 border-white text-white px-8 py-3 rounded-full font-semibold hover:bg-white hover:text-blue-600 transition-all duration-300 transform hover:scale-105"
|
||
data-oid="6031.q."
|
||
>
|
||
{language === 'en'
|
||
? 'View All News'
|
||
: language === 'zh-CN'
|
||
? '查看所有新闻'
|
||
: '查看所有新聞'}
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
{/* 回到顶部按钮 */}
|
||
{showScrollTop && (
|
||
<button
|
||
onClick={scrollToTop}
|
||
className="fixed bottom-8 right-8 bg-gradient-to-r from-blue-600 to-purple-600 text-white p-3 rounded-full shadow-lg hover:shadow-xl transition-all duration-300 transform hover:scale-110 z-40"
|
||
data-oid=".40.c6-"
|
||
>
|
||
<svg
|
||
className="w-6 h-6"
|
||
fill="none"
|
||
viewBox="0 0 24 24"
|
||
stroke="currentColor"
|
||
data-oid="4jvjf0_"
|
||
>
|
||
<path
|
||
strokeLinecap="round"
|
||
strokeLinejoin="round"
|
||
strokeWidth={2}
|
||
d="M5 10l7-7m0 0l7 7m-7-7v18"
|
||
data-oid="1sjnnat"
|
||
/>
|
||
</svg>
|
||
</button>
|
||
)}
|
||
|
||
{/* Footer */}
|
||
<footer
|
||
className="bg-gray-900 text-white py-12 px-4 sm:px-6 lg:px-8"
|
||
data-oid="aih53pj"
|
||
>
|
||
<div className="max-w-7xl mx-auto" data-oid="_3wnlza">
|
||
<div className="grid grid-cols-1 md:grid-cols-4 gap-8" data-oid="semd9fj">
|
||
<div data-oid="w2ea2vq">
|
||
<div className="flex items-center mb-4" data-oid="5r3e-.m">
|
||
<div
|
||
className="w-8 h-8 bg-gradient-to-r from-blue-600 to-purple-600 rounded-lg flex items-center justify-center mr-3"
|
||
data-oid="y61zy4v"
|
||
>
|
||
<span className="text-white font-bold" data-oid="gzv54a4">
|
||
T
|
||
</span>
|
||
</div>
|
||
<span className="text-xl font-semibold" data-oid="mdz4l:t">
|
||
TechCorp
|
||
</span>
|
||
</div>
|
||
<p className="text-gray-400" data-oid="k_hh1je">
|
||
{t.footer.description}
|
||
</p>
|
||
</div>
|
||
|
||
<div data-oid="hnn:udv">
|
||
<h3 className="text-lg font-semibold mb-4" data-oid="v:lbw9d">
|
||
{t.footer.sections.products.title}
|
||
</h3>
|
||
<ul className="space-y-2 text-gray-400" data-oid="j2l0lrl">
|
||
{t.footer.sections.products.items.map((item, index) => (
|
||
<li key={index} data-oid="ao37a-1">
|
||
<a
|
||
href={getLocalizedPath(item.href)}
|
||
className="hover:text-white transition-colors"
|
||
data-oid="hgpri.7"
|
||
>
|
||
{item.label}
|
||
</a>
|
||
</li>
|
||
))}
|
||
</ul>
|
||
</div>
|
||
|
||
<div data-oid="sn.6b00">
|
||
<h3 className="text-lg font-semibold mb-4" data-oid="iq1::4w">
|
||
{t.footer.sections.support.title}
|
||
</h3>
|
||
<ul className="space-y-2 text-gray-400" data-oid="71if07s">
|
||
{t.footer.sections.support.items.map((item, index) => (
|
||
<li key={index} data-oid="1wgkl5.">
|
||
<a
|
||
href={getLocalizedPath(item.href)}
|
||
className="hover:text-white transition-colors"
|
||
data-oid="66z6wpf"
|
||
>
|
||
{item.label}
|
||
</a>
|
||
</li>
|
||
))}
|
||
</ul>
|
||
</div>
|
||
|
||
<div data-oid="mynso0l">
|
||
<h3 className="text-lg font-semibold mb-4" data-oid="4i0ne5n">
|
||
{t.footer.sections.social.title}
|
||
</h3>
|
||
<div className="flex space-x-4" data-oid="uiklr52">
|
||
<a
|
||
href="#"
|
||
className="text-gray-400 hover:text-white transition-colors"
|
||
data-oid="ybqhlhb"
|
||
>
|
||
<span className="sr-only" data-oid="lzigd2.">
|
||
微信
|
||
</span>
|
||
💬
|
||
</a>
|
||
<a
|
||
href="#"
|
||
className="text-gray-400 hover:text-white transition-colors"
|
||
data-oid=".8.:jx6"
|
||
>
|
||
<span className="sr-only" data-oid="y-1a.hk">
|
||
微博
|
||
</span>
|
||
📱
|
||
</a>
|
||
<a
|
||
href="#"
|
||
className="text-gray-400 hover:text-white transition-colors"
|
||
data-oid="a45p3p6"
|
||
>
|
||
<span className="sr-only" data-oid="rai9kgq">
|
||
邮箱
|
||
</span>
|
||
📧
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div
|
||
className="border-t border-gray-800 mt-8 pt-8 text-center text-gray-400"
|
||
data-oid="n9w-8pe"
|
||
>
|
||
<p data-oid="8g0j82x">© 2024 TechCorp. {t.footer.copyright}</p>
|
||
</div>
|
||
</div>
|
||
</footer>
|
||
</div>
|
||
);
|
||
}
|