MCP/mcltspice
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add animated rainbow gradient to Outer Limits easter egg text

Browse Source 
Opening narration cycles through a 9-stop gradient (red → amber →
yellow → green → teal → blue → violet → pink → red) at 6s per
loop. Closing narration stays teal for visual hierarchy.
This commit is contained in:
Ryan Malloy 2026-02-13 07:03:36 -07:00
parent 29fc250c73
commit 80a01a7326
1 changed files with 17 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
docs/src/styles/oscilloscope.css
View File

@ -381,10 +381,25 @@
font-family: 'Georgia', 'Times New Roman', serif;
font-size: 0.65rem;
line-height: 1.6;
color: var(--scope-teal);
text-align: center;
text-shadow: 0 0 8px var(--scope-teal-glow);
margin: 0;
/* Animated rainbow gradient text */
background: linear-gradient(
90deg,
#ff6b6b, #ffb347, #ffd93d, #a3ff6b,
#2dd4bf, #6bb5ff, #c084fc, #ff6b9d, #ff6b6b
);
background-size: 300% 100%;
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
animation: scope-rainbow 6s linear infinite;
filter: drop-shadow(0 0 6px rgba(255, 255, 255, 0.15));
}
@keyframes scope-rainbow {
0% { background-position: 0% center; }
100% { background-position: 300% center; }
}
/* Closing narration + plug — fades in after typewriter finishes */