fix: restore header bar and fix layout in RegisterPage

- Add HeaderBar component to registration page
- Change background to use CSS variables (var(--brand-black))
- Remove "back to home" button
- Update layout structure to match LoginPage pattern
- Fix container padding and spacing

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>

web/src/components/RegisterPage.tsx

@@ -3,7 +3,7 @@ import { useAuth } from '../contexts/AuthContext';
 import { useLanguage } from '../contexts/LanguageContext';
 import { t } from '../i18n/translations';
 import { getSystemConfig } from '../lib/config';
-import { ArrowLeft } from 'lucide-react';
+import HeaderBar from './landing/HeaderBar';
 
 export function RegisterPage() {
   const { language } = useLanguage();
@@ -88,25 +88,26 @@ export function RegisterPage() {
   };
 
   return (
-    <div className="min-h-screen flex items-center justify-center" style={{ background: '#0B0E11' }}>
+    <div className="min-h-screen" style={{ background: 'var(--brand-black)' }}>
-      <div className="w-full max-w-md">
+      <HeaderBar 
-        {/* Back to Home */}
+        isLoggedIn={false} 
-        {step === 'register' && (
+        isHomePage={false}
-          <button
+        currentPage="register"
-            onClick={() => {
+        language={language}
-              window.history.pushState({}, '', '/');
+        onLanguageChange={() => {}}
-              window.dispatchEvent(new PopStateEvent('popstate'));
+        onPageChange={(page) => {
-            }}
+          console.log('RegisterPage onPageChange called with:', page);
-            className="flex items-center gap-2 mb-6 text-sm hover:text-[#F0B90B] transition-colors"
+          if (page === 'competition') {
-            style={{ color: '#848E9C' }}
+            window.location.href = '/competition';
-          >
+          }
-            <ArrowLeft className="w-4 h-4" />
+        }}
-            返回首页
+      />
-          </button>
-        )}
 
-        {/* Logo */}
+      <div className="flex items-center justify-center pt-20" style={{ minHeight: 'calc(100vh - 80px)' }}>
-        <div className="text-center mb-8">
+        <div className="w-full max-w-md">
+
+          {/* 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" alt="NoFx Logo" className="w-16 h-16 object-contain" />
           </div>
@@ -357,6 +358,7 @@ export function RegisterPage() {
             </p>
           </div>
         )}
+        </div>
       </div>
     </div>
   );