Adjust typing animation and command display spacing
Refactor HTML structure for command input to use a single inline container with `white-space: pre` to precisely control spacing, and adjust JavaScript to add a trailing space to the typed text and increase the pause before the enter key press in the auto-type animation. Replit-Commit-Author: Agent Replit-Commit-Session-Id: 6def8112-39d2-4641-b93b-f39108179f33 Replit-Commit-Checkpoint-Type: full_checkpoint Replit-Commit-Event-Id: 3f816ee5-1289-41ac-aa73-2bd1494876d3 Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/42ae33dd-8759-4196-85a5-434465c72ece/6def8112-39d2-4641-b93b-f39108179f33/roUqm0y Replit-Helium-Checkpoint-Created: true
This commit is contained in:
@@ -57,7 +57,8 @@ function typeIntro(target: string, onDone?: () => void) {
|
||||
|
||||
function nextChar() {
|
||||
if (i >= target.length) {
|
||||
typedEl.textContent = resolved;
|
||||
// append a trailing space so the caret rests one char past the prompt
|
||||
typedEl.textContent = resolved + ' ';
|
||||
onDone?.();
|
||||
return;
|
||||
}
|
||||
@@ -81,7 +82,7 @@ function typeIntro(target: string, onDone?: () => void) {
|
||||
}
|
||||
|
||||
if (reduceMotion) {
|
||||
typedEl.textContent = COMMAND;
|
||||
typedEl.textContent = COMMAND + ' ';
|
||||
inputEnabled = true;
|
||||
} else {
|
||||
setTimeout(() => typeIntro(COMMAND, () => {
|
||||
@@ -254,8 +255,8 @@ async function autoTypeHelp() {
|
||||
await sleep(60);
|
||||
}
|
||||
|
||||
// PHASE 3 — quick read pause + ripple from the box itself
|
||||
await sleep(220);
|
||||
// PHASE 3 — let the user read "-h" before it fires, then ripple from the box
|
||||
await sleep(850);
|
||||
const boxRect = commandBox.getBoundingClientRect();
|
||||
spawnRipple(boxRect.right - 24, boxRect.top + boxRect.height / 2);
|
||||
|
||||
|
||||
Reference in New Issue
Block a user