前端: 添加回收站页面

This commit is contained in:
Frontend Developer 2026-03-10 09:55:59 +00:00
parent aec0c2186a
commit d1284965db

View File

@ -0,0 +1,48 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>CloudDisk - 回收站</title>
<style>
body { font-family: -apple-system, sans-serif; margin: 0; background: #f0f2f5; }
.header { background: linear-gradient(90deg, #1890ff, #40a9ff); padding: 16px 24px; color: white; display: flex; justify-content: space-between; }
.title { font-size: 20px; font-weight: bold; }
.toolbar { background: white; padding: 16px 24px; display: flex; gap: 12px; }
.file-item { background: white; margin: 0 24px 8px; padding: 16px; border-radius: 8px; display: flex; justify-content: space-between; align-items: center; }
.file-info { display: flex; align-items: center; gap: 12px; }
.file-icon { font-size: 24px; }
.file-name { font-weight: 500; }
.file-meta { color: #999; font-size: 12px; }
.note { color: #999; font-size: 12px; text-align: center; padding: 24px; }
</style>
</head>
<body>
<div class="header">
<span class="title">回收站</span>
</div>
<div class="toolbar">
<button>还原选中</button>
<button>永久删除</button>
<button>清空回收站</button>
</div>
<div class="file-item">
<div class="file-info">
<span class="file-icon">📄</span>
<div>
<div class="file-name">report.pdf</div>
<div class="file-meta">删除于: 2026-03-10 10:30 · 2.5MB</div>
</div>
</div>
</div>
<div class="file-item">
<div class="file-info">
<span class="file-icon">🖼</span>
<div>
<div class="file-name">photo.jpg</div>
<div class="file-meta">删除于: 2026-03-09 15:20 · 3.2MB</div>
</div>
</div>
</div>
<div class="note">* 文件将在回收站保留30天后自动清除</div>
</body>
</html>