Night Grid cyberpunk style guide
Spec, stylesheet, glitch script, Claude Code skill and the design canvas source. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
commit
94832d861b
8 files changed
+845
No files matched your search
@@ -0,0 +1,15 @@
|
||||
// Night Grid: glitch one random .ng-glitch element every 6–14s (~10s average).
|
||||
(() => {
|
||||
if (matchMedia('(prefers-reduced-motion: reduce)').matches) return;
|
||||
const next = () => setTimeout(tick, 6000 + Math.random() * 8000);
|
||||
const tick = () => {
|
||||
const els = document.querySelectorAll('.ng-glitch');
|
||||
const el = els[Math.floor(Math.random() * els.length)];
|
||||
if (el) {
|
||||
el.classList.add('is-glitching');
|
||||
el.addEventListener('animationend', () => el.classList.remove('is-glitching'), { once: true });
|
||||
}
|
||||
next();
|
||||
};
|
||||
next();
|
||||
})();
|
||||
Reference in new issue
Block a user