feat(archive): enhance archive page with scrollable table and responsive design

This commit is contained in:
Nik Afiq 2025-12-17 23:13:40 +09:00
parent 77c0c1586b
commit f17905eeff
2 changed files with 30 additions and 20 deletions

View File

@ -517,6 +517,13 @@ kbd {
padding: 10px 12px; padding: 10px 12px;
border-radius: 10px; border-radius: 10px;
} }
.archive-scroll {
width: 100%;
overflow: auto;
}
.archive-table {
min-width: 860px;
}
.archive-header { .archive-header {
font-weight: 800; font-weight: 800;
color: var(--subtle); color: var(--subtle);
@ -537,6 +544,7 @@ kbd {
} }
.archive-header span:nth-child(3), .archive-header span:nth-child(3),
.archive-row span:nth-child(3) { grid-column: span 2; } .archive-row span:nth-child(3) { grid-column: span 2; }
.archive-table { min-width: 100%; }
} }
.scrape-card { .scrape-card {

View File

@ -74,6 +74,7 @@ export default function ArchivePage() {
)} )}
{items.length > 0 && ( {items.length > 0 && (
<div className="archive-scroll">
<div className="archive-table"> <div className="archive-table">
<div className="archive-header"> <div className="archive-header">
<span>ID</span> <span>ID</span>
@ -96,6 +97,7 @@ export default function ArchivePage() {
</div> </div>
))} ))}
</div> </div>
</div>
)} )}
</div> </div>
); );