ensureStyles function ✓ 100.0%
Last updated: 2026-03-04T23:21:38.399Z
Metrics
LOC: 121
Complexity: 2
Params: 0
Coverage: 100.0% (4/4 lines, 0x executed)
Signature
ensureStyles(): : void
Source Code
function ensureStyles(): void {
if (document.getElementById(STYLE_ID)) return;
const style = document.createElement("style");
style.id = STYLE_ID;
style.textContent = `
#${CONTAINER_ID} {
position: fixed;
bottom: 16px;
right: 16px;
z-index: 2147483646;
font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
font-size: 12px;
color: #e2e8f0;
background: #1e1b4b;
border: 1px solid rgba(99, 102, 241, 0.4);
border-radius: 10px;
padding: 10px 14px;
min-width: 260px;
max-width: 360px;
max-height: 320px;
overflow-y: auto;
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
transition: opacity 0.3s ease, transform 0.3s ease;
opacity: 0;
transform: translateY(12px);
}
#${CONTAINER_ID}.fa-progress-visible {
opacity: 1;
transform: translateY(0);
}
#${CONTAINER_ID} .fa-progress-header {
display: flex;
align-items: center;
gap: 6px;
font-weight: 700;
font-size: 11px;
text-transform: uppercase;
letter-spacing: 0.5px;
color: #a5b4fc;
margin-bottom: 8px;
padding-bottom: 6px;
border-bottom: 1px solid rgba(99, 102, 241, 0.2);
}
#${CONTAINER_ID} .fa-progress-item {
display: flex;
align-items: center;
gap: 6px;
padding: 3px 0;
font-size: 11px;
line-height: 1.3;
transition: opacity 0.2s ease;
}
#${CONTAINER_ID} .fa-progress-item .fa-progress-icon {
flex-shrink: 0;
width: 16px;
text-align: center;
font-size: 10px;
}
#${CONTAINER_ID} .fa-progress-item .fa-progress-label {
flex: 1;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
max-width: 180px;
}
#${CONTAINER_ID} .fa-progress-item .fa-progress-badge {
flex-shrink: 0;
font-size: 9px;
font-weight: 600;
padding: 1px 5px;
border-radius: 3px;
text-transform: uppercase;
letter-spacing: 0.3px;
}
#${CONTAINER_ID} .fa-progress-item.detecting .fa-progress-badge {
background: rgba(99, 102, 241, 0.3);
color: #a5b4fc;
}
#${CONTAINER_ID} .fa-progress-item.detected .fa-progress-badge {
background: rgba(34, 197, 94, 0.3);
color: #86efac;
}
#${CONTAINER_ID} .fa-progress-item.filling .fa-progress-badge {
background: rgba(234, 179, 8, 0.3);
color: #fde047;
}
#${CONTAINER_ID} .fa-progress-item.filled .fa-progress-badge {
background: rgba(34, 197, 94, 0.3);
color: #86efac;
}
#${CONTAINER_ID} .fa-progress-item.error .fa-progress-badge {
background: rgba(239, 68, 68, 0.3);
color: #fca5a5;
}
#${CONTAINER_ID} .fa-progress-summary {
margin-top: 8px;
padding-top: 6px;
border-top: 1px solid rgba(99, 102, 241, 0.2);
font-weight: 600;
font-size: 11px;
color: #86efac;
}
@keyframes fa-spin {
to { transform: rotate(360deg); }
}
#${CONTAINER_ID} .fa-spinner {
display: inline-block;
width: 10px;
height: 10px;
border: 2px solid rgba(165, 180, 252, 0.3);
border-top-color: #a5b4fc;
border-radius: 50%;
animation: fa-spin 0.6s linear infinite;
}
#${CONTAINER_ID} .fa-spinner.ai {
border-top-color: #fbbf24;
}
`;
document.head.appendChild(style);
}
No outgoing dependencies.
Impact (Incoming)
| Source | Type |
|---|---|
| showDetectionBadge | calls |
| createProgressNotification | calls |