Spaces:
Paused
Paused
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>{{annotation_task_name}} - Training Failed</title> | |
| <!-- Bootstrap CSS --> | |
| <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet"> | |
| <!-- Font Awesome --> | |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"> | |
| <!-- Custom Styles --> | |
| <link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}"> | |
| <!-- Training Failed specific styles --> | |
| <style> | |
| .failed-header { | |
| background: linear-gradient(135deg, var(--destructive) 0%, #c82333 100%); | |
| color: white; | |
| padding: 2rem 0; | |
| margin-bottom: 2rem; | |
| border-radius: 0.5rem; | |
| } | |
| .failed-content { | |
| background-color: #f8f9fa; | |
| border: 2px solid #e9ecef; | |
| border-radius: 0.5rem; | |
| padding: 2rem; | |
| margin-bottom: 1.5rem; | |
| text-align: center; | |
| } | |
| .failed-icon { | |
| font-size: 4rem; | |
| color: #dc3545; | |
| margin-bottom: 1rem; | |
| } | |
| .failed-message { | |
| font-size: 1.25rem; | |
| color: #495057; | |
| margin-bottom: 1.5rem; | |
| } | |
| .stats-box { | |
| background-color: white; | |
| border: 1px solid #dee2e6; | |
| border-radius: 0.5rem; | |
| padding: 1rem; | |
| margin: 1rem auto; | |
| max-width: 400px; | |
| } | |
| .stats-row { | |
| display: flex; | |
| justify-content: space-between; | |
| padding: 0.5rem 0; | |
| border-bottom: 1px solid #eee; | |
| } | |
| .stats-row:last-child { | |
| border-bottom: none; | |
| } | |
| .stats-label { | |
| color: #6c757d; | |
| } | |
| .stats-value { | |
| font-weight: 600; | |
| } | |
| .contact-info { | |
| background-color: #e9ecef; | |
| border-radius: 0.5rem; | |
| padding: 1rem; | |
| margin-top: 1.5rem; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <!-- Header navigation bar --> | |
| <nav class="potato-navbar" role="navigation" style="margin-bottom: 1.5rem;"> | |
| <div class="navbar-inner"> | |
| <div class="navbar-brand"> | |
| <span class="task-name">{{annotation_task_name}}</span> | |
| </div> | |
| <div class="navbar-center"> | |
| <span style="color: var(--light-color); font-size: 0.85rem;"> | |
| <i class="fas fa-times-circle me-2"></i>Training Not Passed | |
| </span> | |
| </div> | |
| <div class="navbar-end"> | |
| <div class="user-pill"> | |
| <span class="username">{{username}}</span> | |
| <a href="/logout" class="logout-btn">Logout</a> | |
| </div> | |
| </div> | |
| </div> | |
| </nav> | |
| <div class="container-fluid"> | |
| <!-- Failed header --> | |
| <div class="failed-header text-center"> | |
| <h2><i class="fas fa-times-circle me-3"></i>Training Not Passed</h2> | |
| <p class="mb-0">Unfortunately, you did not pass the training phase</p> | |
| </div> | |
| <!-- Failed content --> | |
| <div class="failed-content"> | |
| <div class="failed-icon"> | |
| <i class="fas fa-user-times"></i> | |
| </div> | |
| <h3 class="mb-3">We're sorry</h3> | |
| <p class="failed-message"> | |
| {{ message }} | |
| </p> | |
| {% if explanation %} | |
| <div class="alert alert-info" role="alert"> | |
| <i class="fas fa-info-circle me-2"></i> | |
| <strong>Explanation:</strong> {{ explanation }} | |
| </div> | |
| {% endif %} | |
| <!-- Statistics --> | |
| <div class="stats-box"> | |
| <h6 class="mb-3"><i class="fas fa-chart-bar me-2"></i>Your Training Statistics</h6> | |
| {% if correct_count is defined %} | |
| <div class="stats-row"> | |
| <span class="stats-label">Correct Answers:</span> | |
| <span class="stats-value text-success">{{ correct_count }}</span> | |
| </div> | |
| {% endif %} | |
| {% if total_mistakes is defined %} | |
| <div class="stats-row"> | |
| <span class="stats-label">Total Mistakes:</span> | |
| <span class="stats-value text-danger">{{ total_mistakes }}</span> | |
| </div> | |
| {% endif %} | |
| {% if max_mistakes is defined and max_mistakes > 0 %} | |
| <div class="stats-row"> | |
| <span class="stats-label">Maximum Allowed:</span> | |
| <span class="stats-value">{{ max_mistakes }}</span> | |
| </div> | |
| {% endif %} | |
| {% if question_mistakes is defined %} | |
| <div class="stats-row"> | |
| <span class="stats-label">Mistakes on Question:</span> | |
| <span class="stats-value text-danger">{{ question_mistakes }}</span> | |
| </div> | |
| {% endif %} | |
| {% if max_mistakes_per_question is defined and max_mistakes_per_question > 0 %} | |
| <div class="stats-row"> | |
| <span class="stats-label">Max Per Question:</span> | |
| <span class="stats-value">{{ max_mistakes_per_question }}</span> | |
| </div> | |
| {% endif %} | |
| {% if total_questions is defined %} | |
| <div class="stats-row"> | |
| <span class="stats-label">Total Questions:</span> | |
| <span class="stats-value">{{ total_questions }}</span> | |
| </div> | |
| {% endif %} | |
| {% if min_correct is defined %} | |
| <div class="stats-row"> | |
| <span class="stats-label">Required Correct:</span> | |
| <span class="stats-value">{{ min_correct }}</span> | |
| </div> | |
| {% endif %} | |
| </div> | |
| <!-- Contact info --> | |
| <div class="contact-info"> | |
| <p class="mb-0"> | |
| <i class="fas fa-envelope me-2"></i> | |
| If you believe this is an error or have questions, please contact the study administrator. | |
| </p> | |
| </div> | |
| </div> | |
| <!-- Footer --> | |
| <footer class="potato-footer"> | |
| © 2025 <a href="https://blablablab.si.umich.edu/">Blablablab</a> | |
| <span class="footer-sep">·</span> | |
| <a href="https://github.com/davidjurgens/potato">GitHub</a> | |
| <span class="footer-sep">·</span> | |
| <a href="https://github.com/davidjurgens/potato#cite-us">Cite Us</a> | |
| </footer> | |
| </div> | |
| <!-- Bootstrap JS --> | |
| <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script> | |
| </body> | |
| </html> | |