feat: replace literal decorations with AbstractBore and AbstractTrench
Former-commit-id: 4f7c5fcc7203aa4a36aabd8ffc13cf9f28a0f77a
This commit is contained in:
@@ -4,7 +4,6 @@ import React from 'react';
|
||||
import { motion, AnimatePresence } from 'framer-motion';
|
||||
import { useTransition } from './TransitionProvider';
|
||||
import Image from 'next/image';
|
||||
import { DrillBitSpinner } from '@/components/ui/decorations/DrillBitSpinner';
|
||||
|
||||
export function PageTransitionShutter() {
|
||||
const { isTransitioning, transitionMessage } = useTransition();
|
||||
@@ -159,28 +158,19 @@ export function PageTransitionShutter() {
|
||||
)}
|
||||
</AnimatePresence>
|
||||
|
||||
{/* ── DrillBit loading indicator (replaces three dots) ── */}
|
||||
{/* ── Abstract horizontal energy pulse (Loader) ── */}
|
||||
<motion.div
|
||||
className="mt-8 relative flex items-center justify-center"
|
||||
initial={{ opacity: 0, scale: 0.5 }}
|
||||
animate={{ opacity: 1, scale: 1 }}
|
||||
exit={{ opacity: 0, scale: 0.5 }}
|
||||
className="mt-12 relative flex items-center justify-center w-48 h-[2px] bg-white/10 overflow-hidden rounded-full"
|
||||
initial={{ opacity: 0, scaleX: 0 }}
|
||||
animate={{ opacity: 1, scaleX: 1 }}
|
||||
exit={{ opacity: 0, scaleX: 0 }}
|
||||
transition={{ duration: 0.5, delay: 0.3, ease: [0.22, 1, 0.36, 1] }}
|
||||
>
|
||||
{/* Outer pulsing ring */}
|
||||
<motion.div
|
||||
className="absolute rounded-full border border-primary/30"
|
||||
animate={{ scale: [1, 1.8, 1], opacity: [0.5, 0, 0.5] }}
|
||||
transition={{ duration: 2.5, repeat: Infinity, ease: 'easeInOut' }}
|
||||
style={{ width: 120, height: 120 }}
|
||||
className="absolute left-0 top-0 bottom-0 bg-primary w-1/3 rounded-full blur-[1px]"
|
||||
animate={{ x: ['-100%', '300%'] }}
|
||||
transition={{ duration: 1.5, repeat: Infinity, ease: "easeInOut" }}
|
||||
/>
|
||||
<motion.div
|
||||
className="absolute rounded-full border border-primary/15"
|
||||
animate={{ scale: [1, 2.4, 1], opacity: [0.3, 0, 0.3] }}
|
||||
transition={{ duration: 2.5, repeat: Infinity, ease: 'easeInOut', delay: 0.4 }}
|
||||
style={{ width: 120, height: 120 }}
|
||||
/>
|
||||
<DrillBitSpinner size={80} duration={3} glow />
|
||||
</motion.div>
|
||||
|
||||
{/* Background bore arc (full width, bottom) */}
|
||||
|
||||
Reference in New Issue
Block a user