ArchiveBox/archivebox/templates/static/setup_wizard.css
2026-07-28 13:34:42 -07:00

68 lines
7.8 KiB
CSS

#archivebox-setup-wizard { position:fixed; inset:0; z-index:2147483647; display:flex; align-items:center; justify-content:center; padding:24px; background:rgba(15,23,42,.68); color:#0f172a; font:14px/1.5 -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif; }
#archivebox-setup-wizard .abx-setup-panel { width:min(1040px,100%); max-height:calc(100vh - 48px); overflow:auto; background:#fff; border-radius:12px; box-shadow:0 24px 70px rgba(0,0,0,.38); padding:24px; }
#archivebox-setup-wizard .abx-setup-eyebrow { color:#aa1e55; font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }
#archivebox-setup-title { margin:4px 0 6px; font-size:24px; line-height:1.2; }
#archivebox-setup-wizard .abx-setup-row { margin-top:18px; padding:16px; border:1px solid #dbe3ee; border-radius:9px; background:#fff; }
#archivebox-setup-wizard .abx-setup-label { display:block; margin-bottom:7px; font-size:15px; font-weight:800; }
#archivebox-setup-wizard .abx-question { margin:18px 0 0; padding:16px; border:1px solid #dbe3ee; border-radius:9px; }
#archivebox-setup-wizard .abx-question legend { box-sizing:border-box; width:100%; padding:0 6px; font-size:15px; font-weight:800; }
#archivebox-setup-wizard .abx-question-toggle { display:flex; width:100%; align-items:center; justify-content:space-between; gap:12px; padding:0; border:0; background:transparent; color:inherit; font:inherit; text-align:left; cursor:pointer; }
#archivebox-setup-wizard .abx-question-toggle-icon { display:inline-flex; flex:0 0 22px; align-items:center; justify-content:center; color:#166534; font-size:20px; font-weight:900; line-height:1; }
#archivebox-setup-wizard .abx-question.is-collapsed .abx-question-options { display:none; }
#archivebox-setup-wizard .abx-question.is-valid { border-color:#15803d; background:#f0fdf4; box-shadow:0 0 0 1px #15803d; }
#archivebox-setup-wizard .abx-question.is-invalid { border-color:#dc2626; background:#fffafa; }
#archivebox-setup-wizard .abx-question-options { display:grid; gap:9px; }
#archivebox-setup-wizard .abx-question-option { display:flex; align-items:flex-start; gap:10px; padding:11px 12px; border:1px solid #dbe3ee; border-radius:7px; background:#f8fafc; color:#334155; cursor:pointer; }
#archivebox-setup-wizard .abx-question-option:has(input:checked) { border-color:#15803d; background:#f0fdf4; box-shadow:0 0 0 1px #15803d; }
#archivebox-setup-wizard .abx-question-option input { width:18px; height:18px; margin-top:2px; flex:0 0 auto; accent-color:#15803d; }
#archivebox-setup-wizard .abx-question-option small { display:block; margin-top:2px; color:#64748b; }
#archivebox-setup-title code { font-size:inherit; line-height:inherit; }
#archivebox-setup-wizard .abx-setup-help { display:block; margin-top:6px; color:#64748b; }
#archivebox-setup-wizard .abx-url-comparison { display:grid; gap:4px; margin-top:10px; padding:10px 12px; border-radius:7px; background:#f8fafc; color:#475569; }
#archivebox-setup-wizard .abx-url-comparison-status.is-match { color:#15803d; }
#archivebox-setup-wizard .abx-url-comparison-status.is-warning { color:#b45309; }
#archivebox-setup-wizard .abx-question-status { margin-top:9px; padding:9px 11px; border-radius:7px; background:#f8fafc; color:#475569; font-weight:700; }
#archivebox-setup-wizard .abx-question.is-valid .abx-question-status { background:#dcfce7; color:#166534; }
#archivebox-setup-wizard .abx-question.is-invalid .abx-question-status { background:#fef2f2; color:#991b1b; }
#archivebox-setup-wizard .abx-question.is-valid legend { background:#f0fdf4; }
#archivebox-setup-wizard .abx-question.is-invalid legend { background:#fffafa; }
#archivebox-setup-wizard .abx-question.is-collapsed { padding:8px 12px 10px; }
#archivebox-setup-wizard .abx-question.is-collapsed .abx-question-status { margin:0; padding:3px 6px 0; background:transparent; }
#archivebox-setup-wizard .abx-setup-control { box-sizing:border-box; width:100%; height:44px !important; min-height:44px !important; margin:0; padding:0 12px !important; border:1px solid #b8c4d4 !important; border-radius:7px; background:#fff !important; color:#0f172a !important; font:14px/normal -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif !important; opacity:1 !important; }
#archivebox-setup-wizard select.abx-setup-control { appearance:auto !important; -webkit-appearance:menulist !important; }
#archivebox-setup-wizard select.abx-setup-control option { color:#0f172a !important; background:#fff !important; }
#archivebox-setup-wizard .abx-mode-list { margin:12px 0 0; padding-left:22px; color:#475569; }
#archivebox-setup-wizard .abx-mode-list li { margin:7px 0; padding-left:3px; }
#archivebox-setup-effective-mode { margin-top:10px; padding:11px 12px; border-radius:7px; background:#eef6ff; color:#1e3a5f; font-weight:700; }
#archivebox-setup-wizard .abx-permission-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px 24px; }
#archivebox-setup-wizard .abx-permissions-field { grid-column:1/-1; }
#archivebox-setup-wizard .abx-permissions-label { display:block; margin-bottom:6px; font-weight:700; }
#archivebox-setup-wizard .abx-check { display:flex; align-items:flex-start; gap:9px; color:#334155; }
#archivebox-setup-wizard .abx-check input { width:18px; height:18px; margin-top:2px; }
#archivebox-setup-wizard .abx-preview { margin-top:22px; padding-top:20px; border-top:2px solid #e2e8f0; }
#archivebox-setup-preview-title { margin:0 0 5px; font-size:18px; }
#archivebox-setup-wizard .abx-preview-copy { margin:0 0 12px; color:#64748b; }
#archivebox-setup-wizard .abx-preview-row { display:grid; grid-template-columns:170px minmax(240px,1fr) 220px; gap:10px; align-items:center; margin:8px 0; }
#archivebox-setup-wizard .abx-preview-row label { font-weight:750; }
#archivebox-setup-wizard .abx-preview-url { box-sizing:border-box; width:100%; height:36px; padding:0 9px; border:1px solid #d6dee9; border-radius:6px; background:#f8fafc; color:#334155; font:12px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; }
#archivebox-setup-wizard .abx-status-row { margin:8px 0; padding:10px 12px; border-radius:7px; background:#f8fafc; color:#334155; }
#archivebox-setup-wizard .abx-preview-statuses { margin-top:16px; }
#archivebox-setup-wizard .abx-exposure-title { margin:18px 0 4px; font-size:16px; }
#archivebox-setup-wizard .abx-exposure-note { margin:12px 0 0; color:#64748b; font-size:12px; }
#archivebox-setup-wizard .abx-risk-list { margin:12px 0 0; padding:0; list-style:none; }
#archivebox-setup-wizard .abx-risk-list li { margin:7px 0; padding:10px 12px; border-radius:7px; background:#fff7ed; color:#7c2d12; }
#archivebox-setup-wizard #archivebox-setup-review:disabled { cursor:not-allowed !important; background:#94a3b8 !important; opacity:.75; }
#archivebox-setup-wizard .abx-setup-actions { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; margin-top:22px; }
#archivebox-setup-validation { flex:1; min-width:260px; padding:10px 12px; border-radius:7px; background:#fff7ed; color:#7c2d12; font-weight:700; }
#archivebox-setup-validation.is-testing { background:#eef6ff; color:#1e3a5f; }
#archivebox-setup-validation.is-success { background:#ecfdf5; color:#065f46; }
#archivebox-setup-wizard .abx-button { border:1px solid #94a3b8; border-radius:7px; padding:9px 14px; background:#fff; color:#334155; font-weight:700; cursor:pointer; }
#archivebox-setup-wizard .abx-button-primary { border:0; padding:10px 16px; background:#aa1e55; color:#fff; font-weight:800; }
#archivebox-setup-wizard code { padding:1px 4px; border-radius:4px; background:#eef2f7; color:#334155; }
@media (max-width:760px) {
#archivebox-setup-wizard { padding:8px !important; }
#archivebox-setup-wizard .abx-setup-panel { max-height:calc(100vh - 16px); padding:16px; }
#archivebox-setup-wizard .abx-permission-grid { grid-template-columns:1fr; }
#archivebox-setup-wizard .abx-preview-row { grid-template-columns:1fr; }
}