diff --git a/assets/frontend.css b/assets/frontend.css index 8f0f9e1..706a58b 100644 --- a/assets/frontend.css +++ b/assets/frontend.css @@ -126,81 +126,104 @@ .kc-workshop-card { box-sizing: border-box; min-width: 0; + background: #ffffff; + border-radius: 18px; + overflow: hidden; + border: 1.5px solid #e3f6ee; + box-shadow: 0 4px 24px 0 #2da66a1a; + display: flex; + flex-direction: column; + height: 100%; + transition: box-shadow 0.2s, border 0.2s, transform 0.15s; + margin-bottom: 10px; } - -.kc-workshop-card .title{ - background: linear-gradient(90deg, #e8f9ef 60%, #f6fffa 100%); +.kc-workshop-card:hover { + box-shadow: 0 8px 32px 0 #2da66a33; + border: 1.5px solid #2da66a; + transform: translateY(-2px) scale(1.012); +} +.kc-workshop-card .title { + background: linear-gradient(90deg, #e8f9ef 0%, #c6f7e2 100%); display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; - padding: 18px 18px 10px 18px; - font-weight: 800; + padding: 22px 22px 12px 22px; + font-weight: 900; color: #176c4a; - font-size: 1.18rem; + font-size: 1.28rem; letter-spacing: 0.2px; border-bottom: 1px solid #e3f6ee; - border-radius: 12px 12px 0 0; + border-radius: 18px 18px 0 0; box-shadow: 0 2px 8px #2da66a0a; margin-bottom: 0; - min-height: 56px; + min-height: 64px; } -.kc-workshop-card .title strong{ - font-size: 1.18em; +.kc-workshop-card .title strong { + font-size: 1.22em; font-weight: 900; color: #176c4a; margin-bottom: 2px; display: block; + letter-spacing: 0.01em; } -.kc-workshop-card .title .teamers{ - font-size: 0.98em; +.kc-workshop-card .title .teamers { + font-size: 1.01em; font-weight: 600; color: #2da66a; margin-bottom: 2px; margin-top: 2px; display: block; + letter-spacing: 0.01em; } -.kc-workshop-card .title .count{ +.kc-workshop-card .title .count { color: #6b6b6b; font-weight: 600; - font-size: 0.98em; + font-size: 1.01em; margin-left: 0; - margin-top: 2px; + margin-top: 6px; display: block; + letter-spacing: 0.01em; } -.kc-workshop-card .content{padding:12px 18px 18px 18px;} .kc-participants { + margin-top: 10px; + margin-bottom: 8px; display: flex; flex-wrap: wrap; - gap: 6px; - font-size: 0.95rem; - color: #2b2b2b; + gap: 8px 12px; } .kc-participant { - padding: 7px 16px; - border-radius: 16px; + padding: 8px 18px; + border-radius: 18px; background: linear-gradient(90deg, #f6fffa 60%, #e8f9ef 100%); white-space: nowrap; display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; - font-size: 1.08em; + font-size: 1.09em; margin-bottom: 6px; - margin-right: 8px; - box-shadow: 0 2px 8px #2da66a0d; - border: 1px solid #e3f6ee; + margin-right: 0; + box-shadow: 0 2px 12px #2da66a0d; + border: 1.5px solid #e3f6ee; color: #176c4a; font-family: 'Segoe UI', Arial, sans-serif; letter-spacing: 0.01em; - transition: background 0.2s, color 0.2s; + transition: background 0.2s, color 0.2s, box-shadow 0.2s, border 0.2s; + cursor: pointer; +} +.kc-participant:hover { + background: #e8f9ef; + color: #0d5947; + border: 1.5px solid #2da66a; + box-shadow: 0 4px 16px #2da66a22; } .kc-participant.me { background: linear-gradient(90deg, #2da66a 60%, #176c4a 100%); color: #fff; font-weight: bold; border: 1.5px solid #176c4a; - box-shadow: 0 2px 8px #2da66a33; + box-shadow: 0 2px 12px #2da66a33; } .kc-notassigned{background:#fff6f6;border:1px solid #ffd2d2;padding:12px;border-radius:10px;margin-top:12px;} @media(max-width:700px){ .kc-participants{grid-template-columns:1fr;} }