Your Name
feat: UI improvements and error suppression - Enhanced dashboard and market pages with improved header buttons, logo, and currency symbol display - Stopped animated ticker - Removed pie chart legends - Added error suppressor for external service errors (SSE, Permissions-Policy warnings) - Improved header button prominence and icon appearance - Enhanced logo with glow effects and better design - Fixed currency symbol visibility in market tables
8b7b267
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Choose Your Dashboard</title> | |
| <style> | |
| * { | |
| margin: 0; | |
| padding: 0; | |
| box-sizing: border-box; | |
| } | |
| body { | |
| font-family: 'Inter', -apple-system, sans-serif; | |
| background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); | |
| min-height: 100vh; | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| padding: 20px; | |
| } | |
| .container { | |
| max-width: 1200px; | |
| width: 100%; | |
| } | |
| h1 { | |
| text-align: center; | |
| color: white; | |
| font-size: 3rem; | |
| margin-bottom: 1rem; | |
| text-shadow: 0 2px 10px rgba(0,0,0,0.2); | |
| } | |
| .subtitle { | |
| text-align: center; | |
| color: rgba(255,255,255,0.9); | |
| font-size: 1.2rem; | |
| margin-bottom: 3rem; | |
| } | |
| .cards { | |
| display: grid; | |
| grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); | |
| gap: 2rem; | |
| margin-bottom: 2rem; | |
| } | |
| .card { | |
| background: white; | |
| border-radius: 20px; | |
| padding: 2rem; | |
| box-shadow: 0 20px 60px rgba(0,0,0,0.3); | |
| transition: transform 0.3s ease, box-shadow 0.3s ease; | |
| cursor: pointer; | |
| text-decoration: none; | |
| color: inherit; | |
| display: block; | |
| } | |
| .card:hover { | |
| transform: translateY(-10px); | |
| box-shadow: 0 30px 80px rgba(0,0,0,0.4); | |
| } | |
| .card-header { | |
| display: flex; | |
| align-items: center; | |
| justify-content: space-between; | |
| margin-bottom: 1.5rem; | |
| } | |
| .card-icon { | |
| width: 60px; | |
| height: 60px; | |
| background: linear-gradient(135deg, #667eea, #764ba2); | |
| border-radius: 15px; | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| font-size: 2rem; | |
| } | |
| .badge { | |
| padding: 0.5rem 1rem; | |
| border-radius: 20px; | |
| font-size: 0.75rem; | |
| font-weight: bold; | |
| text-transform: uppercase; | |
| letter-spacing: 0.5px; | |
| } | |
| .badge.new { | |
| background: linear-gradient(135deg, #11998e, #38ef7d); | |
| color: white; | |
| } | |
| .badge.legacy { | |
| background: #f3f4f6; | |
| color: #6b7280; | |
| } | |
| .card h2 { | |
| font-size: 1.75rem; | |
| margin-bottom: 1rem; | |
| color: #1f2937; | |
| } | |
| .card p { | |
| color: #6b7280; | |
| line-height: 1.6; | |
| margin-bottom: 1.5rem; | |
| } | |
| .features { | |
| list-style: none; | |
| margin-bottom: 1.5rem; | |
| } | |
| .features li { | |
| padding: 0.5rem 0; | |
| color: #374151; | |
| display: flex; | |
| align-items: center; | |
| gap: 0.5rem; | |
| } | |
| .features li::before { | |
| content: '✓'; | |
| color: #10b981; | |
| font-weight: bold; | |
| font-size: 1.2rem; | |
| } | |
| .features li.unavailable::before { | |
| content: '✗'; | |
| color: #ef4444; | |
| } | |
| .btn { | |
| width: 100%; | |
| padding: 1rem; | |
| border-radius: 10px; | |
| border: none; | |
| font-size: 1rem; | |
| font-weight: 600; | |
| cursor: pointer; | |
| transition: all 0.3s ease; | |
| text-align: center; | |
| text-decoration: none; | |
| display: block; | |
| } | |
| .btn-primary { | |
| background: linear-gradient(135deg, #667eea, #764ba2); | |
| color: white; | |
| box-shadow: 0 4px 15px rgba(102, 126, 234, 0.4); | |
| } | |
| .btn-primary:hover { | |
| transform: scale(1.02); | |
| box-shadow: 0 6px 20px rgba(102, 126, 234, 0.5); | |
| } | |
| .btn-secondary { | |
| background: #f3f4f6; | |
| color: #374151; | |
| } | |
| .btn-secondary:hover { | |
| background: #e5e7eb; | |
| } | |
| .docs-link { | |
| text-align: center; | |
| margin-top: 2rem; | |
| } | |
| .docs-link a { | |
| color: white; | |
| text-decoration: none; | |
| font-size: 1.1rem; | |
| padding: 1rem 2rem; | |
| background: rgba(255,255,255,0.2); | |
| border-radius: 10px; | |
| backdrop-filter: blur(10px); | |
| transition: all 0.3s ease; | |
| display: inline-block; | |
| } | |
| .docs-link a:hover { | |
| background: rgba(255,255,255,0.3); | |
| transform: translateY(-2px); | |
| } | |
| @media (max-width: 768px) { | |
| h1 { | |
| font-size: 2rem; | |
| } | |
| .subtitle { | |
| font-size: 1rem; | |
| } | |
| .cards { | |
| grid-template-columns: 1fr; | |
| } | |
| } | |
| </style> | |
| <!-- API Configuration - Smart Fallback System --> | |
| <script src="/static/js/api-config.js"></script> | |
| <script> | |
| // Initialize API client | |
| window.apiReady = new Promise((resolve) => { | |
| if (window.apiClient) { | |
| console.log('✅ API Client ready'); | |
| resolve(window.apiClient); | |
| } else { | |
| console.error('❌ API Client not loaded'); | |
| } | |
| }); | |
| </script> | |
| </head> | |
| <body> | |
| <div class="container"> | |
| <h1>🚀 Choose Your Dashboard</h1> | |
| <p class="subtitle">Select the version that best fits your needs</p> | |
| <div class="cards"> | |
| <!-- New Modern Dashboard --> | |
| <a href="/static/pages/dashboard/index-modern.html" class="card"> | |
| <div class="card-header"> | |
| <div class="card-icon">✨</div> | |
| <span class="badge new">Recommended</span> | |
| </div> | |
| <h2>Modern Dashboard</h2> | |
| <p>Completely redesigned with 40+ integrated data sources and modern UI/UX</p> | |
| <ul class="features"> | |
| <li>40+ API sources with auto-fallback</li> | |
| <li>Modern responsive design</li> | |
| <li>Dark mode support</li> | |
| <li>Collapsible sidebar (280px ↔ 72px)</li> | |
| <li>Real-time price widgets</li> | |
| <li>News aggregation (12+ sources)</li> | |
| <li>Fear & Greed index (10+ sources)</li> | |
| <li>99%+ uptime with fallbacks</li> | |
| <li>Zero import errors</li> | |
| <li>Mobile-optimized</li> | |
| </ul> | |
| <button class="btn btn-primary">Open Modern Dashboard →</button> | |
| </a> | |
| <!-- Old Dashboard --> | |
| <a href="/static/pages/dashboard/index.html" class="card"> | |
| <div class="card-header"> | |
| <div class="card-icon">📊</div> | |
| <span class="badge legacy">Legacy</span> | |
| </div> | |
| <h2>Classic Dashboard</h2> | |
| <p>Original dashboard (now with fixed imports)</p> | |
| <ul class="features"> | |
| <li>Basic API integration</li> | |
| <li>Original design</li> | |
| <li class="unavailable">Limited fallback options</li> | |
| <li class="unavailable">No dark mode</li> | |
| <li class="unavailable">Fixed sidebar</li> | |
| <li class="unavailable">Fewer data sources</li> | |
| <li class="unavailable">Manual error handling</li> | |
| <li>Recently fixed import errors</li> | |
| <li>Familiar interface</li> | |
| </ul> | |
| <button class="btn btn-secondary">Open Classic Dashboard →</button> | |
| </a> | |
| </div> | |
| <div class="docs-link"> | |
| <a href="/MIGRATION_GUIDE.md" target="_blank">📖 View Migration Guide</a> | |
| <a href="/MODERN_UI_UX_GUIDE.md" target="_blank">📘 Full Documentation</a> | |
| </div> | |
| <div style="text-align: center; margin-top: 3rem; color: rgba(255,255,255,0.8);"> | |
| <p><strong>Issues Fixed:</strong></p> | |
| <p>✅ Missing config.js export</p> | |
| <p>✅ Import errors resolved</p> | |
| <p>✅ 40+ API sources integrated</p> | |
| <p>✅ Automatic fallback chains</p> | |
| <p style="margin-top: 1rem; font-size: 0.9rem;"> | |
| <strong>Recommendation:</strong> Use the Modern Dashboard for best experience | |
| </p> | |
| </div> | |
| </div> | |
| </body> | |
| </html> | |