53 lines
1.3 KiB
CSS
53 lines
1.3 KiB
CSS
|
/* 旋转动画(loading 图标) */
|
|||
|
.loader {
|
|||
|
animation: spin 1s linear infinite;
|
|||
|
}
|
|||
|
@keyframes spin {
|
|||
|
0% { transform: rotate(0deg) }
|
|||
|
100% { transform: rotate(360deg) }
|
|||
|
}
|
|||
|
|
|||
|
/* 拖拽高亮:与 Tailwind 共存,覆盖边框与背景 */
|
|||
|
.drag-zone.drag-active {
|
|||
|
border-color: #2563eb; /* blue-600 */
|
|||
|
background-color: #eff6ff; /* blue-50 */
|
|||
|
box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
|
|||
|
}
|
|||
|
|
|||
|
/* 文件列表样式微调 */
|
|||
|
#fileList li {
|
|||
|
display: grid;
|
|||
|
grid-template-columns: 1fr auto;
|
|||
|
gap: 0.75rem;
|
|||
|
padding: 0.75rem 1rem;
|
|||
|
align-items: center;
|
|||
|
}
|
|||
|
#fileList .file-name {
|
|||
|
font-size: 0.95rem;
|
|||
|
color: #111827; /* gray-900 */
|
|||
|
word-break: break-all;
|
|||
|
}
|
|||
|
#fileList .file-meta {
|
|||
|
font-size: 0.78rem;
|
|||
|
color: #6b7280; /* gray-500 */
|
|||
|
}
|
|||
|
#fileList .remove-btn {
|
|||
|
color: #ef4444; /* red-500 */
|
|||
|
}
|
|||
|
#fileList .remove-btn:hover {
|
|||
|
color: #b91c1c; /* red-700 */
|
|||
|
}
|
|||
|
|
|||
|
/* 隐藏但保留可访问性的类(配合HTML中的 sr-only)*/
|
|||
|
.sr-only {
|
|||
|
position: absolute !important;
|
|||
|
width: 1px !important;
|
|||
|
height: 1px !important;
|
|||
|
padding: 0 !important;
|
|||
|
margin: -1px !important;
|
|||
|
overflow: hidden !important;
|
|||
|
clip: rect(0,0,0,0) !important;
|
|||
|
white-space: nowrap !important;
|
|||
|
border: 0 !important;
|
|||
|
}
|