diff --git a/.claude/templates/fix-dashboard.html b/.claude/templates/fix-dashboard.html index ff6b9a80..d873ad62 100644 --- a/.claude/templates/fix-dashboard.html +++ b/.claude/templates/fix-dashboard.html @@ -1021,6 +1021,238 @@ to { transform: rotate(360deg); } } + /* Error Badge */ + .error-badge { + display: inline-flex; + align-items: center; + gap: 5px; + padding: 5px 12px; + background-color: rgba(239, 68, 68, 0.15); + color: var(--danger-color); + border-radius: 14px; + font-size: 0.75rem; + font-weight: 700; + margin-left: 8px; + } + + /* Error Container */ + .error-container { + margin-top: 12px; + padding: 12px; + background-color: rgba(239, 68, 68, 0.1); + border-left: 4px solid var(--danger-color); + border-radius: 6px; + } + + .error-header { + font-size: 0.8rem; + font-weight: 700; + color: var(--danger-color); + margin-bottom: 8px; + text-transform: uppercase; + letter-spacing: 1px; + } + + .error-item { + padding: 8px 12px; + background-color: var(--bg-card); + border-radius: 6px; + margin-bottom: 6px; + font-size: 0.85rem; + } + + .error-item:last-child { + margin-bottom: 0; + } + + .error-meta { + color: var(--text-secondary); + font-size: 0.75rem; + margin-top: 4px; + } + + /* Task Card Enhancements */ + .task-file { + font-size: 0.85rem; + color: var(--text-secondary); + font-family: 'Courier New', monospace; + margin-top: 8px; + padding: 6px 10px; + background-color: rgba(139, 92, 246, 0.08); + border-radius: 6px; + display: inline-block; + } + + .task-dimension-badge { + display: inline-block; + padding: 4px 10px; + border-radius: 12px; + font-size: 0.7rem; + font-weight: 600; + background-color: rgba(139, 92, 246, 0.15); + color: var(--info-color); + margin-right: 6px; + } + + .task-attempts { + color: var(--warning-color); + font-size: 0.75rem; + font-weight: 600; + } + + /* Finding Details Modal */ + .modal-overlay { + position: fixed; + top: 0; + left: 0; + right: 0; + bottom: 0; + background-color: rgba(0, 0, 0, 0.8); + z-index: 2000; + display: none; + opacity: 0; + transition: opacity 0.3s; + overflow-y: auto; + } + + .modal-overlay.active { + display: flex; + opacity: 1; + align-items: center; + justify-content: center; + padding: 20px; + } + + .modal-content { + background-color: var(--bg-secondary); + border-radius: 12px; + max-width: 900px; + width: 100%; + max-height: 90vh; + overflow-y: auto; + box-shadow: var(--shadow-lg); + transform: scale(0.9); + transition: transform 0.3s; + } + + .modal-overlay.active .modal-content { + transform: scale(1); + } + + .modal-header { + padding: 25px; + border-bottom: 2px solid var(--border-color); + display: flex; + justify-content: space-between; + align-items: center; + position: sticky; + top: 0; + background-color: var(--bg-secondary); + z-index: 10; + } + + .modal-header h2 { + font-size: 1.4rem; + display: flex; + align-items: center; + gap: 12px; + } + + .modal-body { + padding: 25px; + } + + .detail-section { + margin-bottom: 25px; + } + + .detail-section h3 { + font-size: 1.1rem; + margin-bottom: 12px; + color: var(--accent-color); + display: flex; + align-items: center; + gap: 8px; + } + + .detail-grid { + display: grid; + grid-template-columns: 140px 1fr; + gap: 12px; + background-color: var(--bg-card); + padding: 15px; + border-radius: 8px; + } + + .detail-label { + font-weight: 700; + color: var(--text-secondary); + font-size: 0.85rem; + } + + .detail-value { + color: var(--text-primary); + font-size: 0.9rem; + word-break: break-word; + } + + .detail-value code { + background-color: var(--bg-secondary); + padding: 2px 6px; + border-radius: 4px; + font-family: 'Courier New', monospace; + font-size: 0.85rem; + } + + /* Strategy and Risk Display */ + .strategy-risk-container { + margin-top: 10px; + padding: 12px; + background-color: rgba(139, 92, 246, 0.08); + border-radius: 8px; + border: 1px solid rgba(139, 92, 246, 0.2); + } + + .strategy-item, .risk-item { + font-size: 0.85rem; + margin-bottom: 6px; + display: flex; + gap: 8px; + } + + .strategy-item:last-child, .risk-item:last-child { + margin-bottom: 0; + } + + .strategy-label, .risk-label { + font-weight: 700; + color: var(--info-color); + min-width: 90px; + } + + .risk-level { + display: inline-block; + padding: 2px 8px; + border-radius: 10px; + font-size: 0.7rem; + font-weight: 700; + } + + .risk-level.low { + background-color: rgba(34, 197, 94, 0.2); + color: var(--success-color); + } + + .risk-level.medium { + background-color: rgba(245, 158, 11, 0.2); + color: var(--warning-color); + } + + .risk-level.high { + background-color: rgba(239, 68, 68, 0.2); + color: var(--danger-color); + } + /* Responsive Design */ @media (max-width: 768px) { .container { @@ -1051,6 +1283,15 @@ .stage-timeline { flex-wrap: nowrap; } + + .modal-content { + max-width: 100%; + } + + .detail-grid { + grid-template-columns: 1fr; + gap: 8px; + } } @@ -1199,6 +1440,19 @@ + +
+