feat(web): 重做 #138/#133 的前端改动(LOGO 替换 + Loading Logo + 校验优化保留),尽量不覆盖他人代码

This commit is contained in:
Ember
2025-11-02 00:58:25 +08:00
parent 8e28854751
commit 37db073de4
5 changed files with 76 additions and 27 deletions

View File

@@ -170,10 +170,7 @@ function App() {
return (
<div className="min-h-screen flex items-center justify-center" style={{ background: '#0B0E11' }}>
<div className="text-center">
<div className="w-16 h-16 rounded-full mx-auto mb-4 flex items-center justify-center text-3xl animate-spin"
style={{ background: 'linear-gradient(135deg, #F0B90B 0%, #FCD535 100%)' }}>
</div>
<img src="/images/logo.png" alt="NoFx Logo" className="w-16 h-16 mx-auto mb-4 animate-pulse" />
<p style={{ color: '#EAECEF' }}>{t('loading', language)}</p>
</div>
</div>

View File

@@ -15,7 +15,7 @@ export function Header({ simple = false }: HeaderProps) {
{/* Left - Logo and Title */}
<div className="flex items-center gap-3">
<div className="flex items-center justify-center">
<img src="/icons/nofx.svg?v=2" alt="NOFX" className="h-10 w-auto" />
<img src="/images/logo.png" alt="NoFx Logo" className="w-8 h-8" />
</div>
<div>
<h1 className="text-xl font-bold" style={{ color: '#EAECEF' }}>
@@ -56,4 +56,4 @@ export function Header({ simple = false }: HeaderProps) {
</div>
</header>
);
}
}

View File

@@ -72,7 +72,7 @@ export function LoginPage() {
{/* Logo */}
<div className="text-center mb-8">
<div className="w-16 h-16 mx-auto mb-4 flex items-center justify-center">
<img src="/icons/nofx.svg?v=2" alt="NOFX" className="w-16 h-16" />
<img src="/images/logo.png" alt="NoFx Logo" className="w-16 h-16 object-contain" />
</div>
<h1 className="text-2xl font-bold" style={{ color: '#EAECEF' }}>
{t('loginTitle', language)}

View File

@@ -92,7 +92,7 @@ export function RegisterPage() {
{/* Logo */}
<div className="text-center mb-8">
<div className="w-16 h-16 mx-auto mb-4 flex items-center justify-center">
<img src="/icons/nofx.svg?v=2" alt="NOFX" className="w-16 h-16" />
<img src="/images/logo.png" alt="NoFx Logo" className="w-16 h-16 object-contain" />
</div>
<h1 className="text-2xl font-bold" style={{ color: '#EAECEF' }}>
{t('appTitle', language)}

View File

@@ -8,36 +8,79 @@ export default function AboutSection() {
<AnimatedSection id='about' backgroundColor='var(--brand-dark-gray)'>
<div className='max-w-7xl mx-auto'>
<div className='grid lg:grid-cols-2 gap-12 items-center'>
<motion.div className='space-y-6' initial={{ opacity: 0, x: -50 }} whileInView={{ opacity: 1, x: 0 }} viewport={{ once: true }} transition={{ duration: 0.6 }}>
<motion.div
className='space-y-6'
initial={{ opacity: 0, x: -50 }}
whileInView={{ opacity: 1, x: 0 }}
viewport={{ once: true }}
transition={{ duration: 0.6 }}
>
<motion.div
className='inline-flex items-center gap-2 px-4 py-2 rounded-full'
style={{ background: 'rgba(240, 185, 11, 0.1)', border: '1px solid rgba(240, 185, 11, 0.2)' }}
style={{
background: 'rgba(240, 185, 11, 0.1)',
border: '1px solid rgba(240, 185, 11, 0.2)',
}}
whileHover={{ scale: 1.05 }}
>
<Target className='w-4 h-4' style={{ color: 'var(--brand-yellow)' }} />
<span className='text-sm font-semibold' style={{ color: 'var(--brand-yellow)' }}>
<Target
className='w-4 h-4'
style={{ color: 'var(--brand-yellow)' }}
/>
<span
className='text-sm font-semibold'
style={{ color: 'var(--brand-yellow)' }}
>
NOFX
</span>
</motion.div>
<h2 className='text-4xl font-bold' style={{ color: 'var(--brand-light-gray)' }}>
<h2
className='text-4xl font-bold'
style={{ color: 'var(--brand-light-gray)' }}
>
NOFX
</h2>
<p className='text-lg leading-relaxed' style={{ color: 'var(--text-secondary)' }}>
NOFX AI 'Linux' OS '决策-风险-执行'
<p
className='text-lg leading-relaxed'
style={{ color: 'var(--text-secondary)' }}
>
NOFX AI 'Linux'
OS '决策-风险-执行'
</p>
<p className='text-lg leading-relaxed' style={{ color: 'var(--text-secondary)' }}>
24/7AI CodeFi PR
<p
className='text-lg leading-relaxed'
style={{ color: 'var(--text-secondary)' }}
>
24/7AI
CodeFi PR
</p>
<motion.div className='flex items-center gap-3 pt-4' whileHover={{ x: 5 }}>
<div className='w-12 h-12 rounded-full flex items-center justify-center' style={{ background: 'rgba(240, 185, 11, 0.1)' }}>
<Shield className='w-6 h-6' style={{ color: 'var(--brand-yellow)' }} />
<motion.div
className='flex items-center gap-3 pt-4'
whileHover={{ x: 5 }}
>
<div
className='w-12 h-12 rounded-full flex items-center justify-center'
style={{ background: 'rgba(240, 185, 11, 0.1)' }}
>
<Shield
className='w-6 h-6'
style={{ color: 'var(--brand-yellow)' }}
/>
</div>
<div>
<div className='font-semibold' style={{ color: 'var(--brand-light-gray)' }}>
<div
className='font-semibold'
style={{ color: 'var(--brand-light-gray)' }}
>
100%
</div>
<div className='text-sm' style={{ color: 'var(--text-secondary)' }}>
<div
className='text-sm'
style={{ color: 'var(--text-secondary)' }}
>
AI
</div>
</div>
@@ -45,21 +88,30 @@ export default function AboutSection() {
</motion.div>
<div className='relative'>
<div className='rounded-2xl p-8' style={{ background: 'var(--brand-black)', border: '1px solid var(--panel-border)' }}>
<div
className='rounded-2xl p-8'
style={{
background: 'var(--brand-black)',
border: '1px solid var(--panel-border)',
}}
>
<Typewriter
lines={[
'$ git clone https://github.com/tinkle-community/nofx.git',
'$ cd nofx',
'$ chmod +x start.sh',
'$ ./start.sh start --build',
'🚀 启动自动交易系统...',
' API服务器启动在端口 8080',
'🌐 Web 控制台 http://localhost:3000',
' 启动自动交易系统...',
' API服务器启动在端口 8080',
' Web 控制台 http://localhost:3000',
]}
typingSpeed={70}
lineDelay={900}
className='text-sm font-mono'
style={{ color: '#00FF41', textShadow: '0 0 6px rgba(0,255,65,0.6)' }}
style={{
color: '#00FF41',
textShadow: '0 0 6px rgba(0,255,65,0.6)',
}}
/>
</div>
</div>