/* issues-dashboard.css — 현황판 페이지 전용 스타일 */ /* 대시보드 페이지는 @keyframes 기반 애니메이션 사용 (공통 CSS와 다른 방식) */ .fade-in { opacity: 0; animation: fadeIn 0.5s ease-in forwards; } @keyframes fadeIn { to { opacity: 1; } } .header-fade-in { opacity: 0; animation: headerFadeIn 0.6s ease-out forwards; } @keyframes headerFadeIn { to { opacity: 1; transform: translateY(0); } from { transform: translateY(-10px); } } .content-fade-in { opacity: 0; animation: contentFadeIn 0.7s ease-out 0.2s forwards; } @keyframes contentFadeIn { to { opacity: 1; transform: translateY(0); } from { transform: translateY(20px); } } /* 대시보드 카드 스타일 */ .dashboard-card { transition: all 0.2s ease; background: #ffffff; border-left: 4px solid #64748b; } .dashboard-card:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08); } /* 이슈 카드 스타일 (대시보드 전용 오버라이드) */ .issue-card { transition: all 0.2s ease; border-left: 4px solid transparent; background: #ffffff; } .issue-card:hover { transform: translateY(-2px); border-left-color: #475569; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08); } .issue-card label { font-weight: 600; color: #374151; } .issue-card .bg-gray-50 { background-color: #f9fafb; border: 1px solid #e5e7eb; transition: all 0.2s ease; } .issue-card .bg-gray-50:hover { background-color: #f3f4f6; } .issue-card .fas.fa-image:hover { transform: scale(1.2); color: #3b82f6; } /* 진행 중 애니메이션 */ @keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } } .animate-pulse { animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; } /* 반응형 그리드 */ .dashboard-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.5rem; }