diff --git a/public/css/events.css b/public/css/events.css index 3e035c2..4e132a9 100644 --- a/public/css/events.css +++ b/public/css/events.css @@ -66,14 +66,16 @@ #event-detail-popup { background: #1e1a14; border: 1px solid rgba(255, 200, 80, 0.3); - border-radius: 6px; - padding: 12px; - min-width: 140px; - max-width: 210px; - width: 45%; - box-shadow: 0 4px 20px rgba(0, 0, 0, 0.7); + border-radius: 12px; + padding: 24px; + min-width: 280px; + max-width: 420px; + width: 90%; + box-shadow: 0 8px 40px rgba(0, 0, 0, 0.7); position: relative; animation: eventDetailIn 0.18s ease; + transform: scale(0.5); + transform-origin: center center; } @keyframes eventDetailIn { @@ -83,12 +85,12 @@ #event-detail-popup .edp-close { position: absolute; - top: 5px; - right: 6px; + top: 10px; + right: 12px; background: none; border: none; color: #888; - font-size: 9px; + font-size: 18px; cursor: pointer; line-height: 1; transition: color 0.1s; @@ -100,23 +102,23 @@ #event-detail-popup .edp-img { display: block; - margin: 0 auto 7px; - width: 40px; - height: 40px; + margin: 0 auto 14px; + width: 80px; + height: 80px; object-fit: contain; image-rendering: pixelated; } #event-detail-popup .edp-title { text-align: center; - font-size: 8px; + font-size: 15px; font-weight: bold; color: #f5c842; - margin-bottom: 5px; + margin-bottom: 10px; } #event-detail-popup .edp-body { - font-size: 7px; + font-size: 13px; color: #cccccc; line-height: 1.7; text-align: center;