style(client): align customs and sailing pages with prototype

This commit is contained in:
2026-09-26 18:10:37 +08:00
parent 92e0586089
commit c71a9945df
2 changed files with 5 additions and 4 deletions
@@ -74,5 +74,5 @@ onMounted(() => { void load() })
</template>
<style scoped>
.customs-page { display:flex; flex-direction:column; gap:14px; }.customs-hero { display:flex; justify-content:space-between; align-items:flex-start; padding:22px 24px; border:1px solid var(--client-border); border-radius:var(--client-radius); background:linear-gradient(135deg,#f1f8f6,#fff); }.eyebrow { color:var(--primary); font-size:11px; letter-spacing:.12em; }.customs-hero h1 { margin:7px 0 5px; color:var(--navy); font-size:24px; }.customs-hero p { margin:0; color:var(--muted); font-size:13px; }.customs-toolbar { display:flex; align-items:center; gap:16px; }.customs-toolbar .el-input { max-width:360px; }.customs-toolbar span { color:var(--muted); font-size:12px; }.customs-card { min-height:280px; padding:4px; overflow:hidden; border:1px solid var(--client-border); border-radius:var(--client-radius); background:#fff; }.state-error { display:flex; min-height:220px; flex-direction:column; align-items:center; justify-content:center; gap:10px; color:#b42318; }.state-error p { margin:0; }
.customs-page { display:flex; flex-direction:column; gap:16px; }.customs-hero { display:flex; justify-content:space-between; align-items:flex-start; padding:0 2px 4px; }.eyebrow { color:#5b82c9; font-size:11px; font-weight:750; letter-spacing:.14em; }.customs-hero h1 { margin:6px 0 5px; color:#1f2f46; font-size:26px; line-height:1.25; letter-spacing:-.025em; }.customs-hero p { margin:0; color:#7d8da2; font-size:13px; }.customs-hero .el-button { margin-top:3px; border-color:#d9e3ef; border-radius:9px; background:#fff; color:#61738b; box-shadow:0 3px 8px rgba(26,55,91,.04); }.customs-toolbar { display:flex; min-height:82px; align-items:center; gap:16px; padding:16px 18px; border:1px solid #dce4ef; border-radius:16px; background:#fff; box-shadow:0 5px 16px rgba(31,56,88,.045); }.customs-toolbar .el-input { width:min(520px, 100%); }.customs-toolbar :deep(.el-input__wrapper) { min-height:42px; border-radius:10px; box-shadow:0 0 0 1px #d9e3ef inset; }.customs-toolbar span { color:#7d8da2; font-size:12px; }.customs-card { min-height:320px; padding:4px; overflow:hidden; border:1px solid #dce4ef; border-radius:16px; background:#fff; box-shadow:0 5px 16px rgba(31,56,88,.045); }.customs-card :deep(.el-table) { --el-table-header-bg-color:#f4f7fb; --el-table-row-hover-bg-color:#eaf2ff; --el-table-border-color:#edf1f6; color:#53647a; }.customs-card :deep(.el-table th.el-table__cell) { padding:13px 16px; color:#607089; font-size:12px; font-weight:750; }.customs-card :deep(.el-table td.el-table__cell) { height:58px; padding:13px 16px; font-size:13px; }.customs-card :deep(.el-table__row:nth-child(even)) { background:#f8fbff; }.state-error { display:flex; min-height:260px; flex-direction:column; align-items:center; justify-content:center; gap:10px; color:#b42318; }.state-error p { margin:0; }
</style>