| <!DOCTYPE html> |
| <html lang="en"> |
| <head> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <title>{% block title %}ML4SE Benchmark Viewer{% endblock %}</title> |
| <style> |
| * { |
| margin: 0; |
| padding: 0; |
| box-sizing: border-box; |
| } |
| |
| body { |
| font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; |
| line-height: 1.6; |
| color: #333; |
| background: #f5f5f5; |
| } |
| |
| .container { |
| max-width: 1400px; |
| margin: 0 auto; |
| padding: 20px; |
| } |
| |
| header { |
| background: #2c3e50; |
| color: white; |
| padding: 20px 0; |
| margin-bottom: 30px; |
| box-shadow: 0 2px 4px rgba(0,0,0,0.1); |
| } |
| |
| header h1 { |
| font-size: 2rem; |
| font-weight: 600; |
| } |
| |
| header p { |
| margin-top: 10px; |
| opacity: 0.9; |
| } |
| |
| .card { |
| background: white; |
| border-radius: 8px; |
| padding: 20px; |
| margin-bottom: 20px; |
| box-shadow: 0 2px 4px rgba(0,0,0,0.1); |
| } |
| |
| .card h2 { |
| font-size: 1.5rem; |
| margin-bottom: 15px; |
| color: #2c3e50; |
| border-bottom: 2px solid #3498db; |
| padding-bottom: 10px; |
| } |
| |
| .badge { |
| display: inline-block; |
| padding: 4px 12px; |
| border-radius: 4px; |
| font-size: 0.85rem; |
| font-weight: 600; |
| margin-right: 8px; |
| } |
| |
| .badge-humaneval { |
| background: #3498db; |
| color: white; |
| } |
| |
| .badge-classeval { |
| background: #9b59b6; |
| color: white; |
| } |
| |
| .badge-cruxeval { |
| background: #e67e22; |
| color: white; |
| } |
| |
| .badge-humanevalplus { |
| background: #27ae60; |
| color: white; |
| } |
| |
| .badge-bigobench { |
| background: #8e44ad; |
| color: white; |
| } |
| |
| .badge-mbpp { |
| background: #16a085; |
| color: white; |
| } |
| |
| .badge-codeforces { |
| background: #e74c3c; |
| color: white; |
| } |
| |
| .badge-leetcode { |
| background: #f39c12; |
| color: white; |
| } |
| |
| .badge-atcoder { |
| background: #2ecc71; |
| color: white; |
| } |
| |
| .badge-cppsyntaxerror, .badge-cppreferenceerror, .badge-cpplogicerror, .badge-cppmultipleerror { |
| background: #3498db; |
| color: white; |
| } |
| |
| .badge-javasyntaxerror, .badge-javareferenceerror, .badge-javalogicerror, .badge-javamultipleerror { |
| background: #e67e22; |
| color: white; |
| } |
| |
| .badge-pythonsyntaxerror, .badge-pythonreferenceerror, .badge-pythonlogicerror, .badge-pythonmultipleerror { |
| background: #2ecc71; |
| color: white; |
| } |
| |
| .badge-humanevalx { |
| background: #1abc9c; |
| color: white; |
| } |
| |
| |
| .badge-djangodjango, .badge-astropyastropy, .badge-matabormataborlib, .badge-scikitimagescikitimage { |
| background: #0d6efd; |
| color: white; |
| } |
| |
| .badge-sympy, .badge-sympysympy, .badge-pylintdevpylint, .badge-sphinxdocsphinx, |
| .badge-palletstflask, .badge-palletsjinja, .badge-pyaborpyabor, .badge-pytestdevpytest { |
| background: #6610f2; |
| color: white; |
| } |
| |
| |
| .badge-introductory { |
| background: #27ae60; |
| color: white; |
| } |
| |
| .badge-interview { |
| background: #f39c12; |
| color: white; |
| } |
| |
| .badge-competition { |
| background: #e74c3c; |
| color: white; |
| } |
| |
| |
| .badge-adaptive { |
| background: #3498db; |
| color: white; |
| } |
| |
| .badge-perfective { |
| background: #2ecc71; |
| color: white; |
| } |
| |
| .badge-corrective { |
| background: #e67e22; |
| color: white; |
| } |
| |
| .badge-canitedit { |
| background: #9b59b6; |
| color: white; |
| } |
| |
| |
| .badge-codechef { |
| background: #5b4638; |
| color: white; |
| } |
| |
| .badge-codejam { |
| background: #4285f4; |
| color: white; |
| } |
| |
| .badge-hackerearth { |
| background: #2c3454; |
| color: white; |
| } |
| |
| .badge-aizu { |
| background: #0089d0; |
| color: white; |
| } |
| |
| .badge-unknown { |
| background: #95a5a6; |
| color: white; |
| } |
| |
| |
| .badge-python, .badge-java, .badge-c { |
| background: #3498db; |
| color: white; |
| } |
| |
| |
| .badge-vulnerable { |
| background: #e74c3c; |
| color: white; |
| } |
| |
| .badge-patched { |
| background: #27ae60; |
| color: white; |
| } |
| |
| |
| .badge-codedebug { |
| background: #e74c3c; |
| color: white; |
| } |
| |
| .badge-codetranslate { |
| background: #3498db; |
| color: white; |
| } |
| |
| .badge-codepolish { |
| background: #2ecc71; |
| color: white; |
| } |
| |
| .badge-coderequirementswitch { |
| background: #9b59b6; |
| color: white; |
| } |
| |
| .badge-info { |
| background: #ecf0f1; |
| color: #2c3e50; |
| } |
| |
| |
| .source { |
| font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace; |
| font-size: 0.9rem; |
| line-height: 1.5; |
| overflow-x: auto; |
| } |
| |
| .source table { |
| border-collapse: collapse; |
| width: 100%; |
| } |
| |
| .source td.linenos { |
| background: #f8f8f8; |
| color: #999; |
| padding: 0 10px; |
| text-align: right; |
| user-select: none; |
| border-right: 1px solid #ddd; |
| } |
| |
| .source td.code { |
| padding-left: 15px; |
| } |
| |
| .source .hll { |
| background-color: #ffffcc; |
| } |
| |
| pre { |
| margin: 0; |
| white-space: pre; |
| word-wrap: normal; |
| } |
| |
| |
| .loading { |
| text-align: center; |
| padding: 40px; |
| color: #7f8c8d; |
| } |
| |
| .spinner { |
| border: 4px solid #f3f3f3; |
| border-top: 4px solid #3498db; |
| border-radius: 50%; |
| width: 40px; |
| height: 40px; |
| animation: spin 1s linear infinite; |
| margin: 20px auto; |
| } |
| |
| @keyframes spin { |
| 0% { transform: rotate(0deg); } |
| 100% { transform: rotate(360deg); } |
| } |
| |
| |
| .btn { |
| display: inline-block; |
| padding: 10px 20px; |
| background: #3498db; |
| color: white; |
| text-decoration: none; |
| border-radius: 4px; |
| border: none; |
| cursor: pointer; |
| font-size: 1rem; |
| transition: background 0.3s; |
| } |
| |
| .btn:hover { |
| background: #2980b9; |
| } |
| |
| .btn-secondary { |
| background: #95a5a6; |
| } |
| |
| .btn-secondary:hover { |
| background: #7f8c8d; |
| } |
| |
| |
| .nav-links { |
| margin-top: 20px; |
| } |
| |
| .nav-links a { |
| margin-right: 15px; |
| } |
| |
| {% block extra_css %}{% endblock %} |
| </style> |
| {% block extra_head %}{% endblock %} |
| </head> |
| <body> |
| <header> |
| <div class="container"> |
| <h1>ML4SE Benchmark Viewer</h1> |
| <p>Browse and inspect popular ML4SE benchmark datasets</p> |
| {% block header_extra %}{% endblock %} |
| </div> |
| </header> |
|
|
| <div class="container"> |
| {% block content %}{% endblock %} |
| </div> |
|
|
| {% block scripts %}{% endblock %} |
| </body> |
| </html> |
|
|
