Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Atlas-Flash Evals</title> | |
| <style> | |
| body { | |
| margin: 0; | |
| padding: 0; | |
| height: 100vh; | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| background: #0a0a0f; | |
| font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; | |
| color: #fff; | |
| text-align: center; | |
| overflow: hidden; | |
| } | |
| .container { | |
| padding: 2rem; | |
| position: relative; | |
| z-index: 1; | |
| } | |
| h1 { | |
| font-size: 3.5rem; | |
| margin: 0; | |
| letter-spacing: 0.2rem; | |
| text-transform: uppercase; | |
| background: linear-gradient(45deg, #00ffcc, #0066ff); | |
| -webkit-background-clip: text; | |
| -webkit-text-fill-color: transparent; | |
| } | |
| p { | |
| font-size: 1.2rem; | |
| margin-top: 1rem; | |
| color: #b3b3b3; | |
| } | |
| .subtitle { | |
| font-size: 1.5rem; | |
| margin-top: 0.5rem; | |
| color: #4d4d4d; | |
| } | |
| .grid { | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| width: 100%; | |
| height: 100%; | |
| background: | |
| linear-gradient(rgba(33, 33, 33, 0.1) 1px, transparent 1px), | |
| linear-gradient(90deg, rgba(33, 33, 33, 0.1) 1px, transparent 1px); | |
| background-size: 20px 20px; | |
| animation: moveGrid 15s linear infinite; | |
| } | |
| .pulse { | |
| position: absolute; | |
| width: 100px; | |
| height: 100px; | |
| background: rgba(0, 102, 255, 0.1); | |
| border-radius: 50%; | |
| animation: pulse 2s ease-out infinite; | |
| } | |
| @keyframes moveGrid { | |
| 0% { transform: translateY(0); } | |
| 100% { transform: translateY(20px); } | |
| } | |
| @keyframes pulse { | |
| 0% { | |
| transform: scale(1); | |
| opacity: 1; | |
| } | |
| 100% { | |
| transform: scale(3); | |
| opacity: 0; | |
| } | |
| } | |
| .model-type { | |
| font-size: 1rem; | |
| color: #00ffcc; | |
| margin-top: 2rem; | |
| letter-spacing: 2px; | |
| } | |
| .status { | |
| display: inline-block; | |
| padding: 0.5rem 1rem; | |
| background: rgba(0, 255, 204, 0.1); | |
| border: 1px solid #00ffcc; | |
| border-radius: 20px; | |
| margin-top: 1rem; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <div class="grid"></div> | |
| <div class="pulse"></div> | |
| <div class="container"> | |
| <div class="model-type">Atlas-Flash Evals</div> | |
| <h1>Coming Soon</h1> | |
| <p>~Spestly ❤️</p> | |
| <div class="status">Evaluation in progress!</div> | |
| </div> | |
| </body> | |
| </html> |