dynamic-interaction
Version:
Dynamic interaction 动态交互mcp,用于cursor、windsurf、trae 等 AI 智能编辑器 Agent 运行时交互使用
70 lines (60 loc) • 1.2 kB
CSS
/* components/attachment.css */
.attachment-section {
margin-top: 24px;
}
#drop-zone {
border: 2px dashed #4a4a4c;
border-radius: 8px;
padding: 32px;
text-align: center;
cursor: pointer;
background-color: #3a3a3c;
transition: border-color 0.3s, background-color 0.3s;
}
#drop-zone:hover, #drop-zone.dragover {
border-color: #0a84ff;
background-color: #404042;
}
.drop-zone-text .icon {
font-size: 24px;
color: #8e8e93;
}
.drop-zone-text p {
margin: 8px 0;
font-size: 14px;
color: #e0e0e0;
}
.drop-zone-text span {
font-size: 12px;
color: #8e8e93;
}
#image-preview-container {
margin-top: 16px;
display: flex;
flex-wrap: wrap;
gap: 12px;
}
.preview-item {
position: relative;
}
.preview-item img {
width: 100px;
height: 100px;
object-fit: cover;
border-radius: 8px;
}
.preview-item .remove-image {
position: absolute;
top: -5px;
right: -5px;
background: rgba(0,0,0,0.7);
color: white;
border: 2px solid white;
border-radius: 50%;
width: 20px;
height: 20px;
line-height: 16px;
text-align: center;
cursor: pointer;
font-size: 14px;
}