diff --git a/assets/javascript/emoji-footprint.js b/assets/javascript/emoji-footprint.js index 238377b..8e29ae0 100644 --- a/assets/javascript/emoji-footprint.js +++ b/assets/javascript/emoji-footprint.js @@ -1,6 +1,11 @@ // Sparkle effect on mouse move document.addEventListener('mousemove', function (e) { - const emojis = ['✹', '💖', '🌟', '💅', '🩄', '🎉', '🌈']; + let emojis = ['✹', '💖', '🌟', '💅', '🩄', '🎉', '🌈']; + const htmlElement = document.documentElement; + + if (htmlElement.getAttribute('data-website-mode') === 'mono') { + emojis = ['🩇', 'đŸŠč', '🌙', '⚰', 'đŸ•Żïž']; + } const sparkle = document.createElement('div'); sparkle.className = 'emoji-footprint'; sparkle.textContent = emojis[Math.floor(Math.random() * emojis.length)]; diff --git a/assets/styles/modes.css b/assets/styles/modes.css index 39dd41e..f43d9d3 100644 --- a/assets/styles/modes.css +++ b/assets/styles/modes.css @@ -307,6 +307,10 @@ animation: discoFlash 0.3s infinite, wiggle 0.2s infinite; } +[data-website-mode="mono"] body { + filter: grayscale(1); +} + /* Enhanced mode styles (for future use) */ [data-website-mode="enhanced"] .btn { background: linear-gradient(45deg, var(--bs-pink), var(--bs-purple), var(--bs-cyan), var(--bs-yellow), var(--bs-green), var(--bs-orange), var(--bs-red)); diff --git a/templates/base.html.twig b/templates/base.html.twig index 3a14f40..75fae8c 100644 --- a/templates/base.html.twig +++ b/templates/base.html.twig @@ -26,6 +26,10 @@
+ +