syncable-cli 0.37.1

A Rust-based CLI that analyzes code repositories and generates Infrastructure as Code configurations
Documentation
/**
 * BackgroundEffects Component
 * Creates the ambient glassmorphic background with animated orbs and grid pattern
 */
export function BackgroundEffects() {
  return (
    <div className="absolute inset-0 pointer-events-none overflow-hidden">
      {/* Ambient Orb - Cyan (top left) */}
      <div
        className="absolute -top-48 -left-48 w-96 h-96 bg-cyan-500/10 rounded-full blur-3xl animate-slow-pulse"
        aria-hidden="true"
      />

      {/* Ambient Orb - Violet (bottom right) */}
      <div
        className="absolute -bottom-48 -right-48 w-96 h-96 bg-violet-500/10 rounded-full blur-3xl animate-slow-pulse"
        style={{ animationDelay: '4s' }}
        aria-hidden="true"
      />

      {/* Secondary Orb - Teal (center left) */}
      <div
        className="absolute top-1/2 -left-24 w-64 h-64 bg-teal-500/5 rounded-full blur-3xl animate-slow-pulse"
        style={{ animationDelay: '2s' }}
        aria-hidden="true"
      />

      {/* Secondary Orb - Fuchsia (top right) */}
      <div
        className="absolute -top-24 right-1/4 w-48 h-48 bg-fuchsia-500/5 rounded-full blur-3xl animate-slow-pulse"
        style={{ animationDelay: '6s' }}
        aria-hidden="true"
      />

      {/* Grid Pattern Overlay */}
      <div
        className="absolute inset-0 opacity-30"
        style={{
          backgroundImage: `
            linear-gradient(rgba(255, 255, 255, 0.02) 1px, transparent 1px),
            linear-gradient(90deg, rgba(255, 255, 255, 0.02) 1px, transparent 1px)
          `,
          backgroundSize: '60px 60px',
        }}
        aria-hidden="true"
      />

      {/* Radial gradient overlay for depth */}
      <div
        className="absolute inset-0 bg-gradient-to-b from-transparent via-slate-950/50 to-slate-950"
        aria-hidden="true"
      />
    </div>
  )
}