Replace the glassy hero treatment with a terminal and TUI vocabulary while keeping the layout minimal: - Switch the type stack to JetBrains Mono and flatten every surface: hairline borders, square corners, no blur or glow, and a faint graph-paper grid in place of the radial gradients. - Rebuild the home hero as a terminal window whose output is typed in on load; the old mouse-parallax glow script becomes that typing sequence, and it no-ops under prefers-reduced-motion. - Give the projects, about, and entry panels title bars, and render cards with a metadata strip, status dot, ISO date, and prompt-style links. - Hide the inline nav behind the hamburger on narrow screens; the old rule was outranked by the #menu id selector and never applied. - Add an SVG favicon, which also clears the only 404 on the site. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
63 lines
1.5 KiB
JavaScript
63 lines
1.5 KiB
JavaScript
(function() {
|
|
const stream = document.querySelector(".term__stream");
|
|
|
|
if (!stream) {
|
|
return;
|
|
}
|
|
|
|
const prefersReducedMotion = window.matchMedia("(prefers-reduced-motion: reduce)").matches;
|
|
|
|
if (prefersReducedMotion) {
|
|
return;
|
|
}
|
|
|
|
const CHAR_DELAY = 18;
|
|
const AFTER_COMMAND_DELAY = 90;
|
|
const AFTER_OUTPUT_DELAY = 130;
|
|
|
|
// Build the playback script before hiding anything, so a thrown error here
|
|
// leaves the page in its fully rendered state.
|
|
const steps = Array.from(stream.children).map((element) => ({
|
|
element,
|
|
isCommand: element.classList.contains("cmd"),
|
|
text: element.textContent
|
|
}));
|
|
|
|
if (!steps.some((step) => step.isCommand)) {
|
|
return;
|
|
}
|
|
|
|
steps.forEach((step) => {
|
|
if (step.isCommand) {
|
|
step.element.textContent = "";
|
|
return;
|
|
}
|
|
|
|
step.element.classList.add("is-typing-hidden");
|
|
});
|
|
|
|
const wait = (ms) => new Promise((resolve) => window.setTimeout(resolve, ms));
|
|
|
|
const typeCommand = async (element, text) => {
|
|
for (let index = 0; index < text.length; index += 1) {
|
|
element.textContent = text.slice(0, index + 1);
|
|
await wait(CHAR_DELAY);
|
|
}
|
|
};
|
|
|
|
const play = async () => {
|
|
for (const step of steps) {
|
|
if (step.isCommand) {
|
|
await typeCommand(step.element, step.text);
|
|
await wait(AFTER_COMMAND_DELAY);
|
|
continue;
|
|
}
|
|
|
|
step.element.classList.remove("is-typing-hidden");
|
|
await wait(AFTER_OUTPUT_DELAY);
|
|
}
|
|
};
|
|
|
|
play();
|
|
})();
|