onboarding: tighten stepper and confirm controls

This commit is contained in:
Brad Stein 2026-01-22 22:28:31 -03:00
parent 289e468658
commit 82d79acf4f
2 changed files with 41 additions and 22 deletions

View File

@ -25,15 +25,29 @@ async function ensureDir(dir) {
await fs.mkdir(dir, { recursive: true }); await fs.mkdir(dir, { recursive: true });
} }
async function exists(dir) {
try {
await fs.access(dir);
return true;
} catch {
return false;
}
}
async function main() { async function main() {
try { try {
const sourceExists = await exists(SOURCE);
const rootExists = await exists(ROOT);
const source = sourceExists ? SOURCE : rootExists ? ROOT : null;
await ensureDir(ROOT); await ensureDir(ROOT);
const files = await walk(SOURCE).catch(() => []); const files = source ? await walk(source) : [];
for (const file of files) { if (source && source !== ROOT) {
const src = path.join(SOURCE, file); for (const file of files) {
const dest = path.join(ROOT, file); const src = path.join(source, file);
await ensureDir(path.dirname(dest)); const dest = path.join(ROOT, file);
await fs.copyFile(src, dest); await ensureDir(path.dirname(dest));
await fs.copyFile(src, dest);
}
} }
const payload = { const payload = {
generated_at: new Date().toISOString(), generated_at: new Date().toISOString(),

View File

@ -29,16 +29,6 @@
</button> </button>
</div> </div>
<div v-if="requestUsername" class="status-meta">
<div class="meta-row">
<span class="label mono">Username</span>
<button class="copy mono" type="button" @click="copyUsername">
{{ requestUsername }}
<span v-if="usernameCopied" class="copied">copied</span>
</button>
</div>
</div>
<div v-if="status === 'pending_email_verification'" class="steps"> <div v-if="status === 'pending_email_verification'" class="steps">
<h3>Confirm your email</h3> <h3>Confirm your email</h3>
<p class="muted"> <p class="muted">
@ -166,7 +156,7 @@
class="secondary" class="secondary"
type="button" type="button"
@click="nextSection" @click="nextSection"
:disabled="!hasNextSection || isSectionLocked(nextSectionItem)" :disabled="!hasNextSection || isSectionLocked(nextSectionItem) || !sectionGateComplete(activeSection)"
> >
Next Next
</button> </button>
@ -209,7 +199,7 @@
<div v-if="step.action === 'auto'" class="step-actions"> <div v-if="step.action === 'auto'" class="step-actions">
<button class="secondary" type="button" @click="check" :disabled="loading"> <button class="secondary" type="button" @click="check" :disabled="loading">
Recheck status Confirm
</button> </button>
</div> </div>
@ -1172,6 +1162,13 @@ button.secondary {
font-weight: 600; font-weight: 600;
} }
button.primary:disabled,
button.secondary:disabled,
button.copy:disabled {
opacity: 0.45;
cursor: not-allowed;
}
.steps { .steps {
margin-top: 16px; margin-top: 16px;
} }
@ -1230,23 +1227,27 @@ button.secondary {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 6px; gap: 6px;
min-width: 0;
} }
.stepper-title { .stepper-title {
font-weight: 700; font-weight: 700;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
} }
.stepper-meta { .stepper-meta {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: flex-start;
gap: 6px 10px; gap: 6px;
flex-wrap: wrap; flex-wrap: nowrap;
color: var(--text-muted); color: var(--text-muted);
} }
.pill-compact { .pill-compact {
padding: 6px 10px; padding: 6px 8px;
font-size: 12px; font-size: 12px;
white-space: nowrap; white-space: nowrap;
max-width: 100%; max-width: 100%;
@ -1355,6 +1356,8 @@ button.secondary {
border-radius: 14px; border-radius: 14px;
padding: 12px 12px 10px; padding: 12px 12px 10px;
background: rgba(255, 255, 255, 0.02); background: rgba(255, 255, 255, 0.02);
display: flex;
flex-direction: column;
} }
.step-card.blocked { .step-card.blocked {
@ -1417,6 +1420,8 @@ button.secondary {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 12px; gap: 12px;
justify-content: flex-end;
margin-top: auto;
} }
.recovery-verify { .recovery-verify {