Agent：修订间差异
来自卡厄思梦境WIKI
清空全部内容 标签：清空 |
无编辑摘要 |
||
| 第1行： | 第1行： | ||
{{ResourceLoader|Agent.js}} | |||
{{#css: | |||
.agent-manager { | |||
font-family: sans-serif; | |||
max-width: 1200px; | |||
margin: 0 auto; | |||
padding: 20px; | |||
} | |||
.agent-section { | |||
background: white; | |||
padding: 20px; | |||
border-radius: 8px; | |||
box-shadow: 0 2px 4px rgba(0,0,0,0.1); | |||
} | |||
.agent-section h3 { | |||
margin-top: 0; | |||
color: #333; | |||
border-bottom: 2px solid #0645ad; | |||
padding-bottom: 10px; | |||
} | |||
.agent-section h4 { | |||
color: #555; | |||
margin-top: 25px; | |||
margin-bottom: 15px; | |||
padding-bottom: 8px; | |||
border-bottom: 1px solid #ddd; | |||
} | |||
.agent-tabs { | |||
display: flex; | |||
gap: 10px; | |||
margin-bottom: 20px; | |||
border-bottom: 2px solid #ddd; | |||
} | |||
.agent-tab { | |||
padding: 10px 20px; | |||
cursor: pointer; | |||
background: #f5f5f5; | |||
border: 1px solid #ddd; | |||
border-bottom: none; | |||
border-radius: 4px 4px 0 0; | |||
transition: all 0.3s; | |||
} | |||
.agent-tab:hover { | |||
background: #e5e5e5; | |||
} | |||
.agent-tab.active { | |||
background: white; | |||
border-bottom: 2px solid white; | |||
margin-bottom: -2px; | |||
font-weight: bold; | |||
color: #0645ad; | |||
} | |||
.agent-tab-content { | |||
display: none; | |||
animation: fadeIn 0.3s; | |||
} | |||
.agent-tab-content.active { | |||
display: block; | |||
} | |||
@keyframes fadeIn { | |||
from { opacity: 0; } | |||
to { opacity: 1; } | |||
} | |||
.agent-button { | |||
display: inline-block; | |||
padding: 10px 20px; | |||
margin: 5px; | |||
background: #0645ad; | |||
color: white; | |||
border: none; | |||
border-radius: 4px; | |||
cursor: pointer; | |||
font-size: 14px; | |||
transition: all 0.3s; | |||
} | |||
.agent-button:hover { | |||
background: #0b5ed7; | |||
transform: translateY(-2px); | |||
box-shadow: 0 2px 8px rgba(6, 69, 173, 0.3); | |||
} | |||
.agent-button.secondary { | |||
background: #6c757d; | |||
} | |||
.agent-button.secondary:hover { | |||
background: #5a6268; | |||
} | |||
.agent-form-group { | |||
margin-bottom: 15px; | |||
} | |||
.agent-form-group label { | |||
display: block; | |||
margin-bottom: 5px; | |||
font-weight: bold; | |||
color: #333; | |||
font-size: 13px; | |||
} | |||
.agent-input, | |||
.agent-select, | |||
.agent-textarea { | |||
width: 100%; | |||
padding: 8px 12px; | |||
border: 1px solid #ddd; | |||
border-radius: 4px; | |||
font-size: 14px; | |||
box-sizing: border-box; | |||
transition: border-color 0.3s; | |||
} | |||
.agent-input:focus, | |||
.agent-select:focus, | |||
.agent-textarea:focus { | |||
outline: none; | |||
border-color: #0645ad; | |||
box-shadow: 0 0 0 3px rgba(6, 69, 173, 0.1); | |||
} | |||
.agent-select { | |||
cursor: pointer; | |||
background-color: white; | |||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23333' d='M6 9L1 4h10z'/%3E%3C/svg%3E"); | |||
background-repeat: no-repeat; | |||
background-position: right 10px center; | |||
padding-right: 35px; | |||
appearance: none; | |||
-webkit-appearance: none; | |||
-moz-appearance: none; | |||
} | |||
.agent-textarea { | |||
min-height: 80px; | |||
resize: vertical; | |||
font-family: monospace; | |||
} | |||
.agent-field-row { | |||
display: grid; | |||
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); | |||
gap: 15px; | |||
} | |||
.agent-grid { | |||
display: grid; | |||
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); | |||
gap: 10px; | |||
margin-top: 15px; | |||
} | |||
.agent-list-item { | |||
padding: 15px; | |||
background: #f8f9fa; | |||
border: 1px solid #ddd; | |||
border-radius: 4px; | |||
cursor: pointer; | |||
transition: all 0.3s; | |||
} | |||
.agent-list-item:hover { | |||
background: #e9ecef; | |||
border-color: #0645ad; | |||
transform: translateY(-2px); | |||
box-shadow: 0 2px 8px rgba(0,0,0,0.1); | |||
} | |||
.agent-message { | |||
padding: 12px 15px; | |||
margin: 10px 0; | |||
border-radius: 4px; | |||
animation: slideDown 0.3s; | |||
} | |||
@keyframes slideDown { | |||
from { | |||
opacity: 0; | |||
transform: translateY(-10px); | |||
} | |||
to { | |||
opacity: 1; | |||
transform: translateY(0); | |||
} | |||
} | |||
.agent-message.success { | |||
background: #d4edda; | |||
color: #155724; | |||
border: 1px solid #c3e6cb; | |||
} | |||
.agent-message.error { | |||
background: #f8d7da; | |||
color: #721c24; | |||
border: 1px solid #f5c6cb; | |||
} | |||
.agent-message.info { | |||
background: #d1ecf1; | |||
color: #0c5460; | |||
border: 1px solid #bee5eb; | |||
} | |||
.agent-loading { | |||
text-align: center; | |||
padding: 40px; | |||
color: #666; | |||
font-size: 16px; | |||
} | |||
.agent-loading::after { | |||
content: '...'; | |||
animation: dots 1.5s infinite; | |||
} | |||
@keyframes dots { | |||
0%, 20% { content: '.'; } | |||
40% { content: '..'; } | |||
60%, 100% { content: '...'; } | |||
} | |||
@media (max-width: 768px) { | |||
.agent-field-row { | |||
grid-template-columns: 1fr; | |||
} | |||
.agent-grid { | |||
grid-template-columns: 1fr; | |||
} | |||
.agent-tabs { | |||
flex-direction: column; | |||
} | |||
.agent-tab { | |||
border-radius: 4px; | |||
border: 1px solid #ddd; | |||
} | |||
.agent-tab.active { | |||
margin-bottom: 0; | |||
} | |||
} | |||
}} | |||
2025年10月8日 (三) 15:57的版本