HI-VPN/hi-landing
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

更新链接

Browse Source
This commit is contained in:
speakeloudest 2025-11-14 08:29:26 -08:00
parent 4d57422103
commit 29408ee979
9 changed files with 459 additions and 324 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/assets/hi-home-logo.svg Normal file
View File

@ -0,0 +1,5 @@
<svg width="429" height="360" viewBox="0 0 429 360" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path d="M126.397 143.749H206.991L234.774 0H319.122L250.041 360H165.443L192.975 216.502H112.381L84.5986 360H0L59.3191 52.6829L33.0385 0H153.929L126.397 143.749Z" fill="currentColor" style="mix-blend-mode:plus-lighter"/>
<path d="M359.669 360H275.321L324.649 103.108H409.175L359.669 360Z" fill="currentColor" style="mix-blend-mode:plus-lighter"/>
<path d="M413.305 81.7003H328.758L344.401 0.250871H429L413.305 81.7003Z" fill="currentColor" style="mix-blend-mode:plus-lighter"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 592 B

40
src/components/Layout.tsx
View File

@ -2,6 +2,7 @@ import { ReactNode } from 'react';
import { Link, useLocation } from 'react-router-dom'; import { Link, useLocation } from 'react-router-dom';
import { Shield, Globe, Zap, Lock, Smartphone, Laptop, Download, Mail, MapPin, Phone, Languages } from 'lucide-react'; import { Shield, Globe, Zap, Lock, Smartphone, Laptop, Download, Mail, MapPin, Phone, Languages } from 'lucide-react';
import { useLanguage } from '@/contexts/LanguageContext'; import { useLanguage } from '@/contexts/LanguageContext';
import HiLogo from '@/assets/hi-home-logo.svg?react';
interface LayoutProps { interface LayoutProps {
children: ReactNode; children: ReactNode;
@ -25,52 +26,52 @@ export default function Layout({ children }: LayoutProps) {
<div className="flex justify-between items-center h-16"> <div className="flex justify-between items-center h-16">
<div className="flex items-center"> <div className="flex items-center">
<Link to="/" className="flex items-center space-x-2"> <Link to="/" className="flex items-center space-x-2">
<Shield className="h-8 w-8 text-blue-400" /> <HiLogo className="h-8 w-8 text-blue-400" />
<span className="text-2xl font-bold text-white">HiFast VPN</span> <span className="text-2xl font-bold text-white">HiFast VPN</span>
</Link> </Link>
</div> </div>
<div className="hidden md:flex items-center space-x-8"> <div className="hidden md:flex items-center space-x-8">
<Link <Link
to="/" to="/"
className={`px-3 py-2 rounded-md text-sm font-medium transition-colors ${ className={`px-3 py-2 rounded-md text-sm font-medium transition-colors ${
isActive('/') ? 'text-blue-400 bg-white/10' : 'text-white hover:text-blue-400' isActive('/') ? 'text-blue-400 bg-white/10' : 'text-white hover:text-blue-400'
}`} }`}
> >
{t('nav.home')} {t('nav.home')}
</Link> </Link>
<Link <Link
to="/about" to="/about"
className={`px-3 py-2 rounded-md text-sm font-medium transition-colors ${ className={`px-3 py-2 rounded-md text-sm font-medium transition-colors ${
isActive('/about') ? 'text-blue-400 bg-white/10' : 'text-white hover:text-blue-400' isActive('/about') ? 'text-blue-400 bg-white/10' : 'text-white hover:text-blue-400'
}`} }`}
> >
{t('nav.about')} {t('nav.about')}
</Link> </Link>
<Link <Link
to="/privacy" to="/privacy"
className={`px-3 py-2 rounded-md text-sm font-medium transition-colors ${ className={`px-3 py-2 rounded-md text-sm font-medium transition-colors ${
isActive('/privacy') ? 'text-blue-400 bg-white/10' : 'text-white hover:text-blue-400' isActive('/privacy') ? 'text-blue-400 bg-white/10' : 'text-white hover:text-blue-400'
}`} }`}
> >
{t('nav.privacy')} {t('nav.privacy')}
</Link> </Link>
<Link <Link
to="/terms" to="/terms"
className={`px-3 py-2 rounded-md text-sm font-medium transition-colors ${ className={`px-3 py-2 rounded-md text-sm font-medium transition-colors ${
isActive('/terms') ? 'text-blue-400 bg-white/10' : 'text-white hover:text-blue-400' isActive('/terms') ? 'text-blue-400 bg-white/10' : 'text-white hover:text-blue-400'
}`} }`}
> >
{t('nav.terms')} {t('nav.terms')}
</Link> </Link>
<Link <Link
to="/contact" to="/contact"
className={`px-3 py-2 rounded-md text-sm font-medium transition-colors ${ className={`px-3 py-2 rounded-md text-sm font-medium transition-colors ${
isActive('/contact') ? 'text-blue-400 bg-white/10' : 'text-white hover:text-blue-400' isActive('/contact') ? 'text-blue-400 bg-white/10' : 'text-white hover:text-blue-400'
}`} }`}
> >
{t('nav.contact')} {t('nav.contact')}
</Link> </Link>
{/* Language Switcher */} {/* Language Switcher */}
<button <button
onClick={toggleLanguage} onClick={toggleLanguage}
@ -96,12 +97,11 @@ export default function Layout({ children }: LayoutProps) {
<div className="grid grid-cols-1 md:grid-cols-4 gap-8"> <div className="grid grid-cols-1 md:grid-cols-4 gap-8">
<div className="col-span-1 md:col-span-2"> <div className="col-span-1 md:col-span-2">
<div className="flex items-center space-x-2 mb-4"> <div className="flex items-center space-x-2 mb-4">
<Shield className="h-8 w-8 text-blue-400" /> <HiLogo className="h-8 w-8 text-blue-400" />
<span className="text-2xl font-bold text-white">HiFast VPN</span> <span className="text-2xl font-bold text-white">{t('footer.brand')}</span>
</div> </div>
<p className="text-gray-300 mb-4"> <p className="text-gray-300 mb-4">
Premium VPN service providing secure, fast, and reliable internet access worldwide. {t('footer.description')}
Operated by TAW TRADERS SDN. BHD.
</p> </p>
<div className="flex space-x-4"> <div className="flex space-x-4">
<div className="flex items-center space-x-2 text-gray-300"> <div className="flex items-center space-x-2 text-gray-300">
@ -114,7 +114,7 @@ export default function Layout({ children }: LayoutProps) {
</div> </div>
</div> </div>
</div> </div>
<div> <div>
<h3 className="text-white font-semibold mb-4">{t('footer.products')}</h3> <h3 className="text-white font-semibold mb-4">{t('footer.products')}</h3>
<ul className="space-y-2 text-gray-300"> <ul className="space-y-2 text-gray-300">
@ -124,7 +124,7 @@ export default function Layout({ children }: LayoutProps) {
<li><a href="#" className="hover:text-blue-400 transition-colors">{t('common.macos')}</a></li> <li><a href="#" className="hover:text-blue-400 transition-colors">{t('common.macos')}</a></li>
</ul> </ul>
</div> </div>
<div> <div>
<h3 className="text-white font-semibold mb-4">{t('footer.support')}</h3> <h3 className="text-white font-semibold mb-4">{t('footer.support')}</h3>
<ul className="space-y-2 text-gray-300"> <ul className="space-y-2 text-gray-300">
@ -135,7 +135,7 @@ export default function Layout({ children }: LayoutProps) {
</ul> </ul>
</div> </div>
</div> </div>
<div className="border-t border-white/20 mt-8 pt-8"> <div className="border-t border-white/20 mt-8 pt-8">
<div className="flex flex-col md:flex-row justify-between items-center"> <div className="flex flex-col md:flex-row justify-between items-center">
<p className="text-gray-400 text-sm"> <p className="text-gray-400 text-sm">
@ -150,4 +150,4 @@ export default function Layout({ children }: LayoutProps) {
</footer> </footer>
</div> </div>
); );
} }

220
src/contexts/LanguageContext.tsx
View File

@ -33,7 +33,7 @@ export const LanguageProvider: React.FC<LanguageProviderProps> = ({ children })
'nav.privacy': 'Privacy Policy', 'nav.privacy': 'Privacy Policy',
'nav.terms': 'Terms', 'nav.terms': 'Terms',
'nav.contact': 'Contact', 'nav.contact': 'Contact',
// Footer // Footer
'footer.products': 'Products', 'footer.products': 'Products',
'footer.support': 'Support', 'footer.support': 'Support',
@ -42,7 +42,9 @@ export const LanguageProvider: React.FC<LanguageProviderProps> = ({ children })
'footer.operated': 'Operated by TAW TRADERS SDN. BHD. (Malaysia)', 'footer.operated': 'Operated by TAW TRADERS SDN. BHD. (Malaysia)',
'footer.countries': '105+ Countries', 'footer.countries': '105+ Countries',
'footer.speed': 'Lightning Fast', 'footer.speed': 'Lightning Fast',
'footer.description': 'Premium VPN service providing secure, fast, and reliable internet access worldwide. Operated by TAW TRADERS SDN. BHD.',
'footer.brand': 'HiFast VPN',
// Home Page // Home Page
'home.hero.title': 'Secure Your Digital Life with', 'home.hero.title': 'Secure Your Digital Life with',
'home.hero.subtitle': 'HiFast VPN', 'home.hero.subtitle': 'HiFast VPN',
@ -72,7 +74,7 @@ export const LanguageProvider: React.FC<LanguageProviderProps> = ({ children })
'home.stats.support': 'Support', 'home.stats.support': 'Support',
'home.status.available': 'Available', 'home.status.available': 'Available',
'home.status.comingSoon': 'Coming Soon', 'home.status.comingSoon': 'Coming Soon',
// About Page // About Page
'about.title': 'About', 'about.title': 'About',
'about.subtitle': 'HiFast VPN', 'about.subtitle': 'HiFast VPN',
@ -81,6 +83,8 @@ export const LanguageProvider: React.FC<LanguageProviderProps> = ({ children })
'about.company.name': 'Company Name', 'about.company.name': 'Company Name',
'about.company.location': 'Registered Location', 'about.company.location': 'Registered Location',
'about.company.focus': 'Business Focus', 'about.company.focus': 'Business Focus',
'about.company.locationValue': 'Malaysia',
'about.company.businessValue': 'Network Communications & VPN Services',
'about.mission.title': 'Our Mission', 'about.mission.title': 'Our Mission',
'about.mission.text': 'To provide secure, fast, and reliable internet access to users worldwide while maintaining the highest standards of privacy protection and customer service.', 'about.mission.text': 'To provide secure, fast, and reliable internet access to users worldwide while maintaining the highest standards of privacy protection and customer service.',
'about.stats.experience': 'Years of Experience', 'about.stats.experience': 'Years of Experience',
@ -101,7 +105,7 @@ export const LanguageProvider: React.FC<LanguageProviderProps> = ({ children })
'about.legal.compliance': 'Compliance', 'about.legal.compliance': 'Compliance',
'about.legal.business.desc': 'TAW TRADERS SDN. BHD. is a legally registered company in Malaysia, operating in the network communications and VPN services sector.', 'about.legal.business.desc': 'TAW TRADERS SDN. BHD. is a legally registered company in Malaysia, operating in the network communications and VPN services sector.',
'about.legal.compliance.desc': 'We adhere to international privacy standards and regulations, ensuring our users\' data protection and privacy rights.', 'about.legal.compliance.desc': 'We adhere to international privacy standards and regulations, ensuring our users\' data protection and privacy rights.',
// Privacy Page // Privacy Page
'privacy.title': 'Privacy Policy', 'privacy.title': 'Privacy Policy',
'privacy.updated': 'Last updated: January 1, 2025', 'privacy.updated': 'Last updated: January 1, 2025',
@ -113,11 +117,42 @@ export const LanguageProvider: React.FC<LanguageProviderProps> = ({ children })
'privacy.contact.title': 'Contact Us', 'privacy.contact.title': 'Contact Us',
'privacy.contact.text': 'If you have any questions about this Privacy Policy or our privacy practices, please contact us:', 'privacy.contact.text': 'If you have any questions about this Privacy Policy or our privacy practices, please contact us:',
'privacy.company': 'Company', 'privacy.company': 'Company',
'privacy.emailValue': 'privacy@hifastvpn.com',
// Privacy Sections
'privacy.informationCollection.title': 'Information We Collect',
'privacy.informationCollection.personalInfo': 'Personal Information: When you create an account, we collect your email address, username, and payment information.',
'privacy.informationCollection.usageData': 'Usage Data: We collect information about how you use our VPN services, including connection timestamps and server locations.',
'privacy.informationCollection.deviceInfo': 'Device Information: We may collect device identifiers, operating system, and app version information.',
'privacy.informationCollection.paymentInfo': 'Payment Information: Payment details are processed through secure third-party payment processors and are not stored on our servers.',
'privacy.howWeUse.title': 'How We Use Your Information',
'privacy.howWeUse.serviceProvision': 'Service Provision: To provide and maintain our VPN services, including customer support.',
'privacy.howWeUse.accountManagement': 'Account Management: To manage your account, process payments, and send service-related communications.',
'privacy.howWeUse.serviceImprovement': 'Service Improvement: To analyze usage patterns and improve our services and user experience.',
'privacy.howWeUse.legalCompliance': 'Legal Compliance: To comply with legal obligations and protect our legal rights.',
'privacy.dataSecurity.title': 'Data Security',
'privacy.dataSecurity.encryption': 'Encryption: All data transmitted through our VPN services is encrypted using military-grade AES-256 encryption.',
'privacy.dataSecurity.noLogPolicy': 'No-Log Policy: We do not log your browsing activity, traffic destinations, or DNS queries while connected to our VPN.',
'privacy.dataSecurity.secureInfrastructure': 'Secure Infrastructure: Our servers are maintained with the highest security standards and regular security audits.',
'privacy.dataSecurity.dataRetention': 'Data Retention: We retain minimal connection logs for service optimization and are automatically deleted after 30 days.',
'privacy.thirdPartyServices.title': 'Third-Party Services',
'privacy.thirdPartyServices.paymentProcessors': 'Payment Processors: We use trusted third-party payment processors to handle payment transactions securely.',
'privacy.thirdPartyServices.analytics': 'Analytics: We may use analytics services to understand app usage patterns, excluding personal browsing data.',
'privacy.thirdPartyServices.serviceProviders': 'Service Providers: We may engage trusted third-party service providers to assist in providing our services.',
'privacy.yourRights.title': 'Your Rights',
'privacy.yourRights.access': 'Access: You have the right to access the personal information we hold about you.',
'privacy.yourRights.correction': 'Correction: You can update or correct your personal information through your account settings.',
'privacy.yourRights.deletion': 'Deletion: You can request deletion of your account and associated personal information.',
'privacy.yourRights.dataPortability': 'Data Portability: You can request a copy of your personal data in a machine-readable format.',
'privacy.email': 'Email', 'privacy.email': 'Email',
'privacy.policy': 'Policy Updates', 'privacy.policy': 'Policy Updates',
'privacy.policy.text': 'We will notify users of any material changes to this policy', 'privacy.policy.text': 'We will notify users of any material changes to this policy',
'privacy.acknowledgement': 'By using HiFast VPN services, you acknowledge that you have read and understood this Privacy Policy. Your privacy is our priority, and we are committed to protecting your digital rights.', 'privacy.acknowledgement': 'By using HiFast VPN services, you acknowledge that you have read and understood this Privacy Policy. Your privacy is our priority, and we are committed to protecting your digital rights.',
// Terms Page // Terms Page
'terms.title': 'Terms of Service', 'terms.title': 'Terms of Service',
'terms.updated': 'Last updated: January 1, 2025', 'terms.updated': 'Last updated: January 1, 2025',
@ -140,13 +175,67 @@ export const LanguageProvider: React.FC<LanguageProviderProps> = ({ children })
'terms.contact': 'Contact:', 'terms.contact': 'Contact:',
'terms.contact.text': 'For questions about these terms, please contact us at legal@hifastvpn.com', 'terms.contact.text': 'For questions about these terms, please contact us at legal@hifastvpn.com',
'terms.acknowledgement': 'By using HiFast VPN services, you acknowledge that you have read, understood, and agree to these Terms of Service.', 'terms.acknowledgement': 'By using HiFast VPN services, you acknowledge that you have read, understood, and agree to these Terms of Service.',
// Terms Content Sections
'terms.acceptance.content1': 'By accessing or using HiFast VPN services, you acknowledge that you have read, understood, and agree to be bound by these Terms of Service.',
'terms.acceptance.content2': 'These terms constitute a legally binding agreement between you and TAW TRADERS SDN. BHD. regarding your use of our VPN services.',
'terms.acceptance.content3': 'If you do not agree to these terms, you must not access or use our services.',
'terms.service.content1': 'HiFast VPN provides secure virtual private network services that encrypt your internet connection and protect your online privacy.',
'terms.service.content2': 'Our services include access to VPN servers in multiple countries, unlimited bandwidth, and 24/7 customer support.',
'terms.service.content3': 'We reserve the right to modify, suspend, or discontinue any aspect of our services at any time.',
'terms.responsibilities.content1': 'You are responsible for maintaining the confidentiality of your account credentials and for all activities that occur under your account.',
'terms.responsibilities.content2': 'You agree to use our services only for lawful purposes and in compliance with all applicable laws and regulations.',
'terms.responsibilities.content3': 'You must not use our services to engage in any illegal activities, including but not limited to copyright infringement, fraud, or cybercrime.',
'terms.responsibilities.content4': 'You are responsible for ensuring that your use of our services does not violate any third-party rights.',
'terms.prohibited.content1': 'You may not use our services to transmit or distribute malware, viruses, or other harmful software.',
'terms.prohibited.content2': 'You may not use our services to engage in spamming, phishing, or other deceptive practices.',
'terms.prohibited.content3': 'You may not use our services to access or distribute illegal content or engage in activities that violate local laws.',
'terms.prohibited.content4': 'You may not attempt to circumvent security measures or gain unauthorized access to our systems or networks.',
'terms.limitations.content1': 'Our services are provided on an "as is" and "as available" basis without warranties of any kind.',
'terms.limitations.content2': 'We do not guarantee that our services will be uninterrupted, error-free, or completely secure.',
'terms.limitations.content3': 'We are not responsible for any damages arising from your use of our services, including but not limited to data loss or service interruptions.',
'terms.limitations.content4': 'Our liability is limited to the maximum extent permitted by applicable law.',
'terms.payment.content1': 'Payment for our services is processed through secure third-party payment processors.',
'terms.payment.content2': 'All fees are non-refundable unless otherwise specified in our refund policy.',
'terms.payment.content3': 'We reserve the right to change our pricing at any time with prior notice to subscribers.',
'terms.payment.content4': 'You are responsible for all charges incurred under your account, including applicable taxes.',
'terms.privacy.content1': 'We are committed to protecting your privacy and do not log your browsing activity or traffic destinations.',
'terms.privacy.content2': 'We collect minimal connection logs for service optimization and security purposes.',
'terms.privacy.content3': 'Your personal information is processed in accordance with our Privacy Policy.',
'terms.privacy.content4': 'We implement industry-standard security measures to protect your data.',
'terms.termination.content1': 'We may terminate or suspend your account immediately if you violate these Terms of Service.',
'terms.termination.content2': 'Upon termination, your right to use our services will immediately cease.',
'terms.termination.content3': 'All provisions of these terms that by their nature should survive termination shall survive.',
'terms.termination.content4': 'We are not liable for any damages resulting from termination of your account.',
'terms.copyright': '© 2025 TAW TRADERS SDN. BHD. All rights reserved.',
// Service Provider Section
'terms.serviceProvider.title': 'Service Provider',
'terms.serviceProvider.companyDetails': 'Company Details',
'terms.serviceProvider.companyName': 'Company Name',
'terms.serviceProvider.businessType': 'Business Type',
'terms.serviceProvider.businessTypeValue': 'Network Communications & VPN Services',
'terms.serviceProvider.registration': 'Registration',
'terms.serviceProvider.registrationValue': 'Malaysia',
'terms.serviceProvider.serviceCommitment': 'Service Commitment',
'terms.serviceProvider.serviceCommitmentContent': 'We are committed to providing secure, fast, and reliable VPN services while maintaining the highest standards of privacy protection and customer service.',
'terms.serviceProvider.operatedBy': 'Operated by',
'terms.serviceProvider.trustedProvider': 'Your trusted VPN provider',
// Contact Page // Contact Page
'contact.title': 'Contact', 'contact.title': 'Contact',
'contact.subtitle': 'Us', 'contact.subtitle': 'Us',
'contact.description': 'We\'re here to help! Get in touch with our support team for any questions, technical assistance, or business inquiries.', 'contact.description': 'We\'re here to help! Get in touch with our support team for any questions, technical assistance, or business inquiries.',
'contact.email.title': 'Email Support', 'contact.email.title': 'Email Support',
'contact.email.value': 'support@hifastvpn.com', 'contact.email.value': 'admin@hifastvpn.com',
'contact.email.desc': 'Get help with any questions or issues', 'contact.email.desc': 'Get help with any questions or issues',
'contact.hours.title': 'Support Hours', 'contact.hours.title': 'Support Hours',
'contact.hours.value': '24/7 Support', 'contact.hours.value': '24/7 Support',
@ -183,7 +272,7 @@ export const LanguageProvider: React.FC<LanguageProviderProps> = ({ children })
'contact.response.technical.time': 'Within 12 hours', 'contact.response.technical.time': 'Within 12 hours',
'contact.response.billing.time': 'Within 6 hours', 'contact.response.billing.time': 'Within 6 hours',
'contact.success': 'Thank you for your message! We will get back to you soon.', 'contact.success': 'Thank you for your message! We will get back to you soon.',
// Common // Common
'common.app': 'App', 'common.app': 'App',
'common.windows': 'Windows', 'common.windows': 'Windows',
@ -221,10 +310,8 @@ export const LanguageProvider: React.FC<LanguageProviderProps> = ({ children })
'common.filter': 'Filter', 'common.filter': 'Filter',
'common.sort': 'Sort', 'common.sort': 'Sort',
'common.view': 'View', 'common.view': 'View',
'common.edit': 'Edit',
'common.update': 'Update', 'common.update': 'Update',
'common.create': 'Create', 'common.create': 'Create',
'common.remove': 'Remove',
'common.refresh': 'Refresh', 'common.refresh': 'Refresh',
'common.retry': 'Retry', 'common.retry': 'Retry',
'common.continue': 'Continue', 'common.continue': 'Continue',
@ -242,7 +329,6 @@ export const LanguageProvider: React.FC<LanguageProviderProps> = ({ children })
'common.show': 'Show', 'common.show': 'Show',
'common.hide': 'Hide', 'common.hide': 'Hide',
'common.open': 'Open', 'common.open': 'Open',
'common.close': 'Close',
'common.expand': 'Expand', 'common.expand': 'Expand',
'common.collapse': 'Collapse', 'common.collapse': 'Collapse',
'common.enable': 'Enable', 'common.enable': 'Enable',
@ -261,7 +347,7 @@ export const LanguageProvider: React.FC<LanguageProviderProps> = ({ children })
'nav.privacy': '隐私政策', 'nav.privacy': '隐私政策',
'nav.terms': '服务条款', 'nav.terms': '服务条款',
'nav.contact': '联系我们', 'nav.contact': '联系我们',
// Footer // Footer
'footer.products': '产品', 'footer.products': '产品',
'footer.support': '支持', 'footer.support': '支持',
@ -270,7 +356,9 @@ export const LanguageProvider: React.FC<LanguageProviderProps> = ({ children })
'footer.operated': '由 TAW TRADERS SDN. BHD.（马来西亚）运营', 'footer.operated': '由 TAW TRADERS SDN. BHD.（马来西亚）运营',
'footer.countries': '105+ 国家', 'footer.countries': '105+ 国家',
'footer.speed': '闪电般快速', 'footer.speed': '闪电般快速',
'footer.description': '提供全球安全、快速、可靠的互联网访问的高级VPN服务。由 TAW TRADERS SDN. BHD. 运营。',
'footer.brand': 'HiFast VPN',
// Home Page // Home Page
'home.hero.title': '保护您的数字生活', 'home.hero.title': '保护您的数字生活',
'home.hero.subtitle': 'HiFast VPN', 'home.hero.subtitle': 'HiFast VPN',
@ -300,7 +388,7 @@ export const LanguageProvider: React.FC<LanguageProviderProps> = ({ children })
'home.stats.support': '支持', 'home.stats.support': '支持',
'home.status.available': '可用', 'home.status.available': '可用',
'home.status.comingSoon': '即将推出', 'home.status.comingSoon': '即将推出',
// About Page // About Page
'about.title': '关于', 'about.title': '关于',
'about.subtitle': 'HiFast VPN', 'about.subtitle': 'HiFast VPN',
@ -309,6 +397,8 @@ export const LanguageProvider: React.FC<LanguageProviderProps> = ({ children })
'about.company.name': '公司名称', 'about.company.name': '公司名称',
'about.company.location': '注册地点', 'about.company.location': '注册地点',
'about.company.focus': '业务重点', 'about.company.focus': '业务重点',
'about.company.locationValue': '马来西亚',
'about.company.businessValue': '网络通信与VPN服务',
'about.mission.title': '我们的使命', 'about.mission.title': '我们的使命',
'about.mission.text': '为全球用户提供安全、快速、可靠的互联网访问，同时保持最高标准的隐私保护和客户服务。', 'about.mission.text': '为全球用户提供安全、快速、可靠的互联网访问，同时保持最高标准的隐私保护和客户服务。',
'about.stats.experience': '多年经验', 'about.stats.experience': '多年经验',
@ -329,7 +419,7 @@ export const LanguageProvider: React.FC<LanguageProviderProps> = ({ children })
'about.legal.compliance': '合规性', 'about.legal.compliance': '合规性',
'about.legal.business.desc': 'TAW TRADERS SDN. BHD. 是在马来西亚合法注册的公司，在网络通信和 VPN 服务领域运营。', 'about.legal.business.desc': 'TAW TRADERS SDN. BHD. 是在马来西亚合法注册的公司，在网络通信和 VPN 服务领域运营。',
'about.legal.compliance.desc': '我们遵守国际隐私标准和法规，确保用户的数据保护和隐私权。', 'about.legal.compliance.desc': '我们遵守国际隐私标准和法规，确保用户的数据保护和隐私权。',
// Privacy Page // Privacy Page
'privacy.title': '隐私政策', 'privacy.title': '隐私政策',
'privacy.updated': '最后更新：2025年1月1日', 'privacy.updated': '最后更新：2025年1月1日',
@ -341,11 +431,42 @@ export const LanguageProvider: React.FC<LanguageProviderProps> = ({ children })
'privacy.contact.title': '联系我们', 'privacy.contact.title': '联系我们',
'privacy.contact.text': '如果您对本隐私政策或我们的隐私实践有任何疑问，请联系我们：', 'privacy.contact.text': '如果您对本隐私政策或我们的隐私实践有任何疑问，请联系我们：',
'privacy.company': '公司', 'privacy.company': '公司',
'privacy.emailValue': 'privacy@hifastvpn.com',
// Privacy Sections (Chinese)
'privacy.informationCollection.title': '我们收集的信息',
'privacy.informationCollection.personalInfo': '个人信息：当您创建账户时，我们会收集您的电子邮件地址、用户名和付款信息。',
'privacy.informationCollection.usageData': '使用数据：我们收集有关您如何使用我们VPN服务的信息，包括连接时间戳和服务器位置。',
'privacy.informationCollection.deviceInfo': '设备信息：我们可能会收集设备标识符、操作系统和应用程序版本信息。',
'privacy.informationCollection.paymentInfo': '付款信息：付款详情通过安全的第三方付款处理器处理，不会存储在我们的服务器上。',
'privacy.howWeUse.title': '我们如何使用您的信息',
'privacy.howWeUse.serviceProvision': '服务提供：提供和维护我们的VPN服务，包括客户支持。',
'privacy.howWeUse.accountManagement': '账户管理：管理您的账户、处理付款并发送与服务相关的通信。',
'privacy.howWeUse.serviceImprovement': '服务改进：分析使用模式并改善我们的服务和用户体验。',
'privacy.howWeUse.legalCompliance': '法律合规：遵守法律义务并保护我们的合法权利。',
'privacy.dataSecurity.title': '数据安全',
'privacy.dataSecurity.encryption': '加密：通过我们VPN服务传输的所有数据都使用军用级AES-256加密进行加密。',
'privacy.dataSecurity.noLogPolicy': '无日志政策：我们不会记录您连接到VPN时的浏览活动、流量目的地或DNS查询。',
'privacy.dataSecurity.secureInfrastructure': '安全基础设施：我们的服务器以最高安全标准维护，并定期接受安全审计。',
'privacy.dataSecurity.dataRetention': '数据保留：我们保留最少的连接日志用于服务优化，并会在30天后自动删除。',
'privacy.thirdPartyServices.title': '第三方服务',
'privacy.thirdPartyServices.paymentProcessors': '付款处理器：我们使用可信的第三方付款处理器来安全地处理付款交易。',
'privacy.thirdPartyServices.analytics': '分析：我们可能会使用分析服务来了解应用程序使用模式，不包括个人浏览数据。',
'privacy.thirdPartyServices.serviceProviders': '服务提供商：我们可能会聘请可信的第三方服务提供商来协助提供服务。',
'privacy.yourRights.title': '您的权利',
'privacy.yourRights.access': '访问：您有权访问我们持有的关于您的个人信息。',
'privacy.yourRights.correction': '更正：您可以通过账户设置更新或更正您的个人信息。',
'privacy.yourRights.deletion': '删除：您可以请求删除您的账户和相关个人信息。',
'privacy.yourRights.dataPortability': '数据可携带性：您可以请求以机器可读格式获取您的个人数据副本。',
'privacy.email': '电子邮件', 'privacy.email': '电子邮件',
'privacy.policy': '政策更新', 'privacy.policy': '政策更新',
'privacy.policy.text': '我们将通知用户本政策的任何重大变更', 'privacy.policy.text': '我们将通知用户本政策的任何重大变更',
'privacy.acknowledgement': '使用 HiFast VPN 服务，即表示您承认您已阅读并理解本隐私政策。您的隐私是我们的首要任务，我们致力于保护您的数字权利。', 'privacy.acknowledgement': '使用 HiFast VPN 服务，即表示您承认您已阅读并理解本隐私政策。您的隐私是我们的首要任务，我们致力于保护您的数字权利。',
// Terms Page // Terms Page
'terms.title': '服务条款', 'terms.title': '服务条款',
'terms.updated': '最后更新：2025年1月1日', 'terms.updated': '最后更新：2025年1月1日',
@ -368,13 +489,67 @@ export const LanguageProvider: React.FC<LanguageProviderProps> = ({ children })
'terms.contact': '联系：', 'terms.contact': '联系：',
'terms.contact.text': '有关这些条款的问题，请通过 legal@hifastvpn.com 联系我们', 'terms.contact.text': '有关这些条款的问题，请通过 legal@hifastvpn.com 联系我们',
'terms.acknowledgement': '使用 HiFast VPN 服务，即表示您承认您已阅读、理解并同意这些服务条款。', 'terms.acknowledgement': '使用 HiFast VPN 服务，即表示您承认您已阅读、理解并同意这些服务条款。',
// Terms Content Sections
'terms.acceptance.content1': '访问或使用 HiFast VPN 服务，即表示您承认您已阅读、理解并同意受这些服务条款的约束。',
'terms.acceptance.content2': '这些条款构成您与 TAW TRADERS SDN. BHD. 之间关于您使用我们 VPN 服务的具有法律约束力的协议。',
'terms.acceptance.content3': '如果您不同意这些条款，您不得访问或使用我们的服务。',
'terms.service.content1': 'HiFast VPN 提供安全的虚拟专用网络服务，可加密您的互联网连接并保护您的在线隐私。',
'terms.service.content2': '我们的服务包括访问多个国家的 VPN 服务器、无限带宽和 24/7 客户支持。',
'terms.service.content3': '我们保留随时修改、暂停或终止我们服务任何方面的权利。',
'terms.responsibilities.content1': '您有责任维护您的账户凭据的机密性，并对您账户下发生的所有活动负责。',
'terms.responsibilities.content2': '您同意仅为合法目的使用我们的服务，并遵守所有适用的法律法规。',
'terms.responsibilities.content3': '您不得使用我们的服务从事任何非法活动，包括但不限于侵犯版权、欺诈或网络犯罪。',
'terms.responsibilities.content4': '您有责任确保您对我们服务的使用不侵犯任何第三方权利。',
'terms.prohibited.content1': '您不得使用我们的服务传输或分发恶意软件、病毒或其他有害软件。',
'terms.prohibited.content2': '您不得使用我们的服务从事垃圾邮件、网络钓鱼或其他欺骗行为。',
'terms.prohibited.content3': '您不得使用我们的服务访问或分发非法内容或从事违反当地法律的活动。',
'terms.prohibited.content4': '您不得试图绕过安全措施或获得对我们系统或网络的未经授权访问。',
'terms.limitations.content1': '我们的服务按"原样"和"可用"基础提供，不提供任何类型的保证。',
'terms.limitations.content2': '我们不保证我们的服务将不间断、无错误或完全安全。',
'terms.limitations.content3': '我们对因您使用我们的服务而引起的任何损害不承担责任，包括但不限于数据丢失或服务中断。',
'terms.limitations.content4': '我们的责任限制在适用法律允许的最大范围内。',
'terms.payment.content1': '我们服务的付款通过安全的第三方付款处理器处理。',
'terms.payment.content2': '除非我们的退款政策另有规定，否则所有费用均不予退还。',
'terms.payment.content3': '我们保留随时更改定价的权利，并会提前通知订阅者。',
'terms.payment.content4': '您对您账户下产生的所有费用负责，包括适用的税费。',
'terms.privacy.content1': '我们致力于保护您的隐私，不记录您的浏览活动或流量目的地。',
'terms.privacy.content2': '我们收集最少的连接日志用于服务优化和安全目的。',
'terms.privacy.content3': '您的个人信息根据我们的隐私政策进行处理。',
'terms.privacy.content4': '我们实施行业标准的安全措施来保护您的数据。',
'terms.termination.content1': '如果您违反这些服务条款，我们可能会立即终止或暂停您的账户。',
'terms.termination.content2': '终止后，您使用我们服务的权利将立即停止。',
'terms.termination.content3': '这些条款中按其性质应在终止后继续存在的所有条款应在终止后继续有效。',
'terms.termination.content4': '我们对因终止您的账户而导致的任何损害不承担责任。',
'terms.copyright': '© 2025 TAW TRADERS SDN. BHD. 保留所有权利。',
// Service Provider Section
'terms.serviceProvider.title': '服务提供商',
'terms.serviceProvider.companyDetails': '公司详情',
'terms.serviceProvider.companyName': '公司名称',
'terms.serviceProvider.businessType': '业务类型',
'terms.serviceProvider.businessTypeValue': '网络通信和 VPN 服务',
'terms.serviceProvider.registration': '注册地',
'terms.serviceProvider.registrationValue': '马来西亚',
'terms.serviceProvider.serviceCommitment': '服务承诺',
'terms.serviceProvider.serviceCommitmentContent': '我们致力于提供安全、快速和可靠的 VPN 服务，同时保持最高标准的隐私保护和客户服务。',
'terms.serviceProvider.operatedBy': '由',
'terms.serviceProvider.trustedProvider': '运营 - 您值得信赖的 VPN 提供商',
// Contact Page // Contact Page
'contact.title': '联系', 'contact.title': '联系',
'contact.subtitle': '我们', 'contact.subtitle': '我们',
'contact.description': '我们随时为您提供帮助！与我们的支持团队联系，获取任何问题、技术帮助或业务咨询。', 'contact.description': '我们随时为您提供帮助！与我们的支持团队联系，获取任何问题、技术帮助或业务咨询。',
'contact.email.title': '电子邮件支持', 'contact.email.title': '电子邮件支持',
'contact.email.value': 'support@hifastvpn.com', 'contact.email.value': 'admin@hifastvpn.com',
'contact.email.desc': '获得任何问题的帮助', 'contact.email.desc': '获得任何问题的帮助',
'contact.hours.title': '支持时间', 'contact.hours.title': '支持时间',
'contact.hours.value': '24/7 支持', 'contact.hours.value': '24/7 支持',
@ -411,7 +586,7 @@ export const LanguageProvider: React.FC<LanguageProviderProps> = ({ children })
'contact.response.technical.time': '12小时内', 'contact.response.technical.time': '12小时内',
'contact.response.billing.time': '6小时内', 'contact.response.billing.time': '6小时内',
'contact.success': '感谢您的消息！我们将尽快回复您。', 'contact.success': '感谢您的消息！我们将尽快回复您。',
// Common // Common
'common.app': '应用', 'common.app': '应用',
'common.windows': 'Windows', 'common.windows': 'Windows',
@ -449,10 +624,8 @@ export const LanguageProvider: React.FC<LanguageProviderProps> = ({ children })
'common.filter': '筛选', 'common.filter': '筛选',
'common.sort': '排序', 'common.sort': '排序',
'common.view': '查看', 'common.view': '查看',
'common.edit': '编辑',
'common.update': '更新', 'common.update': '更新',
'common.create': '创建', 'common.create': '创建',
'common.remove': '移除',
'common.refresh': '刷新', 'common.refresh': '刷新',
'common.retry': '重试', 'common.retry': '重试',
'common.continue': '继续', 'common.continue': '继续',
@ -470,9 +643,8 @@ export const LanguageProvider: React.FC<LanguageProviderProps> = ({ children })
'common.show': '显示', 'common.show': '显示',
'common.hide': '隐藏', 'common.hide': '隐藏',
'common.open': '打开', 'common.open': '打开',
'common.close': '关闭',
'common.expand': '展开', 'common.expand': '展开',
'common.collapse': '折叠', 'common.collapse': '收起',
'common.enable': '启用', 'common.enable': '启用',
'common.disable': '禁用', 'common.disable': '禁用',
'common.on': '开', 'common.on': '开',
@ -493,4 +665,4 @@ export const LanguageProvider: React.FC<LanguageProviderProps> = ({ children })
{children} {children}
</LanguageContext.Provider> </LanguageContext.Provider>
); );
}; };

6
src/pages/About.tsx
View File

@ -69,21 +69,21 @@ export default function About() {
<Building className="h-6 w-6 text-blue-400 mt-1 flex-shrink-0" /> <Building className="h-6 w-6 text-blue-400 mt-1 flex-shrink-0" />
<div> <div>
<h3 className="text-lg font-semibold text-white">{t('about.company.name')}</h3> <h3 className="text-lg font-semibold text-white">{t('about.company.name')}</h3>
<p className="text-gray-300">TAW TRADERS SDN. BHD.</p> <p className="text-gray-300">{t('company.name')}</p>
</div> </div>
</div> </div>
<div className="flex items-start space-x-3"> <div className="flex items-start space-x-3">
<MapPin className="h-6 w-6 text-blue-400 mt-1 flex-shrink-0" /> <MapPin className="h-6 w-6 text-blue-400 mt-1 flex-shrink-0" />
<div> <div>
<h3 className="text-lg font-semibold text-white">{t('about.company.location')}</h3> <h3 className="text-lg font-semibold text-white">{t('about.company.location')}</h3>
<p className="text-gray-300">Malaysia</p> <p className="text-gray-300">{t('about.company.locationValue')}</p>
</div> </div>
</div> </div>
<div className="flex items-start space-x-3"> <div className="flex items-start space-x-3">
<Shield className="h-6 w-6 text-blue-400 mt-1 flex-shrink-0" /> <Shield className="h-6 w-6 text-blue-400 mt-1 flex-shrink-0" />
<div> <div>
<h3 className="text-lg font-semibold text-white">{t('about.company.focus')}</h3> <h3 className="text-lg font-semibold text-white">{t('about.company.focus')}</h3>
<p className="text-gray-300">Network Communications & VPN Services</p> <p className="text-gray-300">{t('about.company.businessValue')}</p>
</div> </div>
</div> </div>
</div> </div>

87
src/pages/Contact.tsx
View File

@ -16,7 +16,7 @@ export default function Contact() {
e.preventDefault(); e.preventDefault();
// Handle form submission // Handle form submission
console.log('Form submitted:', formData); console.log('Form submitted:', formData);
alert(t('contact.form.successMessage')); alert(t('contact.success'));
setFormData({ name: '', email: '', subject: '', message: '' }); setFormData({ name: '', email: '', subject: '', message: '' });
}; };
@ -30,21 +30,21 @@ export default function Contact() {
const contactInfo = [ const contactInfo = [
{ {
icon: Mail, icon: Mail,
title: t('contact.info.email.title'), title: t('contact.email.title'),
value: t('contact.info.email.value'), value: t('contact.email.value'),
description: t('contact.info.email.description') description: t('contact.email.desc')
}, },
{ {
icon: Clock, icon: Clock,
title: t('contact.info.hours.title'), title: t('contact.hours.title'),
value: t('contact.info.hours.value'), value: t('contact.hours.value'),
description: t('contact.info.hours.description') description: t('contact.hours.desc')
}, },
{ {
icon: MapPin, icon: MapPin,
title: t('contact.info.address.title'), title: t('contact.address.title'),
value: t('contact.info.address.value'), value: t('contact.address.value'),
description: t('contact.info.address.description') description: t('contact.address.desc')
} }
]; ];
@ -59,11 +59,8 @@ export default function Contact() {
className="text-center mb-16" className="text-center mb-16"
> >
<h1 className="text-4xl md:text-5xl font-bold text-white mb-6"> <h1 className="text-4xl md:text-5xl font-bold text-white mb-6">
{t('contact.title')} <span className="text-blue-400">{t('contact.titleHighlight')}</span> {t('contact.title')} <span className="text-blue-400">{t('contact.description')}</span>
</h1> </h1>
<p className="text-xl text-gray-300 max-w-3xl mx-auto">
{t('contact.subtitle')}
</p>
</motion.div> </motion.div>
{/* Contact Information */} {/* Contact Information */}
@ -101,7 +98,7 @@ export default function Contact() {
<form onSubmit={handleSubmit} className="space-y-6"> <form onSubmit={handleSubmit} className="space-y-6">
<div> <div>
<label htmlFor="name" className="block text-white font-semibold mb-2"> <label htmlFor="name" className="block text-white font-semibold mb-2">
{t('contact.form.nameLabel')} {t('contact.form.name')}
</label> </label>
<div className="relative"> <div className="relative">
<User className="absolute left-3 top-3 h-5 w-5 text-gray-400" /> <User className="absolute left-3 top-3 h-5 w-5 text-gray-400" />
@ -113,14 +110,14 @@ export default function Contact() {
onChange={handleChange} onChange={handleChange}
required required
className="w-full pl-10 pr-4 py-3 bg-white/10 border border-white/20 rounded-lg text-white placeholder-gray-400 focus:outline-none focus:border-blue-400 transition-colors" className="w-full pl-10 pr-4 py-3 bg-white/10 border border-white/20 rounded-lg text-white placeholder-gray-400 focus:outline-none focus:border-blue-400 transition-colors"
placeholder={t('contact.form.namePlaceholder')} placeholder={t('contact.form.name.placeholder')}
/> />
</div> </div>
</div> </div>
<div> <div>
<label htmlFor="email" className="block text-white font-semibold mb-2"> <label htmlFor="email" className="block text-white font-semibold mb-2">
{t('contact.form.emailLabel')} {t('contact.form.email')}
</label> </label>
<div className="relative"> <div className="relative">
<Mail className="absolute left-3 top-3 h-5 w-5 text-gray-400" /> <Mail className="absolute left-3 top-3 h-5 w-5 text-gray-400" />
@ -132,14 +129,14 @@ export default function Contact() {
onChange={handleChange} onChange={handleChange}
required required
className="w-full pl-10 pr-4 py-3 bg-white/10 border border-white/20 rounded-lg text-white placeholder-gray-400 focus:outline-none focus:border-blue-400 transition-colors" className="w-full pl-10 pr-4 py-3 bg-white/10 border border-white/20 rounded-lg text-white placeholder-gray-400 focus:outline-none focus:border-blue-400 transition-colors"
placeholder={t('contact.form.emailPlaceholder')} placeholder={t('contact.form.email.placeholder')}
/> />
</div> </div>
</div> </div>
<div> <div>
<label htmlFor="subject" className="block text-white font-semibold mb-2"> <label htmlFor="subject" className="block text-white font-semibold mb-2">
{t('contact.form.subjectLabel')} {t('contact.form.subject')}
</label> </label>
<input <input
type="text" type="text"
@ -149,13 +146,13 @@ export default function Contact() {
onChange={handleChange} onChange={handleChange}
required required
className="w-full px-4 py-3 bg-white/10 border border-white/20 rounded-lg text-white placeholder-gray-400 focus:outline-none focus:border-blue-400 transition-colors" className="w-full px-4 py-3 bg-white/10 border border-white/20 rounded-lg text-white placeholder-gray-400 focus:outline-none focus:border-blue-400 transition-colors"
placeholder={t('contact.form.subjectPlaceholder')} placeholder={t('contact.form.subject.placeholder')}
/> />
</div> </div>
<div> <div>
<label htmlFor="message" className="block text-white font-semibold mb-2"> <label htmlFor="message" className="block text-white font-semibold mb-2">
{t('contact.form.messageLabel')} {t('contact.form.message')}
</label> </label>
<div className="relative"> <div className="relative">
<MessageSquare className="absolute left-3 top-3 h-5 w-5 text-gray-400" /> <MessageSquare className="absolute left-3 top-3 h-5 w-5 text-gray-400" />
@ -167,7 +164,7 @@ export default function Contact() {
required required
rows={5} rows={5}
className="w-full pl-10 pr-4 py-3 bg-white/10 border border-white/20 rounded-lg text-white placeholder-gray-400 focus:outline-none focus:border-blue-400 transition-colors resize-none" className="w-full pl-10 pr-4 py-3 bg-white/10 border border-white/20 rounded-lg text-white placeholder-gray-400 focus:outline-none focus:border-blue-400 transition-colors resize-none"
placeholder={t('contact.form.messagePlaceholder')} placeholder={t('contact.form.message.placeholder')}
/> />
</div> </div>
</div> </div>
@ -179,7 +176,7 @@ export default function Contact() {
className="w-full bg-blue-600 hover:bg-blue-700 text-white py-3 px-6 rounded-lg font-semibold flex items-center justify-center space-x-2 transition-colors" className="w-full bg-blue-600 hover:bg-blue-700 text-white py-3 px-6 rounded-lg font-semibold flex items-center justify-center space-x-2 transition-colors"
> >
<Send className="h-5 w-5" /> <Send className="h-5 w-5" />
<span>{t('contact.form.sendButton')}</span> <span>{t('contact.form.submit')}</span>
</motion.button> </motion.button>
</form> </form>
</div> </div>
@ -195,16 +192,16 @@ export default function Contact() {
> >
{/* Company Details */} {/* Company Details */}
<div className="bg-gradient-to-br from-blue-600 to-indigo-600 rounded-xl p-8"> <div className="bg-gradient-to-br from-blue-600 to-indigo-600 rounded-xl p-8">
<h2 className="text-2xl font-bold text-white mb-6">{t('contact.companyInfo.title')}</h2> <h2 className="text-2xl font-bold text-white mb-6">{t('contact.company.title')}</h2>
<div className="space-y-4"> <div className="space-y-4">
<div className="flex items-start space-x-3"> <div className="flex items-start space-x-3">
<div className="bg-white/20 rounded-lg p-2"> <div className="bg-white/20 rounded-lg p-2">
<MapPin className="h-5 w-5 text-white" /> <MapPin className="h-5 w-5 text-white" />
</div> </div>
<div> <div>
<h3 className="text-white font-semibold">{t('contact.companyInfo.registeredCompany')}</h3> <h3 className="text-white font-semibold">{t('contact.company.registered')}</h3>
<p className="text-blue-100">{t('company.name')}</p> <p className="text-blue-100">{t('contact.company.name')}</p>
<p className="text-blue-100 text-sm">{t('contact.companyInfo.malaysia')}</p> <p className="text-blue-100 text-sm">{t('contact.company.location')}</p>
</div> </div>
</div> </div>
<div className="flex items-start space-x-3"> <div className="flex items-start space-x-3">
@ -212,8 +209,8 @@ export default function Contact() {
<Mail className="h-5 w-5 text-white" /> <Mail className="h-5 w-5 text-white" />
</div> </div>
<div> <div>
<h3 className="text-white font-semibold">{t('contact.companyInfo.businessEmail')}</h3> <h3 className="text-white font-semibold">Business Email</h3>
<p className="text-blue-100">{t('contact.companyInfo.supportEmail')}</p> <p className="text-blue-100">{t('contact.email.value')}</p>
</div> </div>
</div> </div>
<div className="flex items-start space-x-3"> <div className="flex items-start space-x-3">
@ -221,8 +218,8 @@ export default function Contact() {
<Clock className="h-5 w-5 text-white" /> <Clock className="h-5 w-5 text-white" />
</div> </div>
<div> <div>
<h3 className="text-white font-semibold">{t('contact.companyInfo.supportHours')}</h3> <h3 className="text-white font-semibold">Support Hours</h3>
<p className="text-blue-100">{t('contact.companyInfo.supportHoursValue')}</p> <p className="text-blue-100">{t('contact.hours.value')} - {t('contact.hours.desc')}</p>
</div> </div>
</div> </div>
</div> </div>
@ -230,48 +227,48 @@ export default function Contact() {
{/* Quick Support */} {/* Quick Support */}
<div className="bg-white/10 backdrop-blur-md rounded-xl p-8 border border-white/20"> <div className="bg-white/10 backdrop-blur-md rounded-xl p-8 border border-white/20">
<h3 className="text-xl font-bold text-white mb-4">{t('contact.quickSupport.title')}</h3> <h3 className="text-xl font-bold text-white mb-4">{t('contact.quick.title')}</h3>
<p className="text-gray-300 mb-6"> <p className="text-gray-300 mb-6">
{t('contact.quickSupport.description')} {t('contact.quick.text')}
</p> </p>
<div className="space-y-3"> <div className="space-y-3">
<div className="flex items-center space-x-3 text-blue-400"> <div className="flex items-center space-x-3 text-blue-400">
<div className="w-2 h-2 bg-blue-400 rounded-full"></div> <div className="w-2 h-2 bg-blue-400 rounded-full"></div>
<span>{t('contact.quickSupport.topic1')}</span> <span>{t('contact.quick.connection')}</span>
</div> </div>
<div className="flex items-center space-x-3 text-blue-400"> <div className="flex items-center space-x-3 text-blue-400">
<div className="w-2 h-2 bg-blue-400 rounded-full"></div> <div className="w-2 h-2 bg-blue-400 rounded-full"></div>
<span>{t('contact.quickSupport.topic2')}</span> <span>{t('contact.quick.billing')}</span>
</div> </div>
<div className="flex items-center space-x-3 text-blue-400"> <div className="flex items-center space-x-3 text-blue-400">
<div className="w-2 h-2 bg-blue-400 rounded-full"></div> <div className="w-2 h-2 bg-blue-400 rounded-full"></div>
<span>{t('contact.quickSupport.topic3')}</span> <span>{t('contact.quick.installation')}</span>
</div> </div>
<div className="flex items-center space-x-3 text-blue-400"> <div className="flex items-center space-x-3 text-blue-400">
<div className="w-2 h-2 bg-blue-400 rounded-full"></div> <div className="w-2 h-2 bg-blue-400 rounded-full"></div>
<span>{t('contact.quickSupport.topic4')}</span> <span>{t('contact.quick.servers')}</span>
</div> </div>
</div> </div>
</div> </div>
{/* Response Time */} {/* Response Time */}
<div className="bg-white/10 backdrop-blur-md rounded-xl p-8 border border-white/20"> <div className="bg-white/10 backdrop-blur-md rounded-xl p-8 border border-white/20">
<h3 className="text-xl font-bold text-white mb-4">{t('contact.responseTime.title')}</h3> <h3 className="text-xl font-bold text-white mb-4">{t('contact.response.title')}</h3>
<p className="text-gray-300 mb-4"> <p className="text-gray-300 mb-4">
{t('contact.responseTime.description')} {t('contact.response.text')}
</p> </p>
<div className="space-y-2"> <div className="space-y-2">
<div className="flex justify-between items-center"> <div className="flex justify-between items-center">
<span className="text-gray-300">{t('contact.responseTime.general')}</span> <span className="text-gray-300">{t('contact.response.general')}</span>
<span className="text-blue-400 font-semibold">{t('contact.responseTime.generalValue')}</span> <span className="text-blue-400 font-semibold">{t('contact.response.general.time')}</span>
</div> </div>
<div className="flex justify-between items-center"> <div className="flex justify-between items-center">
<span className="text-gray-300">{t('contact.responseTime.technical')}</span> <span className="text-gray-300">{t('contact.response.technical')}</span>
<span className="text-blue-400 font-semibold">{t('contact.responseTime.technicalValue')}</span> <span className="text-blue-400 font-semibold">{t('contact.response.technical.time')}</span>
</div> </div>
<div className="flex justify-between items-center"> <div className="flex justify-between items-center">
<span className="text-gray-300">{t('contact.responseTime.billing')}</span> <span className="text-gray-300">{t('contact.response.billing')}</span>
<span className="text-blue-400 font-semibold">{t('contact.responseTime.billingValue')}</span> <span className="text-blue-400 font-semibold">{t('contact.response.billing.time')}</span>
</div> </div>
</div> </div>
</div> </div>

347
src/pages/Home.tsx
View File

@ -5,217 +5,176 @@ import { useLanguage } from '@/contexts/LanguageContext';
export default function Home() { export default function Home() {
const { t } = useLanguage(); const { t } = useLanguage();
const features = [ const features = [
{ { icon: Globe, title: t('home.features.global'), description: t('home.features.global.desc') },
icon: Globe, { icon: Zap, title: t('home.features.speed'), description: t('home.features.speed.desc') },
title: t('home.features.global'), { icon: Lock, title: t('home.features.encryption'), description: t('home.features.encryption.desc') },
description: t('home.features.global.desc') { icon: Shield, title: t('home.features.logs'), description: t('home.features.logs.desc') }
},
{
icon: Zap,
title: t('home.features.speed'),
description: t('home.features.speed.desc')
},
{
icon: Lock,
title: t('home.features.encryption'),
description: t('home.features.encryption.desc')
},
{
icon: Shield,
title: t('home.features.logs'),
description: t('home.features.logs.desc')
}
]; ];
const platforms = [ const platforms = [
{ name: t('common.ios'), icon: Smartphone, status: t('home.status.comingSoon') }, { name: t('common.ios'), icon: Smartphone, status: t('home.status.comingSoon') },
{ name: t('common.android'), icon: Smartphone, status: t('home.status.available') }, { name: t('common.android'), icon: Smartphone, status: t('home.status.available'), downloadUrl: 'https://down.airoport.xin/hiFastVpn-Android-universal-01.apk' },
{ name: t('common.windows'), icon: Laptop, status: t('home.status.available') }, { name: t('common.windows'), icon: Laptop, status: t('home.status.available'), downloadUrl: 'https://down.airoport.xin/hiFastVpn-01-windows-setup.exe' },
{ name: t('common.macos'), icon: Laptop, status: t('home.status.comingSoon') } { name: t('common.macos'), icon: Laptop, status: t('home.status.comingSoon') }
]; ];
// Hero按钮点击跳转到平台
const scrollToPlatforms = () => {
const section = document.getElementById('platforms-section');
if (section) section.scrollIntoView({ behavior: 'smooth' });
};
return ( return (
<div className="min-h-screen"> <div className="min-h-screen">
{/* Hero Section */} {/* Hero Section */}
<section className="relative py-20 px-4 sm:px-6 lg:px-8"> <section className="relative py-20 px-4 sm:px-6 lg:px-8">
<div className="max-w-7xl mx-auto text-center"> <div className="max-w-7xl mx-auto text-center">
<motion.div <motion.div initial={{ opacity: 0, y: 20 }} animate={{ opacity: 1, y: 0 }} transition={{ duration: 0.8 }}>
initial={{ opacity: 0, y: 20 }} <h1 className="text-4xl md:text-6xl font-bold text-white mb-6">
animate={{ opacity: 1, y: 0 }} {t('home.hero.title')}
transition={{ duration: 0.8 }} <span className="text-blue-400"> {t('home.hero.subtitle')}</span>
> </h1>
<h1 className="text-4xl md:text-6xl font-bold text-white mb-6"> <p className="text-xl text-gray-300 mb-8 max-w-3xl mx-auto">{t('home.hero.description')}</p>
{t('home.hero.title')} <div className="flex flex-col sm:flex-row gap-4 justify-center">
<span className="text-blue-400"> {t('home.hero.subtitle')}</span> <motion.button
</h1> whileHover={{ scale: 1.05 }}
<p className="text-xl text-gray-300 mb-8 max-w-3xl mx-auto"> whileTap={{ scale: 0.95 }}
{t('home.hero.description')} className="bg-blue-600 hover:bg-blue-700 text-white px-8 py-4 rounded-lg font-semibold text-lg flex items-center space-x-2 transition-colors"
</p> onClick={scrollToPlatforms}
<div className="flex flex-col sm:flex-row gap-4 justify-center"> >
<motion.button <Download className="h-5 w-5" />
whileHover={{ scale: 1.05 }} <span>{t('home.hero.cta')}</span>
whileTap={{ scale: 0.95 }} </motion.button>
className="bg-blue-600 hover:bg-blue-700 text-white px-8 py-4 rounded-lg font-semibold text-lg flex items-center space-x-2 transition-colors" <Link
> to="/about"
<Download className="h-5 w-5" /> className="border border-white/30 text-white hover:bg-white/10 px-8 py-4 rounded-lg font-semibold text-lg flex items-center space-x-2 transition-colors"
<span>{t('home.hero.cta')}</span> >
</motion.button> <span>{t('home.hero.learnMore')}</span>
<Link <ArrowRight className="h-5 w-5" />
to="/about" </Link>
className="border border-white/30 text-white hover:bg-white/10 px-8 py-4 rounded-lg font-semibold text-lg flex items-center space-x-2 transition-colors" </div>
> </motion.div>
<span>{t('home.hero.learnMore')}</span> </div>
<ArrowRight className="h-5 w-5" /> </section>
</Link>
{/* Features Section */}
<section className="py-20 px-4 sm:px-6 lg:px-8 bg-white/5">
<div className="max-w-7xl mx-auto">
<motion.div initial={{ opacity: 0 }} whileInView={{ opacity: 1 }} transition={{ duration: 0.8 }} viewport={{ once: true }} className="text-center mb-16">
<h2 className="text-3xl md:text-4xl font-bold text-white mb-4">{t('home.features.title')}</h2>
<p className="text-gray-300 text-lg max-w-2xl mx-auto">{t('home.features.subtitle')}</p>
</motion.div>
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
{features.map((feature, index) => (
<motion.div
key={feature.title}
initial={{ opacity: 0, y: 20 }}
whileInView={{ opacity: 1, y: 0 }}
transition={{ duration: 0.5, delay: index * 0.1 }}
viewport={{ once: true }}
className="bg-white/10 backdrop-blur-md rounded-xl p-6 border border-white/20 hover:border-blue-400/50 transition-colors"
>
<div className="bg-blue-600/20 rounded-lg p-3 w-fit mb-4">
<feature.icon className="h-8 w-8 text-blue-400" />
</div>
<h3 className="text-xl font-semibold text-white mb-3">{feature.title}</h3>
<p className="text-gray-300">{feature.description}</p>
</motion.div>
))}
</div> </div>
</motion.div>
</div>
</section>
{/* Features Section */}
<section className="py-20 px-4 sm:px-6 lg:px-8 bg-white/5">
<div className="max-w-7xl mx-auto">
<motion.div
initial={{ opacity: 0 }}
whileInView={{ opacity: 1 }}
transition={{ duration: 0.8 }}
viewport={{ once: true }}
className="text-center mb-16"
>
<h2 className="text-3xl md:text-4xl font-bold text-white mb-4">
{t('home.features.title')}
</h2>
<p className="text-gray-300 text-lg max-w-2xl mx-auto">
{t('home.features.subtitle')}
</p>
</motion.div>
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
{features.map((feature, index) => (
<motion.div
key={feature.title}
initial={{ opacity: 0, y: 20 }}
whileInView={{ opacity: 1, y: 0 }}
transition={{ duration: 0.5, delay: index * 0.1 }}
viewport={{ once: true }}
className="bg-white/10 backdrop-blur-md rounded-xl p-6 border border-white/20 hover:border-blue-400/50 transition-colors"
>
<div className="bg-blue-600/20 rounded-lg p-3 w-fit mb-4">
<feature.icon className="h-8 w-8 text-blue-400" />
</div>
<h3 className="text-xl font-semibold text-white mb-3">{feature.title}</h3>
<p className="text-gray-300">{feature.description}</p>
</motion.div>
))}
</div> </div>
</div> </section>
</section>
{/* Platforms Section */} {/* Platforms Section */}
<section className="py-20 px-4 sm:px-6 lg:px-8"> <section id="platforms-section" className="py-20 px-4 sm:px-6 lg:px-8">
<div className="max-w-7xl mx-auto"> <div className="max-w-7xl mx-auto">
<motion.div <motion.div initial={{ opacity: 0, y: 20 }} whileInView={{ opacity: 1, y: 0 }} transition={{ duration: 0.8 }} viewport={{ once: true }} className="text-center mb-16">
initial={{ opacity: 0 }} <h2 className="text-3xl md:text-4xl font-bold text-white mb-4">{t('home.platforms.title')}</h2>
whileInView={{ opacity: 1 }} <p className="text-gray-300 text-lg max-w-2xl mx-auto">{t('home.platforms.subtitle')}</p>
transition={{ duration: 0.8 }} </motion.div>
viewport={{ once: true }} <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
className="text-center mb-16" {platforms.map((platform, index) => {
> const isAvailable = platform.status === t('home.status.available');
<h2 className="text-3xl md:text-4xl font-bold text-white mb-4"> return (
{t('home.platforms.title')} <motion.div
</h2> key={platform.name}
<p className="text-gray-300 text-lg max-w-2xl mx-auto"> initial={{ opacity: 0, y: 20 }}
{t('home.platforms.subtitle')} whileInView={{ opacity: 1, y: 0 }}
</p> whileHover={isAvailable ? { scale: 1.05 } : {}}
</motion.div> whileTap={isAvailable ? { scale: 0.95 } : {}}
transition={{ duration: 0.5, delay: index * 0.1 }}
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6"> viewport={{ once: true }}
{platforms.map((platform, index) => ( className={`bg-white/10 backdrop-blur-md rounded-xl p-6 border border-white/20 text-center transition-colors cursor-${isAvailable ? 'pointer' : 'not-allowed'} ${
<motion.div isAvailable ? 'hover:border-blue-400/50' : ''
key={platform.name} }`}
initial={{ opacity: 0, y: 20 }} onClick={() => {
whileInView={{ opacity: 1, y: 0 }} if (!isAvailable || !platform.downloadUrl) return;
transition={{ duration: 0.5, delay: index * 0.1 }} window.open(platform.downloadUrl, '_blank');
viewport={{ once: true }} }}
className="bg-white/10 backdrop-blur-md rounded-xl p-6 border border-white/20 text-center hover:border-blue-400/50 transition-colors" >
> <div className="bg-blue-600/20 rounded-lg p-3 w-fit mx-auto mb-4">
<div className="bg-blue-600/20 rounded-lg p-3 w-fit mx-auto mb-4"> <platform.icon className="h-8 w-8 text-blue-400" />
<platform.icon className="h-8 w-8 text-blue-400" /> </div>
</div> <h3 className="text-xl font-semibold text-white mb-2">{platform.name}</h3>
<h3 className="text-xl font-semibold text-white mb-2">{platform.name}</h3> <p className={`text-sm ${isAvailable ? 'text-green-400' : 'text-yellow-400'}`}>{platform.status}</p>
<p className={`text-sm ${platform.status === 'Available' ? 'text-green-400' : 'text-yellow-400'}`}> </motion.div>
{platform.status} );
</p> })}
</motion.div> </div>
))}
</div> </div>
</div> </section>
</section>
{/* CTA Section */} {/* CTA Section */}
<section className="py-20 px-4 sm:px-6 lg:px-8 bg-gradient-to-r from-blue-600 to-indigo-600"> <section className="py-20 px-4 sm:px-6 lg:px-8 bg-gradient-to-r from-blue-600 to-indigo-600">
<div className="max-w-4xl mx-auto text-center"> <div className="max-w-4xl mx-auto text-center">
<motion.div <motion.div initial={{ opacity: 0, y: 20 }} whileInView={{ opacity: 1, y: 0 }} transition={{ duration: 0.8 }} viewport={{ once: true }}>
initial={{ opacity: 0, y: 20 }} <h2 className="text-3xl md:text-4xl font-bold text-white mb-6">{t('home.cta.title')}</h2>
whileInView={{ opacity: 1, y: 0 }} <p className="text-xl text-blue-100 mb-8">{t('home.cta.subtitle')}</p>
transition={{ duration: 0.8 }} <div className="flex flex-col sm:flex-row gap-4 justify-center items-center">
viewport={{ once: true }} <motion.button whileHover={{ scale: 1.05 }} whileTap={{ scale: 0.95 }} className="bg-white text-blue-600 hover:bg-gray-100 px-8 py-4 rounded-lg font-semibold text-lg flex items-center space-x-2 transition-colors">
> <Shield className="h-5 w-5" />
<h2 className="text-3xl md:text-4xl font-bold text-white mb-6"> <span>{t('home.cta.button')}</span>
{t('home.cta.title')} </motion.button>
</h2> <div className="flex items-center space-x-4 text-blue-100">
<p className="text-xl text-blue-100 mb-8"> <div className="flex items-center space-x-2">
{t('home.cta.subtitle')} <CheckCircle className="h-5 w-5" />
</p> <span>{t('home.guarantee.moneyback')}</span>
<div className="flex flex-col sm:flex-row gap-4 justify-center items-center"> </div>
<motion.button <div className="flex items-center space-x-2">
whileHover={{ scale: 1.05 }} <CheckCircle className="h-5 w-5" />
whileTap={{ scale: 0.95 }} <span>{t('home.guarantee.free')}</span>
className="bg-white text-blue-600 hover:bg-gray-100 px-8 py-4 rounded-lg font-semibold text-lg flex items-center space-x-2 transition-colors" </div>
>
<Shield className="h-5 w-5" />
<span>{t('home.cta.button')}</span>
</motion.button>
<div className="flex items-center space-x-4 text-blue-100">
<div className="flex items-center space-x-2">
<CheckCircle className="h-5 w-5" />
<span>{t('home.guarantee.moneyback')}</span>
</div>
<div className="flex items-center space-x-2">
<CheckCircle className="h-5 w-5" />
<span>{t('home.guarantee.free')}</span>
</div> </div>
</div> </div>
</div> </motion.div>
</motion.div> </div>
</div> </section>
</section>
{/* Trust Indicators */} {/* Trust Indicators */}
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-white/5"> <section className="py-16 px-4 sm:px-6 lg:px-8 bg-white/5">
<div className="max-w-7xl mx-auto"> <div className="max-w-7xl mx-auto">
<div className="grid grid-cols-2 md:grid-cols-4 gap-8 text-center"> <div className="grid grid-cols-2 md:grid-cols-4 gap-8 text-center">
<div> <div>
<div className="text-3xl font-bold text-blue-400 mb-2">10M+</div> <div className="text-3xl font-bold text-blue-400 mb-2">10M+</div>
<div className="text-gray-300">{t('home.stats.users')}</div> <div className="text-gray-300">{t('home.stats.users')}</div>
</div> </div>
<div> <div>
<div className="text-3xl font-bold text-blue-400 mb-2">105+</div> <div className="text-3xl font-bold text-blue-400 mb-2">105+</div>
<div className="text-gray-300">{t('home.stats.countries')}</div> <div className="text-gray-300">{t('home.stats.countries')}</div>
</div> </div>
<div> <div>
<div className="text-3xl font-bold text-blue-400 mb-2">99.9%</div> <div className="text-3xl font-bold text-blue-400 mb-2">99.9%</div>
<div className="text-gray-300">{t('home.stats.uptime')}</div> <div className="text-gray-300">{t('home.stats.uptime')}</div>
</div> </div>
<div> <div>
<div className="text-3xl font-bold text-blue-400 mb-2">24/7</div> <div className="text-3xl font-bold text-blue-400 mb-2">24/7</div>
<div className="text-gray-300">{t('home.stats.support')}</div> <div className="text-gray-300">{t('home.stats.support')}</div>
</div>
</div> </div>
</div> </div>
</div> </section>
</section> </div>
</div>
); );
} }

52
src/pages/Privacy.tsx
View File

@ -7,47 +7,47 @@ export default function Privacy() {
const sections = [ const sections = [
{ {
title: "Information We Collect", title: t('privacy.informationCollection.title'),
content: [ content: [
"Personal Information: When you create an account, we collect your email address, username, and payment information.", t('privacy.informationCollection.personalInfo'),
"Usage Data: We collect information about how you use our VPN services, including connection timestamps and server locations.", t('privacy.informationCollection.usageData'),
"Device Information: We may collect device identifiers, operating system, and app version information.", t('privacy.informationCollection.deviceInfo'),
"Payment Information: Payment details are processed through secure third-party payment processors and are not stored on our servers." t('privacy.informationCollection.paymentInfo')
] ]
}, },
{ {
title: "How We Use Your Information", title: t('privacy.howWeUse.title'),
content: [ content: [
"Service Provision: To provide and maintain our VPN services, including customer support.", t('privacy.howWeUse.serviceProvision'),
"Account Management: To manage your account, process payments, and send service-related communications.", t('privacy.howWeUse.accountManagement'),
"Service Improvement: To analyze usage patterns and improve our services and user experience.", t('privacy.howWeUse.serviceImprovement'),
"Legal Compliance: To comply with legal obligations and protect our legal rights." t('privacy.howWeUse.legalCompliance')
] ]
}, },
{ {
title: "Data Security", title: t('privacy.dataSecurity.title'),
content: [ content: [
"Encryption: All data transmitted through our VPN services is encrypted using military-grade AES-256 encryption.", t('privacy.dataSecurity.encryption'),
"No-Log Policy: We do not log your browsing activity, traffic destinations, or DNS queries while connected to our VPN.", t('privacy.dataSecurity.noLogPolicy'),
"Secure Infrastructure: Our servers are maintained with the highest security standards and regular security audits.", t('privacy.dataSecurity.secureInfrastructure'),
"Data Retention: We retain minimal connection logs for service optimization and are automatically deleted after 30 days." t('privacy.dataSecurity.dataRetention')
] ]
}, },
{ {
title: "Third-Party Services", title: t('privacy.thirdPartyServices.title'),
content: [ content: [
"Payment Processors: We use trusted third-party payment processors to handle payment transactions securely.", t('privacy.thirdPartyServices.paymentProcessors'),
"Analytics: We may use analytics services to understand app usage patterns, excluding personal browsing data.", t('privacy.thirdPartyServices.analytics'),
"Service Providers: We may engage trusted third-party service providers to assist in providing our services." t('privacy.thirdPartyServices.serviceProviders')
] ]
}, },
{ {
title: "Your Rights", title: t('privacy.yourRights.title'),
content: [ content: [
"Access: You have the right to access the personal information we hold about you.", t('privacy.yourRights.access'),
"Correction: You can update or correct your personal information through your account settings.", t('privacy.yourRights.correction'),
"Deletion: You can request deletion of your account and associated personal information.", t('privacy.yourRights.deletion'),
"Data Portability: You can request a copy of your personal data in a machine-readable format." t('privacy.yourRights.dataPortability')
] ]
} }
]; ];
@ -145,7 +145,7 @@ export default function Privacy() {
</div> </div>
<div> <div>
<h3 className="text-white font-semibold">{t('privacy.company')}</h3> <h3 className="text-white font-semibold">{t('privacy.company')}</h3>
<p className="text-gray-300">TAW TRADERS SDN. BHD.</p> <p className="text-gray-300">{t('company.name')}</p>
</div> </div>
</div> </div>
<div className="flex items-center space-x-3"> <div className="flex items-center space-x-3">
@ -154,7 +154,7 @@ export default function Privacy() {
</div> </div>
<div> <div>
<h3 className="text-white font-semibold">{t('privacy.email')}</h3> <h3 className="text-white font-semibold">{t('privacy.email')}</h3>
<p className="text-gray-300">privacy@hifastvpn.com</p> <p className="text-gray-300">{t('privacy.emailValue')}</p>
</div> </div>
</div> </div>
<div className="flex items-center space-x-3"> <div className="flex items-center space-x-3">

22
src/pages/Terms.tsx
View File

@ -96,10 +96,10 @@ export default function Terms() {
{t('terms.title')} {t('terms.title')}
</h1> </h1>
<p className="text-xl text-gray-300 mb-4"> <p className="text-xl text-gray-300 mb-4">
{t('terms.lastUpdated')}: {t('terms.lastUpdatedDate')} {t('terms.updated')}
</p> </p>
<p className="text-gray-300 max-w-2xl mx-auto"> <p className="text-gray-300 max-w-2xl mx-auto">
{t('terms.subtitle')} {t('terms.description')}
</p> </p>
</motion.div> </motion.div>
@ -114,9 +114,9 @@ export default function Terms() {
<div className="flex items-start space-x-3"> <div className="flex items-start space-x-3">
<AlertTriangle className="h-6 w-6 text-yellow-400 flex-shrink-0 mt-1" /> <AlertTriangle className="h-6 w-6 text-yellow-400 flex-shrink-0 mt-1" />
<div> <div>
<h3 className="text-lg font-semibold text-yellow-400 mb-2">{t('terms.importantNotice.title')}</h3> <h3 className="text-lg font-semibold text-yellow-400 mb-2">{t('terms.notice.title')}</h3>
<p className="text-yellow-100"> <p className="text-yellow-100">
{t('terms.importantNotice.content')} {t('terms.notice.text')}
</p> </p>
</div> </div>
</div> </div>
@ -156,24 +156,24 @@ export default function Terms() {
viewport={{ once: true }} viewport={{ once: true }}
className="bg-white/10 backdrop-blur-md rounded-xl p-8 mt-12 border border-white/20" className="bg-white/10 backdrop-blur-md rounded-xl p-8 mt-12 border border-white/20"
> >
<h2 className="text-2xl font-bold text-white mb-6">{t('terms.finalProvisions.title')}</h2> <h2 className="text-2xl font-bold text-white mb-6">{t('terms.final.title')}</h2>
<div className="space-y-4"> <div className="space-y-4">
<div className="flex items-start space-x-3"> <div className="flex items-start space-x-3">
<CheckCircle className="h-5 w-5 text-blue-400 mt-1 flex-shrink-0" /> <CheckCircle className="h-5 w-5 text-blue-400 mt-1 flex-shrink-0" />
<p className="text-gray-300"> <p className="text-gray-300">
<strong>{t('terms.finalProvisions.governingLaw')}:</strong> {t('terms.finalProvisions.governingLawContent')} <strong>{t('terms.governing')}</strong> {t('terms.governing.text')}
</p> </p>
</div> </div>
<div className="flex items-start space-x-3"> <div className="flex items-start space-x-3">
<CheckCircle className="h-5 w-5 text-blue-400 mt-1 flex-shrink-0" /> <CheckCircle className="h-5 w-5 text-blue-400 mt-1 flex-shrink-0" />
<p className="text-gray-300"> <p className="text-gray-300">
<strong>{t('terms.finalProvisions.changesToTerms')}:</strong> {t('terms.finalProvisions.changesToTermsContent')} <strong>{t('terms.changes')}</strong> {t('terms.changes.text')}
</p> </p>
</div> </div>
<div className="flex items-start space-x-3"> <div className="flex items-start space-x-3">
<CheckCircle className="h-5 w-5 text-blue-400 mt-1 flex-shrink-0" /> <CheckCircle className="h-5 w-5 text-blue-400 mt-1 flex-shrink-0" />
<p className="text-gray-300"> <p className="text-gray-300">
<strong>{t('terms.finalProvisions.contact')}:</strong> {t('terms.finalProvisions.contactContent')} <strong>{t('terms.contact')}</strong> {t('terms.contact.text')}
</p> </p>
</div> </div>
</div> </div>
@ -206,7 +206,7 @@ export default function Terms() {
</div> </div>
<div className="border-t border-blue-500/30 mt-6 pt-6"> <div className="border-t border-blue-500/30 mt-6 pt-6">
<p className="text-blue-100 text-center"> <p className="text-blue-100 text-center">
<strong>{t('terms.serviceProvider.operatedBy')}</strong> - {t('terms.serviceProvider.trustedProvider')} <strong>{t('terms.serviceProvider.operatedBy')} {t('company.name')}</strong> - {t('terms.serviceProvider.trustedProvider')}
</p> </p>
</div> </div>
</motion.div> </motion.div>
@ -220,10 +220,10 @@ export default function Terms() {
className="text-center mt-12 p-6 bg-gradient-to-r from-blue-600/20 to-indigo-600/20 rounded-xl border border-blue-400/30" className="text-center mt-12 p-6 bg-gradient-to-r from-blue-600/20 to-indigo-600/20 rounded-xl border border-blue-400/30"
> >
<p className="text-gray-300 mb-4"> <p className="text-gray-300 mb-4">
{t('terms.acceptance.acknowledgment')} {t('terms.acknowledgement')}
</p> </p>
<p className="text-blue-400 font-semibold"> <p className="text-blue-400 font-semibold">
{t('terms.acceptance.copyright')} {t('terms.copyright')}
</p> </p>
</motion.div> </motion.div>
</div> </div>

4
vite.config.ts
View File

@ -2,6 +2,7 @@ import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react' import react from '@vitejs/plugin-react'
import tsconfigPaths from "vite-tsconfig-paths"; import tsconfigPaths from "vite-tsconfig-paths";
import { traeBadgePlugin } from 'vite-plugin-trae-solo-badge'; import { traeBadgePlugin } from 'vite-plugin-trae-solo-badge';
import svgr from 'vite-plugin-svgr';
// https://vite.dev/config/ // https://vite.dev/config/
export default defineConfig({ export default defineConfig({
@ -16,6 +17,7 @@ export default defineConfig({
], ],
}, },
}), }),
svgr(),
traeBadgePlugin({ traeBadgePlugin({
variant: 'dark', variant: 'dark',
position: 'bottom-right', position: 'bottom-right',
@ -24,7 +26,7 @@ export default defineConfig({
clickUrl: 'https://www.trae.ai/solo?showJoin=1', clickUrl: 'https://www.trae.ai/solo?showJoin=1',
autoTheme: true, autoTheme: true,
autoThemeTarget: '#root' autoThemeTarget: '#root'
}), }),
tsconfigPaths() tsconfigPaths()
], ],
}) })