Frontend: - Replace Next.js with Vite + React + TypeScript - Add new component architecture (app-shell, sidebar, dashboard modules) - Implement product modules: FRAME, safety protocols, walkthrough checkin, campus/staff attendance, personality quiz, sign language, classroom timer - Add shadcn/ui component library with Tailwind CSS - Remove legacy generated components, stores, and pages Backend: - Add product migrations: frame_entries, user_progress, safety_quiz_results, walkthrough_checkins, communication_events, personality_quiz_results, campus_attendance_config/summaries, staff_attendance_records, content_catalog - Add corresponding models, services, and routes - Implement cookie-based auth with refresh token rotation - Add content catalog seeder with product content - Migrate to ESLint flat config - Switch from yarn to npm Infrastructure: - Update .gitignore for new tooling - Add project documentation (CLAUDE.md, docs/) - Remove deprecated config files and yarn.lock Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
27 lines
976 B
TypeScript
27 lines
976 B
TypeScript
export function TimerAnimations() {
|
|
return (
|
|
<style>{`
|
|
@keyframes float {
|
|
0%, 100% { transform: translateY(0) translateX(0); opacity: 0.3; }
|
|
25% { transform: translateY(-30px) translateX(10px); opacity: 0.6; }
|
|
50% { transform: translateY(-15px) translateX(-10px); opacity: 0.4; }
|
|
75% { transform: translateY(-40px) translateX(5px); opacity: 0.5; }
|
|
}
|
|
.animate-float { animation: float 15s ease-in-out infinite; }
|
|
@keyframes pulse-glow {
|
|
0%, 100% { box-shadow: 0 0 20px rgba(139, 92, 246, 0.3); }
|
|
50% { box-shadow: 0 0 60px rgba(139, 92, 246, 0.6); }
|
|
}
|
|
.animate-pulse-glow { animation: pulse-glow 2s ease-in-out infinite; }
|
|
@keyframes shimmer {
|
|
0% { background-position: -200% 0; }
|
|
100% { background-position: 200% 0; }
|
|
}
|
|
.animate-shimmer {
|
|
background-size: 200% 100%;
|
|
animation: shimmer 3s linear infinite;
|
|
}
|
|
`}</style>
|
|
);
|
|
}
|