From 14899dea9ade7cc7eda73b4621e87fd64783606e Mon Sep 17 00:00:00 2001 From: Austin Witherow Date: Mon, 25 May 2026 19:32:41 +0000 Subject: [PATCH 1/2] design: make ear piercing local pages scannable --- .../near/[areaSlug]/page.tsx | 225 +++++++++++------- src/components/service-area-directions.tsx | 37 +-- 2 files changed, 160 insertions(+), 102 deletions(-) diff --git a/src/app/procedures/blomdahl-ear-piercing/near/[areaSlug]/page.tsx b/src/app/procedures/blomdahl-ear-piercing/near/[areaSlug]/page.tsx index 995900b..a0a5677 100644 --- a/src/app/procedures/blomdahl-ear-piercing/near/[areaSlug]/page.tsx +++ b/src/app/procedures/blomdahl-ear-piercing/near/[areaSlug]/page.tsx @@ -63,6 +63,20 @@ export function generateMetadata({ params }: Params): Metadata { }); } +function ScanItem({ label, children }: { label: string; children: React.ReactNode }) { + return ( +
  • + + ✓ + +
    +

    {label}

    +

    {children}

    +
    +
    • + ); +} + export default function EarPiercingAreaPage({ params }: Params) { const area = getPublishedEarPiercingAreaBySlug(params.areaSlug); if (!area || !procedure) return notFound(); @@ -72,9 +86,20 @@ export default function EarPiercingAreaPage({ params }: Params) { const relatedAreas = getRelatedEarPiercingAreas(area); const headline = getAreaHeadline(area); const eyebrow = getAreaEyebrow(area); + const visitFit = area.parentIntent ? "Children, teens, and sensitive ears" : "Adults, re-piercing, and sensitive ears"; + const trustCards = [ + ["Sterile disposable system", "Blomdahl uses sterile disposable piercing cassettes designed to reduce cross-contamination risk."], + ["Hypoallergenic jewelry", "Medical Plastic and Medical Grade Titanium options are available for sensitive skin and nickel concerns."], + [ + "Calm family visit", + area.parentIntent + ? "Parents can ask questions, review aftercare, and avoid a rushed mall setting." + : "Appointments are planned around comfort, placement, and aftercare.", + ], + ]; return ( -
    +
    -
    -

    {eyebrow}

    -

    {headline}

    -

    - {area.localIntro} Williamsburg Med Spa offers Blomdahl sterile ear piercing with hypoallergenic starter jewelry{" "} - {area.distanceNote} for families and adults who want an appointment-based alternative to retail piercing. -

    -
    - - +
    +
    +

    {eyebrow}

    +

    {headline}

    +

    + {area.localIntro} Williamsburg Med Spa offers Blomdahl sterile ear piercing with hypoallergenic starter jewelry {area.distanceNote} for families and adults who want an appointment-based alternative to retail piercing. +

    +
    + + +
    +
    -
    - {[ - ["Sterile disposable system", "Blomdahl uses sterile disposable piercing cassettes designed to reduce cross-contamination risk."], - ["Hypoallergenic jewelry", "Medical Plastic and Medical Grade Titanium options are available for sensitive skin and nickel concerns."], - ["Calm family visit", area.parentIntent ? "Parents can ask questions, review aftercare, and avoid a rushed mall setting." : "Appointments are planned around comfort, placement, and aftercare."], - ].map(([title, body]) => ( - - +
    + {trustCards.map(([title, body]) => ( + + {title} - {body} + {body} ))}
    -
    -

    Why {area.name} families choose a medical setting

    -

    - For {area.name} patients, Williamsburg Med Spa is {area.earPiercingAngle}. {area.whyMedicalSetting} -

    -

    - {area.parentConcern} This page is intended for people comparing options for children's first piercings, - sensitive skin, re-piercing, or a more controlled piercing experience near {area.countyOrContext}. -

    +
    +
    +

    Why medical-grade piercing

    +

    Why {area.name} families choose a medical setting

    +

    + For {area.name} patients, Williamsburg Med Spa is {area.earPiercingAngle}. {area.whyMedicalSetting} +

    +
    +
      + Appointments leave room for placement, questions, and comfort. + Hypoallergenic starter jewelry helps families compare safer material choices. + {area.pediatricAngle || "Parent questions, child comfort, and aftercare are part of the process."} + Aftercare is reviewed before patients leave the clinic. +
    -
    +
    A pediatric-aware Blomdahl provider near {area.name} - +

    {area.providerTrustNote || providerTrustNote}

    -

    {area.pediatricAngle || "The visit is appointment-based, so parent questions, child comfort, and aftercare are part of the process."}

    +

    {area.parentConcern}

         Clean materials and starter jewelry - -

    {area.blomdahlAngle || blomdahlTrustNote}

    -

    {area.materialNote || materialTrustNote}

    -

    {area.aftercareNote || aftercareTrustNote}

    + +
      +
    • Sterile cassettes: {area.blomdahlAngle || blomdahlTrustNote}
      • +
    • Material options: {area.materialNote || materialTrustNote}
      • +
    • Aftercare: {area.aftercareNote || aftercareTrustNote}
      • +
    -
    -

    Planning your visit from {area.name}

    -

    {area.routeNote}

    -

    - {area.visitLogistics} The clinic is in Williamsburg, VA. -

    -
    - {area.nearbyNeighborhoods.map((neighborhood) => ( - - {neighborhood} - - ))} +
    +
    +
    +

    Visit planning

    +

    Planning your visit from {area.name}

    +
    +
    +

    {area.routeNote}

    +

    {area.visitLogistics} The clinic is in Williamsburg, VA.

    +
    + {area.nearbyNeighborhoods.map((neighborhood) => ( + + {neighborhood} + + ))} +
    +
    -
    -

    Questions from {area.name} families

    - - {area.faqs.map(({ question, answer }) => ( - - {question} - {answer} - - ))} - -
    - -
    -

    Nearby service areas

    -
    - {relatedAreas.map((item) => ( - - {item.name} - - ))} +
    +
    +

    Questions from {area.name} families

    + + {area.faqs.map(({ question, answer }) => ( + + {question} + {answer} + + ))} +
    +
    -
    -

    Plan your visit

    -

    - Book a consultation request and mention ear piercing, your preferred timing, and whether the visit is for a - child, teen, or adult. -

    - +
    +
    +
    +

    Plan your visit

    +

    + Book a consultation request and mention ear piercing, your preferred timing, and whether the visit is for a child, teen, or adult. +

    +
    + +
    ); diff --git a/src/components/service-area-directions.tsx b/src/components/service-area-directions.tsx index e01d8a9..7513423 100644 --- a/src/components/service-area-directions.tsx +++ b/src/components/service-area-directions.tsx @@ -29,34 +29,37 @@ export default function ServiceAreaDirections({ area, consultHref }: ServiceArea )}&destination=${encodeURIComponent(clinic.address)}`; return ( -
    -
    +
    +
    -

    Directions from {area.name}

    -

    - Use {area.routeOrigin.label} as a practical starting point for planning the trip to {clinic.label}.{" "} - {area.routeSummary} +

    Directions

    +

    Directions from {area.name}

    +

    + Use {area.routeOrigin.label} as a practical starting point for planning the trip to {clinic.label}. {area.routeSummary}

    -
      - {area.routeHighlights.map((highlight) => ( -
    • - {highlight} +
        + {area.routeHighlights.map((highlight, index) => ( +
      1. + + {index + 1} + + {highlight}
        2. ))} -
    +
    @@ -67,7 +70,7 @@ export default function ServiceAreaDirections({ area, consultHref }: ServiceArea longitude={clinic.longitude} originLatitude={area.routeOrigin.latitude} originLongitude={area.routeOrigin.longitude} - className="h-72 md:h-full min-h-72" + className="h-72 min-h-72 overflow-hidden rounded-2xl border border-base-300/80 md:h-full" zoomPadding={0.035} />
    From 6a202184bd09f7579801bd22d8b6657adcba22d4 Mon Sep 17 00:00:00 2001 From: Austin Witherow Date: Mon, 25 May 2026 19:34:46 +0000 Subject: [PATCH 2/2] fix: keep directions map from overpowering local pages --- src/components/service-area-directions.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/service-area-directions.tsx b/src/components/service-area-directions.tsx index 7513423..57589e0 100644 --- a/src/components/service-area-directions.tsx +++ b/src/components/service-area-directions.tsx @@ -70,7 +70,7 @@ export default function ServiceAreaDirections({ area, consultHref }: ServiceArea longitude={clinic.longitude} originLatitude={area.routeOrigin.latitude} originLongitude={area.routeOrigin.longitude} - className="h-72 min-h-72 overflow-hidden rounded-2xl border border-base-300/80 md:h-full" + className="h-72 min-h-72 overflow-hidden rounded-2xl border border-base-300/80 md:h-96" zoomPadding={0.035} />