diff --git a/index.html b/index.html index b1d8dea..d2beb2f 100644 --- a/index.html +++ b/index.html @@ -160,7 +160,15 @@ transform: translateX(-50%); } - #scene2Line { + #scene2Lines { + display: none; + flex-direction: column; + align-items: center; + justify-content: center; + width: 100%; + } + + #scene2Line1 { display: flex; align-items: center; justify-content: center; @@ -172,7 +180,25 @@ text-align: center; } - #scene2Cursor { + #scene2Line2 { + display: none; + align-items: center; + justify-content: center; + font-size: 1.2rem; + line-height: 1.8; + color: #00ff00; + padding: 0 2rem 2rem; + text-align: center; + } + + #scene2Message2 { + color: #00ff00; + font-family: 'Courier New', monospace; + font-size: 1.2rem; + } + + #scene2Cursor, + #scene2Cursor2 { display: none; width: 10px; height: 1.4em; @@ -245,9 +271,15 @@
-
- - +
+
+ + +
+
+ + +
@@ -559,9 +591,13 @@ function loadScene2(sceneElem) { sceneElem.style.display = 'flex'; - const line = document.getElementById('scene2Line'); + const linesContainer = document.getElementById('scene2Lines'); + const line1 = document.getElementById('scene2Line1'); + const line2 = document.getElementById('scene2Line2'); const message = document.getElementById('scene2Message'); + const message2 = document.getElementById('scene2Message2'); const cursor = document.getElementById('scene2Cursor'); + const cursor2 = document.getElementById('scene2Cursor2'); const btn = document.getElementById('whatIsLabBtn'); let opacity = 0; @@ -571,12 +607,16 @@ opacity = 1; clearInterval(fadeIn); - line.style.visibility = 'visible'; + linesContainer.style.display = 'flex'; + line1.style.visibility = 'visible'; blinkCursor(cursor, 5, () => { typeCalmly(message, "...AND THAT AWARENESS HAS LED YOU HERE...", () => { - blinkCursor(cursor, 3, () => { - typeCalmly(message, " TO LAB 484", () => { + cursor.style.display = 'none'; + line2.style.display = 'flex'; + + blinkCursor(cursor2, 3, () => { + typeCalmly(message2, "TO LAB 484", () => { setTimeout(() => { btn.style.visibility = 'visible'; let btnOpacity = 0; @@ -767,11 +807,17 @@ // Scene 2 skip (calm typing) const scene2 = document.getElementById('scene2'); const s2Cursor = document.getElementById('scene2Cursor'); + const s2Cursor2 = document.getElementById('scene2Cursor2'); const s2Message = document.getElementById('scene2Message'); + const s2Message2 = document.getElementById('scene2Message2'); + const s2Line2 = document.getElementById('scene2Line2'); const s2Btn = document.getElementById('whatIsLabBtn'); if (scene2.style.display === 'flex' && s2Btn.style.visibility !== 'visible') { s2Cursor.style.display = 'none'; - s2Message.textContent = '...AND THAT AWARENESS HAS LED YOU HERE... TO LAB 484'; + s2Cursor2.style.display = 'none'; + s2Message.textContent = '...AND THAT AWARENESS HAS LED YOU HERE...'; + s2Line2.style.display = 'flex'; + s2Message2.textContent = 'TO LAB 484'; s2Btn.style.visibility = 'visible'; s2Btn.style.opacity = '1'; s2Btn.style.pointerEvents = 'auto';