Polished animated contact-reveal box (shift/job/talent details)
CI/CD / CI · dotnet build (push) Successful in 3m46s
CI/CD / Deploy · hamkadr (push) Has been cancelled

Replaced the plain "interest recorded" alert with a styled .contact-reveal
card that fades/slides in and lists each channel as its own row (icon +
label + value + action button). Shift/job show facility phone + Bale;
talent shows all its ContactMethods in the same table style.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
soroush.asadi
2026-06-08 11:33:41 +03:30
parent 6b657c7795
commit 234bcd1f88
4 changed files with 67 additions and 23 deletions
+16
View File
@@ -272,6 +272,22 @@ label { font-size: 13px; }
.tag-chip { font-size: 11.5px; font-weight: 600; padding: 3px 9px; border-radius: 999px;
background: var(--primary-soft); color: var(--primary-dark); }
mark { background: #fff3bf; color: inherit; padding: 0 2px; border-radius: 3px; }
/* Animated contact reveal box (shift/job/talent details) */
.contact-reveal { border: 1px solid var(--primary); border-radius: 14px; padding: 14px;
background: var(--primary-soft); animation: revealIn .35s cubic-bezier(.2,.7,.3,1); }
@keyframes revealIn { from { opacity: 0; transform: translateY(-10px) scale(.97); } to { opacity: 1; transform: none; } }
.contact-reveal h4 { margin: 0 0 10px; font-size: 15px; }
.contact-row { display: flex; align-items: center; justify-content: space-between; gap: 10px;
background: var(--surface); border: 1px solid var(--line); border-radius: 10px;
padding: 9px 12px; margin-bottom: 8px; animation: revealIn .4s ease backwards; }
.contact-row:nth-child(2) { animation-delay: .04s; } .contact-row:nth-child(3) { animation-delay: .08s; }
.contact-row:nth-child(4) { animation-delay: .12s; } .contact-row:nth-child(5) { animation-delay: .16s; }
.contact-row:last-child { margin-bottom: 0; }
.contact-row .c-meta { display: flex; flex-direction: column; min-width: 0; }
.contact-row .c-type { font-size: 12px; color: var(--muted); }
.contact-row .c-val { font-weight: 700; overflow: hidden; text-overflow: ellipsis; }
.contact-row .btn { flex: 0 0 auto; padding: 6px 14px; }
.badge-gender { background: #f3eefb; color: #6b3fa0; }
/* ---------- Filters layout ---------- */