mirror of
https://github.com/thecyberlearn/quantumtaskai-caprover.git
synced 2026-08-18 16:32:55 +00:00
b0e8c917ef
Complete Django AI agent marketplace with security optimizations and clean deployment documentation without any API keys or secrets. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
305 lines
8.6 KiB
HTML
305 lines
8.6 KiB
HTML
{% extends 'base.html' %}
|
|
{% load static %}
|
|
|
|
{% block title %}Server Error - Quantum Tasks AI{% endblock %}
|
|
|
|
{% block extra_css %}
|
|
<link rel="stylesheet" href="{% static 'css/agent-base.css' %}?v={{ timestamp }}">
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
<!-- Agent Header Component -->
|
|
{% include "components/agent_header.html" with agent_title="Server Error" agent_subtitle="We're working to fix this issue" %}
|
|
|
|
<!-- Quick Agents Panel Component -->
|
|
{% include "components/quick_agents_panel.html" %}
|
|
|
|
<!-- Error Content -->
|
|
<div class="agent-container">
|
|
<div class="agent-grid">
|
|
<!-- Main Error Widget -->
|
|
<div class="agent-widget widget-large">
|
|
<div class="agent-widget-header">
|
|
<h2 class="agent-widget-title">
|
|
<span class="agent-icon">⚠️</span>
|
|
500 - Server Error
|
|
</h2>
|
|
<p class="agent-widget-subtitle">Technical difficulties detected</p>
|
|
</div>
|
|
|
|
<div class="agent-widget-content">
|
|
<div class="error-content">
|
|
<div class="error-illustration">
|
|
<div class="error-icon-large">🔧</div>
|
|
<p class="error-message">
|
|
We're experiencing technical difficulties. Our AI systems are temporarily unavailable,
|
|
but our team has been notified and is working to resolve the issue.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="error-status">
|
|
<div class="status-indicator">
|
|
<div class="status-dot pulsing"></div>
|
|
<span class="status-text">System monitoring active</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="error-actions">
|
|
<div class="button-group">
|
|
<a href="{% url 'core:homepage' %}" class="btn btn-primary">
|
|
<span class="btn-icon">🏠</span>
|
|
Go Home
|
|
</a>
|
|
<a href="{% url 'agents:marketplace' %}" class="btn btn-secondary">
|
|
<span class="btn-icon">🤖</span>
|
|
Browse AI Agents
|
|
</a>
|
|
</div>
|
|
|
|
<div class="retry-section">
|
|
<p class="retry-text">You can try refreshing the page in a few minutes</p>
|
|
<button onclick="window.location.reload()" class="btn btn-outline">
|
|
<span class="btn-icon">🔄</span>
|
|
Refresh Page
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Status Widget -->
|
|
<div class="agent-widget widget-small" style="margin-left: auto;">
|
|
<div class="agent-widget-header">
|
|
<h3 class="agent-widget-title">
|
|
<span class="agent-icon">📊</span>
|
|
System Status
|
|
</h3>
|
|
</div>
|
|
<div class="agent-widget-content">
|
|
<div class="status-content">
|
|
<div class="status-item">
|
|
<span class="status-icon">🟡</span>
|
|
<div class="status-info">
|
|
<span class="status-name">AI Services</span>
|
|
<span class="status-value">Investigating</span>
|
|
</div>
|
|
</div>
|
|
<div class="status-item">
|
|
<span class="status-icon">🟢</span>
|
|
<div class="status-info">
|
|
<span class="status-name">Website</span>
|
|
<span class="status-value">Operational</span>
|
|
</div>
|
|
</div>
|
|
<div class="status-item">
|
|
<span class="status-icon">🟢</span>
|
|
<div class="status-info">
|
|
<span class="status-name">Database</span>
|
|
<span class="status-value">Operational</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="error-details">
|
|
<p class="detail-item">
|
|
<strong>Error ID:</strong>
|
|
<span class="detail-value">{{ request.META.HTTP_X_REQUEST_ID|default:"N/A" }}</span>
|
|
</p>
|
|
<p class="detail-item">
|
|
<strong>Time:</strong>
|
|
<span class="detail-value" id="error-time"></span>
|
|
</p>
|
|
<p class="detail-item">
|
|
<strong>Support:</strong>
|
|
<a href="mailto:support@quantumtaskai.com" class="support-link">
|
|
support@quantumtaskai.com
|
|
</a>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<style>
|
|
/* 500 Error specific styling that follows agent theme */
|
|
.error-content {
|
|
text-align: center;
|
|
padding: var(--spacing-lg);
|
|
}
|
|
|
|
.error-illustration {
|
|
margin-bottom: var(--spacing-xl);
|
|
}
|
|
|
|
.error-icon-large {
|
|
font-size: 4rem;
|
|
margin-bottom: var(--spacing-md);
|
|
line-height: 1;
|
|
}
|
|
|
|
.error-message {
|
|
font-size: var(--text-lg);
|
|
color: var(--on-surface-variant);
|
|
line-height: 1.6;
|
|
max-width: 500px;
|
|
margin: 0 auto var(--spacing-xl);
|
|
}
|
|
|
|
.error-status {
|
|
margin-bottom: var(--spacing-xl);
|
|
display: flex;
|
|
justify-content: center;
|
|
}
|
|
|
|
.status-indicator {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: var(--spacing-sm);
|
|
padding: var(--spacing-sm) var(--spacing-md);
|
|
background: var(--surface-variant);
|
|
border-radius: var(--radius-md);
|
|
border: 1px solid var(--outline-variant);
|
|
}
|
|
|
|
.status-dot {
|
|
width: 8px;
|
|
height: 8px;
|
|
border-radius: 50%;
|
|
background: var(--success);
|
|
}
|
|
|
|
.status-dot.pulsing {
|
|
animation: pulse 2s infinite;
|
|
}
|
|
|
|
@keyframes pulse {
|
|
0% { opacity: 1; }
|
|
50% { opacity: 0.5; }
|
|
100% { opacity: 1; }
|
|
}
|
|
|
|
.status-text {
|
|
font-size: var(--text-sm);
|
|
color: var(--on-surface);
|
|
}
|
|
|
|
.error-actions {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--spacing-xl);
|
|
align-items: center;
|
|
}
|
|
|
|
.button-group {
|
|
display: flex;
|
|
gap: var(--spacing-md);
|
|
flex-wrap: wrap;
|
|
justify-content: center;
|
|
}
|
|
|
|
.retry-section {
|
|
text-align: center;
|
|
}
|
|
|
|
.retry-text {
|
|
font-size: var(--text-sm);
|
|
color: var(--on-surface-variant);
|
|
margin-bottom: var(--spacing-md);
|
|
}
|
|
|
|
.btn-outline {
|
|
background: transparent;
|
|
border: 1px solid var(--outline);
|
|
color: var(--on-surface);
|
|
}
|
|
|
|
.btn-outline:hover {
|
|
background: var(--surface-variant);
|
|
border-color: var(--outline-variant);
|
|
}
|
|
|
|
.status-content {
|
|
padding: var(--spacing-md);
|
|
}
|
|
|
|
.status-item {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: var(--spacing-sm);
|
|
padding: var(--spacing-sm) 0;
|
|
border-bottom: 1px solid var(--outline-variant);
|
|
}
|
|
|
|
.status-item:last-of-type {
|
|
border-bottom: none;
|
|
}
|
|
|
|
.status-icon {
|
|
font-size: var(--text-base);
|
|
}
|
|
|
|
.status-info {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 2px;
|
|
flex: 1;
|
|
}
|
|
|
|
.status-name {
|
|
font-size: var(--text-sm);
|
|
color: var(--on-surface);
|
|
font-weight: 500;
|
|
}
|
|
|
|
.status-value {
|
|
font-size: var(--text-xs);
|
|
color: var(--on-surface-variant);
|
|
}
|
|
|
|
.error-details {
|
|
margin-top: var(--spacing-md);
|
|
padding-top: var(--spacing-md);
|
|
border-top: 1px solid var(--outline-variant);
|
|
}
|
|
|
|
.detail-item {
|
|
font-size: var(--text-xs);
|
|
color: var(--on-surface-variant);
|
|
margin-bottom: var(--spacing-xs);
|
|
}
|
|
|
|
.detail-value {
|
|
color: var(--on-surface);
|
|
font-family: monospace;
|
|
}
|
|
|
|
.support-link {
|
|
color: var(--primary);
|
|
text-decoration: none;
|
|
}
|
|
|
|
.support-link:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
/* Responsive design */
|
|
@media (max-width: 768px) {
|
|
.button-group {
|
|
flex-direction: column;
|
|
width: 100%;
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<script>
|
|
// Display current time
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
const timeElement = document.getElementById('error-time');
|
|
if (timeElement) {
|
|
timeElement.textContent = new Date().toLocaleString();
|
|
}
|
|
});
|
|
</script>
|
|
{% endblock %} |