Site Builder

Editing: see.html

writable 0666

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Promptinator • HUD Menu Demo</title>

/* ------------- FIXED HUD MENU BLOCK ------------- */
.t800-menu{
  position:fixed;           /* stays in top‑right on scroll */
  top:20px; right:20px;
  width:175px;
  background:#000;          /* own black panel */
  padding:10px 8px;
  border:1px solid #600;    /* faint border for definition */
  box-shadow:0 0 10px #d00;
  z-index:9999;
}

/* ----- Menu buttons ----- */
.t800-menu nav{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin-bottom:12px;
}
.t800-menu a{
  display:block;
  width:40px; height:40px;          /* perfect square */
  background:#ff0000;
  border:1px solid #d00;
  transition:background .2s, box-shadow .2s;
  text-decoration:none;
}
.t800-menu a:hover,
.t800-menu a:focus{
  background:#cc0000;
  box-shadow:0 0 6px #f40;
  outline:none;
}

/* ----- Scrolling / typing diagnostics ----- */
.scan-window{
  height:120px;                 /* fits about six lines */
  overflow:hidden;
  border-top:1px solid #400;
  padding-top:6px;
  line-height:1.1em;
  font-size:12px;
  color:#ff4444;
  background:#000;
  white-space:pre-wrap;
}

/* Optional caret effect (flashing underscore) */
.caret::after{
  content:"_";
  animation:blink 1s steps(2,start) infinite;
}
@keyframes blink{50%{opacity:0}}
</style>
</head>

<body>

<div class="t800-menu" role="navigation" aria-label="Promptinator quick menu">

<nav>
    <a href="#link1" aria-label="Menu 1"></a>
    <a href="#link2" aria-label="Menu 2"></a>

</nav>

<div id="scan" class="scan-window"></div>

</div>

const messages = [
  '>> INITIALIZING QUANTUM CORE',
  '>> LOCATING TARGET …',
  '>> TARGET ACQUIRED [ID: P‑N8R]',
  '>> ENGAGING LEXICAL MATRIX',
  '>> COMPILING PROMPT SEQUENCE',
  '>> EXECUTION COMPLETE',
  '>> AWAITING INPUT'
];

let line     = '';      // current line being typed
let msgIndex = 0;       // which message in the array
let charPos  = 0;       // which character within the message

function typeLoop(){
  // If the line is complete, wait briefly then start next one
  if(charPos === messages[msgIndex].length){
    scanEl.textContent += '\n';           // commit line
    msgIndex  = (msgIndex + 1) % messages.length;
    charPos   = 0;
    line      = '';
    // Keep log window to ~6 lines
    const lines = scanEl.textContent.trim().split('\n');
    if(lines.length > 6){
      scanEl.textContent = lines.slice(-6).join('\n') + '\n';
    }
    setTimeout(typeLoop, 500);            // pause before next
    return;
  }

// Add next character
  line += messages[msgIndex][charPos++];
  // Rewrite current display (remove caret, add new line w/ caret)
  const cleaned = scanEl.textContent.replace(/_?$/, ''); // strip old caret
  scanEl.textContent = cleaned + line;
  scanEl.classList.add('caret');

setTimeout(typeLoop, 40);               // typing speed (ms)
}

typeLoop();   // kick it off
</script>
</body>
</html>

Site Builder

Editing: see.html

Site Builder