Spaces:
Running
Running
stouchinglhh
Claude
sync processor from GitLab c697b6e: 版本 1.19.4 / 前端 1.12.4 —— 服务端 i18n(首屏不再闪英文)、推理模块并入模型页、前端抽出 shared/、缓存键改用前端号
bb59211 Download processor/web/templates/login.html from Stouching-Robotics/DataFlowing: direct link, hf CLI and curl.
- Browser
- Download file 6.71 kB
-
https://huggingface.co/spaces/Stouching-Robotics/DataFlowing/resolve/main/processor/web/templates/login.html
- Command line
-
hf download hf://spaces/Stouching-Robotics/DataFlowing/processor/web/templates/login.html
-
curl -L -o login.html https://huggingface.co/spaces/Stouching-Robotics/DataFlowing/resolve/main/processor/web/templates/login.html
6.71 kB
| <html lang="{{ current_lang() }}"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>EgoData — Login</title> | |
| <link rel="stylesheet" href="/static/plyr.css" /> | |
| <link rel="stylesheet" href="/static/tailwind-generated.css?v={{ asset_version }}"> | |
| <script src="/static/iconify-preload.js"></script> | |
| <script src="/static/iconify-icon.min.js"></script> | |
| <style> | |
| /* Particle background */ | |
| .particle-bg { | |
| position: fixed; inset: 0; overflow: hidden; z-index: 0; | |
| background: linear-gradient(135deg, #0a0f1a 0%, #0d1525 30%, #0a1220 60%, #060d18 100%); | |
| } | |
| .particle { | |
| position: absolute; | |
| width: 2px; height: 2px; | |
| background: rgba(59, 130, 246, 0.3); | |
| border-radius: 50%; | |
| animation: float linear infinite; | |
| } | |
| @keyframes float { | |
| 0% { transform: translateY(100vh) scale(0); opacity: 0; } | |
| 10% { opacity: 1; } | |
| 90% { opacity: 1; } | |
| 100% { transform: translateY(-10vh) scale(1); opacity: 0; } | |
| } | |
| @keyframes fadeIn { | |
| from { opacity: 0; transform: translateY(8px); } | |
| to { opacity: 1; transform: translateY(0); } | |
| } | |
| .animate-fade-in { animation: fadeIn 0.5s ease-out both; } | |
| .delay-1 { animation-delay: 0.1s; } | |
| .delay-2 { animation-delay: 0.2s; } | |
| .delay-3 { animation-delay: 0.3s; } | |
| .delay-4 { animation-delay: 0.4s; } | |
| .delay-5 { animation-delay: 0.5s; } | |
| </style> | |
| </head> | |
| <body class="min-h-screen flex items-center justify-center relative bg-gray-950"> | |
| <!-- Particle background --> | |
| <div class="particle-bg" id="particle-bg"></div> | |
| <!-- Login card --> | |
| <div class="relative z-10 w-full max-w-md mx-4"> | |
| <div class="bg-gray-900/80 backdrop-blur-xl border border-gray-800 rounded-2xl shadow-2xl shadow-blue-900/10 p-8 animate-fade-in"> | |
| <!-- Logo --> | |
| <div class="text-center mb-8 animate-fade-in"> | |
| <div class="inline-flex items-center justify-center w-16 h-16 rounded-2xl bg-blue-600/10 border border-blue-500/20 mb-4"> | |
| <img src="/static/logo.png" alt="EgoData" class="w-10 h-10"> | |
| </div> | |
| <h1 class="text-2xl font-bold text-white tracking-tight">EgoData</h1> | |
| <p class="text-sm text-gray-500 mt-1">Robot Data Intelligence Platform</p> | |
| </div> | |
| <!-- Error message --> | |
| <div id="login-error" class="hidden bg-red-900/30 border border-red-800 rounded-lg px-4 py-3 mb-4 flex items-center gap-2 text-red-300 text-sm animate-fade-in"> | |
| <iconify-icon icon="ant-design:warning-filled" class="text-red-400 icon-sm flex-shrink-0"></iconify-icon> | |
| <span id="login-error-text"></span> | |
| </div> | |
| <!-- Form --> | |
| <form id="login-form" class="space-y-4"> | |
| <div class="animate-fade-in delay-1"> | |
| <label class="block text-xs text-gray-500 mb-1.5">Username</label> | |
| <input | |
| type="text" | |
| id="username" | |
| name="username" | |
| autocomplete="username" | |
| class="w-full bg-gray-800 border border-gray-700 rounded-lg px-4 py-2.5 text-gray-200 text-sm placeholder-gray-600 focus:outline-none focus:ring-2 focus:ring-blue-500/50 focus:border-blue-500/50 transition-all" | |
| > | |
| </div> | |
| <div class="animate-fade-in delay-2"> | |
| <label class="block text-xs text-gray-500 mb-1.5">Password</label> | |
| <input | |
| type="password" | |
| id="password" | |
| name="password" | |
| autocomplete="current-password" | |
| class="w-full bg-gray-800 border border-gray-700 rounded-lg px-4 py-2.5 text-gray-200 text-sm placeholder-gray-600 focus:outline-none focus:ring-2 focus:ring-blue-500/50 focus:border-blue-500/50 transition-all" | |
| > | |
| </div> | |
| <div class="flex items-center gap-2 animate-fade-in delay-3"> | |
| <input | |
| type="checkbox" | |
| id="remember-me" | |
| class="w-4 h-4 rounded border-gray-600 bg-gray-800 text-blue-600 focus:ring-blue-500/50 focus:ring-offset-0" | |
| > | |
| <label for="remember-me" class="text-xs text-gray-500 cursor-pointer select-none">Remember me for 30 days</label> | |
| </div> | |
| <div class="animate-fade-in delay-4"> | |
| <button | |
| type="submit" | |
| id="btn-login" | |
| class="w-full bg-blue-600 hover:bg-blue-500 active:bg-blue-700 text-white text-sm font-medium py-2.5 rounded-lg transition-colors focus:outline-none focus:ring-2 focus:ring-blue-500/50" | |
| > | |
| Sign In | |
| </button> | |
| </div> | |
| <div class="text-center animate-fade-in delay-5"> | |
| <a href="javascript:void(0)" class="text-xs text-gray-600 hover:text-gray-400 transition-colors">Forgot Password?</a> | |
| </div> | |
| </form> | |
| </div> | |
| <!-- Footer --> | |
| <p class="text-center text-xs text-gray-700 mt-6 animate-fade-in delay-5"> | |
| v0.2.0 · Robot Data Platform | |
| </p> | |
| </div> | |
| <script src="/static/js/login.js?v={{ asset_version }}"></script> | |
| <script> | |
| // Generate particles | |
| (function() { | |
| const bg = document.getElementById('particle-bg'); | |
| const count = 40; | |
| for (let i = 0; i < count; i++) { | |
| const p = document.createElement('div'); | |
| p.className = 'particle'; | |
| p.style.left = Math.random() * 100 + '%'; | |
| p.style.animationDuration = (8 + Math.random() * 20) + 's'; | |
| p.style.animationDelay = Math.random() * 15 + 's'; | |
| p.style.width = (1 + Math.random() * 2) + 'px'; | |
| p.style.height = p.style.width; | |
| // Vary opacity and hue slightly | |
| const hue = 200 + Math.random() * 40; // blue range | |
| const alpha = 0.15 + Math.random() * 0.25; | |
| p.style.background = `hsla(${hue}, 80%, 60%, ${alpha})`; | |
| bg.appendChild(p); | |
| } | |
| })(); | |
| </script> | |
| </body> | |
| </html> | |