diff --git a/src/components/AddTransactionButton.tsx b/src/components/AddTransactionButton.tsx index ac266e2..aebb027 100644 --- a/src/components/AddTransactionButton.tsx +++ b/src/components/AddTransactionButton.tsx @@ -138,15 +138,15 @@ const AddTransactionButton = () => { <>
diff --git a/src/index.css b/src/index.css index b23fdf5..6b4e9a2 100644 --- a/src/index.css +++ b/src/index.css @@ -1,4 +1,3 @@ - @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap'); @tailwind base; @@ -203,6 +202,59 @@ @apply w-full mx-auto; } } + + /* 추가 애니메이션 정의 */ + @keyframes pulse-subtle { + 0%, 100% { + transform: scale(1); + } + 50% { + transform: scale(1.05); + } + } + + @keyframes bounce-gentle { + 0%, 100% { + transform: translateY(0); + } + 50% { + transform: translateY(-5px); + } + } + + @keyframes spin-slow { + from { + transform: rotate(0deg); + } + to { + transform: rotate(360deg); + } + } + + .animate-pulse-subtle { + animation: pulse-subtle 2s infinite ease-in-out; + } + + .animate-bounce-gentle { + animation: bounce-gentle 1.5s infinite ease-in-out; + } + + .animate-spin-slow { + animation: spin-slow 6s linear infinite; + } + + @keyframes fade-in { + from { + opacity: 0; + } + to { + opacity: 1; + } + } + + .animate-fade-in { + animation: fade-in 0.5s ease-in-out; + } } /* iOS 전용 스타일 */ @@ -221,4 +273,3 @@ .font-inter { font-family: 'Inter', sans-serif; } -