https://forestdental.org/assets/before-after.index-DghBKDxL.js

1import{r as e,t}from"./jsx-runtime-DGeXAQPT.js";import{t as n}from"./react-vt4WmSOl.js";import{n as r}from"./createServerFn-Bups_lUA.js";import{s as i,t as a}from"./Footer-B97zMXdo.js";import{a as o,g as s,r as c,t as l}from"./typography-DkJ_DhvR.js";import{t as u}from"./CaseModal-B1c2kGSh.js";import{r as d,t as f}from"./cases-K9LYWaxH.js";var p=e(n()),m=t();function h(){let[e,t]=(0,p.useState)(`all`),[n,s]=(0,p.useState)(null),h=(0,p.useMemo)(()=>{let e=new Set;return f.forEach(t=>t.treatments.forEach(t=>e.add(t))),Array.from(e)},[]),_=e===`all`?f:f.filter(t=>t.treatments.includes(e));return(0,m.jsxs)(`div`,{className:`min-h-screen bg-paper`,children:[(0,m.jsx)(i,{}),(0,m.jsxs)(`main`,{className:`mx-auto max-w-6xl px-6 pt-24 pb-8 md:pt-32 md:pb-10`,children:[(0,m.jsxs)(`div`,{className:`max-w-2xl`,children:[(0,m.jsx)(c,{className:`text-forest`,children:`Our Work`}),(0,m.jsx)(o,{className:`mt-3`,children:`Before & After`}),(0,m.jsx)(l,{className:`mt-6 text-foreground/80`,children:`Real results from patients treated at Forest Dental Blackwood. Every case is different — book a consultation to find out what's possible for your smile.`})]}),(0,m.jsxs)(`div`,{className:`mt-10 flex flex-wrap gap-2`,children:[(0,m.jsxs)(g,{active:e===`all`,onClick:()=>t(`all`),children:[`All (`,f.length,`)`]}),h.map(n=>{let r=f.filter(e=>e.treatments.includes(n)).length;return(0,m.jsxs)(g,{active:e===n,onClick:()=>t(n),children:[d(n),` (`,r,`)`]},n)})]}),(0,m.jsx)(`div`,{className:`mt-10 grid gap-8 md:grid-cols-2`,children:_.map(e=>(0,m.jsxs)(`article`,{className:`overflow-hidden rounded-2xl bg-white shadow-sm ring-1 ring-black/5 transition hover:shadow-md`,children:[(0,m.jsxs)(`button`,{type:`button`,onClick:()=>s(e),className:`group block w-full text-left`,children:[(0,m.jsxs)(`div`,{className:`grid grid-cols-2`,children:[(0,m.jsxs)(`div`,{className:`relative aspect-[4/3] overflow-hidden bg-gradient-to-br from-slate/40 to-anchor/30`,children:[e.beforeImage&&(0,m.jsx)(`img`,{src:e.beforeImage,loading:`lazy`,decoding:`async`,alt:`Before ${e.title.toLowerCase()} — Forest Dental Blackwood`,style:{transform:`scale(1.18)`,transformOrigin:`50% 100%`,...e.beforeImageStyle},className:`absolute inset-0 h-full w-full object-cover object-center transition duration-500 group-hover:scale-[1.22]`}),(0,m.jsx)(`span`,{className:`absolute left-3 top-3 z-10 rounded-full bg-anchor/80 px-2.5 py-1 text-[10px] uppercase tracking-[0.15em] text-paper`,children:`Before`})]}),(0,m.jsxs)(`div`,{className:`relative aspect-[4/3] overflow-hidden bg-gradient-to-br from-paper to-clay/40`,children:[e.afterImage&&(0,m.jsx)(`img`,{src:e.afterImage,loading:`lazy`,decoding:`async`,alt:`After ${e.title.toLowerCase()} — Forest Dental Blackwood`,style:{transform:`scale(1.18)`,transformOrigin:`50% 100%`,...e.afterImageStyle},className:`absolute inset-0 h-full w-full object-cover object-center transition duration-500 group-hover:scale-[1.22]`}),(0,m.jsx)(`span`,{className:`absolute left-3 top-3 z-10 rounded-full bg-forest px-2.5 py-1 text-[10px] uppercase tracking-[0.15em] text-paper`,children:`After`})]})]}),(0,m.jsxs)(`div`,{className:`p-6`,children:[(0,m.jsx)(c,{className:`text-forest`,children:e.duration}),(0,m.jsx)(`h2`,{className:`mt-1 font-display text-2xl text-anchor group-hover:underline underline-offset-4`,children:e.title}),(0,m.jsx)(`p`,{className:`mt-2 text-sm text-anchor/70`,children:e.summary})]})]}),(0,m.jsx)(`div`,{className:`px-6 pb-6 flex flex-wrap gap-1.5`,children:e.treatments.map(e=>(0,m.jsx)(r,{to:`/services/$slug`,params:{slug:e},className:`rounded-full border border-anchor/15 bg-anchor/[0.03] px-2.5 py-1 text-[11px] font-medium text-anchor/70 transition hover:border-anchor/40 hover:text-anchor`,children:d(e)},e))})]},e.id))}),_.length===0&&(0,m.jsx)(`div`,{className:`mt-16 rounded-2xl border border-dashed border-anchor/20 bg-white/50 p-10 text-center`,children:(0,m.jsx)(`p`,{className:`text-sm text-anchor/70`,children:`No cases tagged to this treatment yet — check back soon.`})})]}),(0,m.jsx)(a,{}),(0,m.jsx)(u,{caseData:n,onClose:()=>s(null)})]})}function g({active:e,onClick:t,children:n}){return(0,m.jsx)(`button`,{type:`button`,onClick:t,className:s(`rounded-full border px-4 py-1.5 text-[13px] font-medium transition`,e?`border-anchor bg-anchor text-paper`:`border-anchor/20 bg-white/60 text-anchor/70 hover:border-anchor/40 hover:text-anchor`),children:n})}export{h as component};