Dev Log

WCAG AA proactive sweep — text precision-blue across 49 files

· Claude Opus 4.7 · Bot
accessibilitywcagcontrastcsssweep

What was done

Proactive sweep to fix the remaining ~100 color: var(--color-precision-blue) text-on-light usages flagged by repeat Lighthouse audits. Earlier turns swapped the obvious offenders reactively page-by-page; this pass closed the rest in two parallel batches.

Bulk sed pattern used:

(^|[^-])color: var\(--color-precision-blue\)

Negative-lookbehind via non-hyphen char ensures color: matches text-color while leaving border-color: and background-color: intact on shared lines.

Files swept (49 total):

Components (2):

  • src/components/Header.astro — nav-link/utility-link hovers, active states (4 swaps)
  • src/components/CountyStatsBlock.astro — stat-number, stats-card-soft a (2)

Dev-IQ section (6):

  • src/pages/dev-iq/index.astro — tile-num, tile-cta (2)
  • src/pages/dev-iq/faqs/index.astro — filter-chip:hover, faq-tag, faq-link (3)
  • src/pages/dev-iq/faqs/feasibility-studies.astro — byline, toc, stat-unit, related (4)
  • src/pages/dev-iq/iq-meet/index.astro — past-tag, past-link, etc. (3)
  • src/pages/dev-iq/iq-meet/ai-in-land-development.astro — schedule-time, host-card, host-link, back-link, hero-host (6)
  • src/pages/dev-iq/land-use-intelligence/index.astro — filter-chip, article-title-link:hover, article-city, article-zig, article-link (5)
  • src/pages/dev-iq/land-use-intelligence/rs4-nampa.astro — byline, stat numbers, related (3)

Services (8):

  • src/pages/services/index.astro — family-content h2 a:hover, family-link (3)
  • src/pages/services/[slug].astro — sub-num, sub-card p (2)
  • src/pages/services/civil-engineering/index.astro — sub-num, sub-link (2)
  • src/pages/services/civil-engineering/feasibility-studies.astro — step-num, stat-block-stats stat-number, etc. (3)
  • src/pages/services/land-planning/index.astro — sub-num, sub-link (2)
  • src/pages/services/master-planned-communities/index.astro — sub-num, sub-link (2)
  • src/pages/services/multifamily-site-design/index.astro — sub-num, sub-link (2)
  • src/pages/services/commercial-industrial-site-design/index.astro — sub-num, sub-link (2)

Projects (1):

  • src/pages/projects/index.astro — filter-chip:hover, project-city, project-link, etc. (3)

About / index (2):

  • src/pages/about/index.astro — mission-num + 1 (2)
  • src/pages/index.astro line 515 — .county-cities a:hover (surgical, 1)

Service-areas hubs (7):

  • src/pages/service-areas/index.astro — county-label, catch-all-text, etc. (4)
  • src/pages/service-areas/{ada,owyhee,blaine,canyon,boise,elmore}-county/index.astro.city-card:hover .city-arrow (6)

Service-areas city pages (23):

  • All info-list > li::before arrow markers across 11 stub cities
  • All canyon-county feature pages (greenleaf, wilder, melba, notus, parma) — stat-value, note-label, .resource:hover (3 each)
  • canyon-county/middleton (.why-card li::before)
  • canyon-county/caldwell (.track-num)
  • canyon-county/nampa (inline link in body copy)
  • ada-county/star (.dual-num, .sh16-tag)
  • ada-county/garden-city (.diff-num)
  • ada-county/eagle (.diff-num)
  • ada-county/kuna (.dc-tag, .timeline-list li::before)

Mixed-context surgical edits (3):

  • src/pages/projects/[slug].astro — phase-num, intel-callout eyebrow, side-card a, back-link (4 swaps); KEPT line 269 .hero-overlay .eyebrow (dark hero)
  • src/pages/service-areas/ada-county/boise/index.astro line 511 — .resource:hover text only; KEPT lines 376, 384 (dark city-hero-card)
  • src/pages/community/westbilt.astro — map-label, planner-name a:hover, link-card a (3); KEPT line 177 .eyebrow-on-dark, KEPT line 270 .contact-card .eyebrow (black bg)

Why

User instruction: “proactive sweep” — get ahead of Lighthouse rather than fixing one element at a time per audit. After four Lighthouse re-tests still surfaced new failing precision-blue text elements, bulk-replace was the right call.

Two-token approach (established earlier): --color-precision-blue (#488CBA, brand spec) for borders/backgrounds/text-on-dark; --color-precision-blue-text (#366E94, AA-compliant) for text-on-light. Sed pattern preserves the first; swaps the second.

Intentional KEEPS (text on dark or large-text exception)

These passed AA at original color and were left alone:

  • src/styles/global.css:217.stat-number (h1-size, large-text 3:1 rule applies)
  • src/components/CityPage.astro:436, 444 — city-hero-card (dark)
  • src/components/Footer.astro:104, 110, 145 — dark footer
  • src/pages/index.astro:619, 628 — intel section dark bg
  • src/pages/community/westbilt.astro:177, 270.eyebrow-on-dark, contact-card (black)
  • src/pages/projects/[slug].astro:269 — hero-overlay eyebrow (dark hero)
  • src/pages/service-areas/ada-county/boise/index.astro:376, 384 — city-hero-card (dark)
  • src/pages/home-test.astro — test page, not in production routes

Files affected

Modified: 49 source files across components, services, dev-iq, projects, about, index, service-areas hubs, service-areas city pages, community.

Created: this devlog entry.

Verification

  • npm run build clean (Pagefind indexed 168 pages, 6885 words)
  • Final grep: only intentional dark-bg/large-text/devlog-comment usages remain
  • Next step for user: re-run Lighthouse against https://prototype.baileyengage.com/ to confirm contrast warnings are cleared
Feedback