Skip to content

Latest commit

 

History

History
59 lines (43 loc) · 2.23 KB

File metadata and controls

59 lines (43 loc) · 2.23 KB

🦄 Unicorn Celebration Easter Egg

Overview

A hidden delightful celebration featuring dancing unicorns on rainbows! Activated via keyboard shortcut.

How It Works

Trigger Condition

Press Ctrl+Shift+U to toggle the unicorn celebration on/off!

What Happens

Visual Effects:

  • 🌈 Rainbow Arcs - Three colorful rainbow arcs appear and fade at different positions
  • 🦄 Dancing Unicorns - Four unicorns dance across the screen from left to right
  • ✨ Sparkles - Eight sparkles float and twinkle around the screen
  • 🎉 Celebration Message - "PERFECT SCORE!" message appears in the center with glowing text

Animation Details:

  • Rainbows: Fade in and out with subtle rotation, displaying red, orange, and yellow bands
  • Unicorns: Travel horizontally across the viewport with bouncing motion
  • Sparkles: Float upward while rotating and scaling
  • Message: Pops in and out with scaling animation and text shadow glow

Technical Implementation

Components:

  • UnicornCelebration.jsx - Main celebration component
  • UnicornCelebration.css - All animations and styling

Logic Flow:

  1. App.jsx adds keyboard event listener for Ctrl+Shift+U
  2. Toggles showUnicorns state on keyboard shortcut
  3. Passes showUnicorns boolean to <UnicornCelebration /> component
  4. Component renders with pointer-events: none so it doesn't block interaction
  5. User can toggle celebration on/off at any time

Mobile Responsiveness

  • Scales down unicorn and sparkle sizes on mobile (< 768px)
  • Adjusts rainbow arc dimensions
  • Reduces message text size for smaller screens

Performance

  • Uses CSS animations (GPU-accelerated)
  • Fixed positioning with high z-index (9999)
  • Pointer events disabled to avoid blocking user interaction
  • Animations loop infinitely while condition is met

How to Activate

  1. Open the SMS customizer app
  2. Press Ctrl+Shift+U on your keyboard
  3. Watch the unicorns dance! 🦄🌈✨
  4. Press Ctrl+Shift+U again to toggle it off

Easter Egg Discovery

This is a hidden feature that users can discover accidentally or share with others. The keyboard shortcut works on any screen of the application, whether you're filling out templates or viewing the success message.