guanghulab/docs/css/execution-guard.css
2026-05-10 13:12:44 +08:00

126 lines
2.2 KiB
CSS

/**
* 执行保护样式 · L1 前端隔离
*
* 注意:没有 .cancel-button 类。这不是遗漏,是设计。
* 版权:国作登字-2026-A-00037559
*/
/* 执行中状态 · 输入框锁定 */
.chat-input.execution-locked,
#chat-input.execution-locked {
opacity: 0.5;
pointer-events: none;
background: #2a2a3a;
border-color: #444;
}
.chat-input.execution-locked::placeholder,
#chat-input.execution-locked::placeholder {
color: #888;
}
/* 执行状态条 */
.execution-status-bar {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px;
padding: 12px 16px;
border-radius: 8px;
margin: 8px 0;
font-size: 14px;
animation: pulse-gentle 2s infinite;
}
.execution-status-bar .exec-icon {
flex-shrink: 0;
font-size: 1.1em;
}
.execution-status-bar .exec-text {
flex: 1;
}
.execution-status-bar.blue {
background: rgba(35, 131, 226, 0.08);
color: #64c8ff;
}
.execution-status-bar.green {
background: rgba(15, 123, 108, 0.08);
color: #0F7B6C;
animation: none;
}
.execution-status-bar.red {
background: rgba(212, 76, 71, 0.08);
color: #D44C47;
animation: none;
}
/* 执行进度条 */
.execution-progress {
width: 100%;
height: 3px;
background: rgba(255, 255, 255, 0.1);
border-radius: 2px;
margin-top: 4px;
overflow: hidden;
}
.execution-progress-fill {
height: 100%;
background: #64c8ff;
border-radius: 2px;
transition: width 0.5s ease;
}
.execution-status-bar.green .execution-progress-fill {
background: #0F7B6C;
}
.execution-status-bar.red .execution-progress-fill {
background: #D44C47;
}
/* 执行日志容器 */
.execution-log-container {
max-height: 200px;
overflow-y: auto;
padding: 4px 8px;
margin: 4px 0 12px;
font-size: 13px;
}
/* 执行日志条目 */
.execution-log-entry {
display: flex;
align-items: flex-start;
gap: 8px;
padding: 3px 0;
color: #b0b0c0;
}
.execution-log-entry .log-icon {
flex-shrink: 0;
font-size: 0.9em;
}
.execution-log-entry .log-msg {
flex: 1;
}
.execution-log-entry .log-time {
flex-shrink: 0;
color: #666;
font-size: 12px;
}
/* 温和脉冲动画 */
@keyframes pulse-gentle {
0%, 100% { opacity: 1; }
50% { opacity: 0.7; }
}
/* 注意:没有 .cancel-button 类。这不是遗漏。 */