Spaces:
Sleeping
Sleeping
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>WandB Run Viewer</title> | |
| <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@picocss/pico@1/css/pico.min.css"> | |
| <style> | |
| body, html { | |
| height: 100%; | |
| margin: 0; | |
| padding: 0; | |
| } | |
| main.container { | |
| height: 100vh; | |
| display: flex; | |
| flex-direction: column; | |
| padding: 1rem; | |
| max-width: 100% ; /* Override Pico CSS container width */ | |
| } | |
| .form-container { | |
| flex: 0 0 auto; | |
| margin-bottom: 1rem; | |
| /* Keep form inputs from stretching too wide */ | |
| max-width: 1200px; | |
| margin-left: auto; | |
| margin-right: auto; | |
| width: 100%; | |
| } | |
| .iframe-container { | |
| flex: 1 1 auto; | |
| min-height: 0; /* Important for Firefox */ | |
| width: 100vw; /* Full viewport width */ | |
| margin-left: calc(-1 * 1rem); /* Compensate for container padding */ | |
| margin-right: calc(-1 * 1rem); /* Compensate for container padding */ | |
| } | |
| .error { | |
| color: red; | |
| margin: 1rem 0; | |
| } | |
| iframe { | |
| width: 100%; | |
| height: 100%; | |
| border: none; | |
| display: block; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <main class="container"> | |
| <div class="form-container"> | |
| <form method="POST"> | |
| <div class="grid"> | |
| <input | |
| type="text" | |
| name="token" | |
| placeholder="WandB Token" | |
| required | |
| value="{{ token or '' }}" | |
| > | |
| <input | |
| type="text" | |
| name="entity" | |
| placeholder="Entity" | |
| required | |
| value="{{ entity or '' }}" | |
| > | |
| <input | |
| type="text" | |
| name="project" | |
| placeholder="Project" | |
| required | |
| value="{{ project or '' }}" | |
| > | |
| <input | |
| type="text" | |
| name="run_id" | |
| placeholder="Run ID" | |
| required | |
| value="{{ run_id or '' }}" | |
| > | |
| </div> | |
| <button type="submit">Load Run</button> | |
| </form> | |
| {% if error %} | |
| <div class="error"> | |
| {{ error }} | |
| </div> | |
| {% endif %} | |
| </div> | |
| {% if iframe_html %} | |
| <div class="iframe-container"> | |
| {{ iframe_html | safe }} | |
| </div> | |
| {% endif %} | |
| </main> | |
| </body> | |
| </html> |