[BigSimmo]

User description

Requested by Josh · project thread

Summary

Before: the smallest labels, tags and calendar months were 9 to 11 px. Figures were in the same face as the words. Work tags were coloured pills, Admin marked "date passed" with a diamond and "start renewing" with a triangle, and some rows were faded with transparency. There was no setting for screens in glare.

After: nothing on screen is smaller than 12 px. Counts, day numbers and ring figures are in Geist Mono. Work tags are grey pills whose shape carries the status colour (triangle overdue, filled dot due soon, tick done, dashed ring not recorded), and Admin uses the same shapes. Faded rows take a paler colour instead of transparency. A new Bright light switch in Settings, App preferences, gives solid screens with darker lines and heavier text, in light mode.

These are the shared parts of the Ward Flow design review that Josh approved ("all", 12 Oct). The My Day data-age line and the answer-first heroes follow in a second change once #3479 lands. The Clinical "highlight, don't hide" filter belongs to the Clinical polish thread.

How: the legacy --text-3xs and --text-2xs steps (about 2,000 call sites) now resolve to 12 px, and the work kit's sub-12 px sizes use --text-xs. A new data-dim hook in globals.css replaces three opacity fades. brightLight is an account preference that is normalised like the others, reflected onto <html data-bright> before paint and when it changes, and indexed in Settings search.

Areas touched: App experience, Personal practice, Design system

Verification

• Checks run: npm run test:focused on every changed file found 2 expected failures, and both are fixed: the Admin shape assertion and the preferences round-trip fixture. Rerun: Tests 63 passed (63). tsc --noEmit exit 0. ESLint and Prettier are clean on the changed files. check-type-scale --strict: "no arbitrary text-[px|rem|em] font sizes in src".
• Screenshots: 320 px checks of My Day, Roster, DSM and CPD, taken in container Chromium. Before and after images from the mockup are in the project files under ward-flow-ideas-2026-10-12/.
• Browser suite left to CI.

Risk and rollout

• Risk: low to medium. This is visual only, but the 12 px floor touches every screen, including Clinical, so some long labels may now truncate or wrap at 320 px or with large text. CI browser tests will show any of that.
• Rollback: revert the PR.
• Provider or production effects: none. There is no migration. brightLight lives in the existing preferences JSON.

Notes

• Draft until CI browser tests are green.

🤖 Generated with Claude Code

https://claude.ai/code/session_0113Rr2NnmLuLKLWdKTwHHqd

Generated by Claude Code

---

Summary by cubic

Applies the Ward Flow design review (approved 12 Oct 2026): nothing on screen sits below 12 px, figures render in Geist Mono, and status is one shape on a grey pill instead of a coloured badge.

• --text-3xs (10 px) and --text-2xs (11 px) now resolve to 12 px; the work kit's sub-12 px sizes use --text-xs.
• Shapes are triangle overdue, filled dot due soon, tick done, dashed ring not recorded; Admin's status marks, the renewals timeline, and My Day's late lines use the same set, and the glyphs stay visible under forced colours. Neutral and mode tags stay plain labels with no shape.
• Faded rows (stale on-call rows, out-of-month calendar days, locked assessments) dim through a new data-dim hook instead of opacity, taking a paler colour and muted status tones rather than transparency.
• New Bright light toggle in Settings, App preferences: a persisted account preference that gives solid surfaces (including the More sheet), darker lines, heavier text, light mode only. It pins light mode and resets with the reset-all action. The dim and Bright light rules live in reading-aids.css so the cascade order is explicit.
• Admin Today's renewal hero answers with the date-passed and due counts in the same words as the Coming up list, with the item as the line underneath (compliance renewals only; new-job items keep the item as the title, as does My Day).
• My Day's late lines trade coloured text for dark words with a red triangle once a date passes and an amber dot while overdue but in hand.
• The floor's tightest 320 px spots — three-option setting segments, the also-matches header, and the privacy line — were adjusted to stay on one line.

This is visual-only apart from the hero title, but the floor touches every screen; some long labels may still truncate or wrap at 320 px or with large text. Draft until CI browser tests are green.

^{Written for commit 4a48892. Summary will update on new commits.}

---

Summary by Gitar

• Admin Today hero:
  • Renewals hero now names the date-passed and due-in-90-days counts, with the next item beneath it
• My Day late lines:
  • Late lines use dark words with a red triangle once a date passes and an amber dot while overdue
• Narrow screen fixes:
  • Three-option settings segments, the also-matches header and the privacy line were adjusted to stay on one line at 320px

_{This will update automatically on new commits.}

---

CodeAnt-AI Description

Raise small-text readability and add a Bright light display option

What Changed

• Small labels and work-screen text now have a 12px minimum, and figures such as counts and dates use a consistent fixed-width style.
• Statuses are easier to distinguish: overdue items use a triangle, upcoming items a dot, completed items a tick, and unrecorded items a dashed ring.
• Stale, locked, and out-of-month content uses paler colours instead of transparency.
• Settings now includes Bright light, which uses solid surfaces, darker lines, and heavier text for glare; enabling it switches to light mode.
• Admin Today’s renewals card summarizes dates passed and items due within 90 days, then names the next item.

Impact

✅ More readable small labels on phones
✅ Clearer status distinctions at a glance
✅ Higher-contrast screens in bright environments

💡 Usage Guide

Checking Your Pull Request

Every time you make a pull request, our system automatically looks through it. We check for security issues, mistakes in how you're setting up your infrastructure, and common code problems. We do this to make sure your changes are solid and won't cause any trouble later.

Talking to CodeAnt AI

Got a question or need a hand with something in your pull request? You can easily get in touch with CodeAnt AI right here. Just type the following in a comment on your pull request, and replace "Your question here" with whatever you want to ask:

@codeant-ai ask: Your question here

This lets you have a chat with CodeAnt AI about your pull request, making it easier to understand and improve your code.

Example

@codeant-ai ask: Can you suggest a safer alternative to storing this secret?

Preserve Org Learnings with CodeAnt

You can record team preferences so CodeAnt AI applies them in future reviews. Reply directly to the specific CodeAnt AI suggestion (in the same thread) and replace "Your feedback here" with your input:

@codeant-ai: Your feedback here

This helps CodeAnt AI learn and adapt to your team's coding style and standards.

Example

@codeant-ai: Do not flag unused imports.

Retrigger review

Ask CodeAnt AI to review the PR again, by typing:

@codeant-ai: review

Check Your Repository Health

To analyze the health of your code repository, visit our dashboard at https://app.codeant.ai. This tool helps you identify potential issues and areas for improvement in your codebase, ensuring your repository maintains high standards of code health.

[coderabbitai]

Important

• 🔍 Trigger review

This repository does not receive automatic reviews because it has fewer than 10 stars.

⚙️ Run configuration

• Configuration used: Organization UI
• Review profile: ASSERTIVE
• Plan: Advanced
• Run ID: f5c5223b-173a-4084-ad46-3d311e76b0df

---

• Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

---

_{Comment @coderabbitai help to get the list of available commands.}

[supabase]

This pull request has been ignored for the connected project sjrfecxgysukkwxsowpy because there are no changes detected in supabase directory. You can change this behaviour in Project Integrations Settings ↗︎.

---

Preview Branches by Supabase.
Learn more about Supabase Branching ↗︎.

[codeant-ai]

🏁 CodeAnt Quality Gate Results

Commit: 4a488925
Scan Time: 2026-10-12 16:27:02 UTC

✅ Overall Status: PASSED

Quality Gate Details

Quality Gate	Status	Details
Secrets	✅ PASSED	0 secrets found
Duplicate Code	✅ PASSED	0.0% duplicated
SAST	✅ PASSED	No security issues
Bugs	✅ PASSED	Rating S: No bugs
IAC	✅ PASSED	No IAC issues

View Full Results

[codspeed]

Merging this PR will not alter performance

⚠️ 1 benchmark spent significant time in system calls

System calls cannot be consistently instrumented, so they are not included in the measure, which understates the real cost. Please switch to the Walltime instrument to accurately measure system calls.

Measurement and system calls

• catalog-search: rankCatalogRecords 400 records

✅ 8 untouched benchmarks

---

_{Comparing claude/project-thread-8ygx0b (4a48892) with main (f6320ed)}

[gitar-bot]

Gitar has auto-approved this PR (configure)

[gitar-bot]

Gitar has auto-approved this PR (configure)

[gitar-bot]

Gitar has auto-approved this PR (configure)

[codeant-ai]

🤖 CodeAnt AI — Review Status

Status	Commit	Started (UTC)	Finished (UTC)
✅ Incremental review completed	281aea8	Oct 12, 2026 · 15:46	15:47
✅ Reviewed your PR	de7ecda	Oct 12, 2026 · 12:24	12:31

[codeant-ai]

---

Thanks for using CodeAnt! 🎉

We're free for open-source projects. if you're enjoying it, help us grow by sharing.

Share on X ·
Reddit ·
LinkedIn

[greptile-apps]

BigSimmo has reached the 50-credit limit for trial accounts. To continue receiving code reviews, upgrade your plan.

[claude]

Claude encountered an error after 2s —— View job

---

I'll analyze this and get back to you.

[gitar-bot]

Gitar has auto-approved this PR (configure)

[BigSimmo]

Browser matrix run 38257840055 on a00e834: Chromium and Firefox passed in every shard. Eight WebKit jobs (tablet, mobile-webkit, mobile-pwa-standalone) failed.

Almost every WebKit failure is a test that also fails in main's latest full matrix run (38163135760): clicks blocked by the install notice, the On Call "02 More" support anchor, the assessments tab-strip height check, the my-day and roster tablet tests, and others. All of these are tracked under #9Z197J and are not this PR's to fix. ui-teaching.spec.ts:83 fails on main but passes here.

Only three tests failed here and not on main:

• ui-patient-number-field.spec.ts:206 on mobile-webkit. The patient panel stayed hidden. The same test passed on mobile-pwa-standalone in this run, and this PR does not touch the patient panel.
• ui-phone-scroll-assessments.spec.ts:19, the reduce variant, on mobile-webkit. The page briefly held two copies of the doctor hero, the known hidden streamed-twin pattern. This PR changes only assessment font sizes.
• ui-smoke.spec.ts:4288 on tablet. The differentials route check timed out during a slow shard; this PR does not touch mode-bar routing. That shard also hit the 30-minute limit, leaving 23 tests unrun.

None of these has a path back to this diff. I've re-run the failed jobs once to confirm.

---

Generated by Claude Code

[greptile-apps]

BigSimmo has reached the 50-credit limit for trial accounts. To continue receiving code reviews, upgrade your plan.

[qodo-code-review]

Code review by qodo was updated up to the latest commit 281aea8

[qodo-code-review]

Qodo Fixer

Found 10 findings, but none include a fix that can be applied automatically.

[chatgpt-codex-connector]

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 281aea8eb4

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

• Open a pull request for review
• Mark a draft as ready
• Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

[gitar-bot]

Gitar has auto-approved this PR (configure)

[qodo-code-review]

Code review by qodo was updated up to the latest commit eef5a71

[gitar-bot]

Gitar has auto-approved this PR (configure)

[gitar-bot]

Code Review ✅ Approved 3 closed / 3 findings

🟡 Medium risk · Raising the global text floor and adding persisted Bright light styling across screens could cause labels to wrap or obscure controls on narrow displays.

Applies the Ward Flow design review: text floor raised to 12 px, figures in Geist Mono, status shown by shape on grey pills, paler fades instead of transparency, and a new Bright light setting. Resolved the Admin timeline triangle clash, Settings reset not clearing Bright light, and the new-job hero mislabelled as Renewals. No open issues found.

Auto-approved: No blocking issues found.
Please see Auto-approve Docs for details on setting custom approval criteria.

✅ 3 closed

✅ Bug: Admin timeline still uses triangle for 'ahead', now the list's 'passed' mark

📄 src/components/admin/admin-status-tag.tsx:28-42 📄 tests/admin-renewals-page.dom.test.tsx:216-224
This PR moves the Admin list marks to a triangle for date passed and a filled dot for start renewing. The renewals timeline in checklist-summary.tsx (lines 115-127) was not updated. It still draws a lucide Diamond for a passed date and a Triangle for a date still ahead, and its comment says these are "the same shapes the list's tags carry". So on one Admin screen the triangle means overdue (red) in the list and upcoming (amber) on the timeline. Status is meant to be shown by shape first, so a reader who goes by shape gets the opposite meaning. The test at tests/admin-renewals-page.dom.test.tsx:216 still expects diamond and triangle, so it locks in the old shapes. Fix: have the timeline draw the triangle for passed and the dot for start renewing, ideally by reusing AdminStatusMark/AdminStatusShape, and update the test to match.

✅ Edge Case: Settings resets don't clear the new Bright light preference

📄 src/components/clinical-dashboard/settings-dialog.tsx:124-131 📄 src/components/clinical-dashboard/settings-dialog.tsx:1200-1209
brightLight is a new toggle in the App preferences section. It is not in APP_PREFERENCE_RESET_KEYS (settings-dialog.tsx:124-131), and FULL_RESET_KEYS builds on that list, so it is missing there too. After either "Reset app preferences" or the full reset, Bright light stays on: data-bright stays on <html> and the solid, heavier look remains. Every other look preference in that section (density, motion, compactCitations) does get reset. Fix: add "brightLight" to APP_PREFERENCE_RESET_KEYS.

✅ Edge Case: New-job hero gets relabelled "Renewals" when renewal counts are non-zero

📄 src/components/admin/today/today-renew-next-card.tsx:95-103 📄 src/components/admin/admin-today-page.tsx:186-188
selectRenewNext can return a kind: "new-job" item when the job's start date is nearer than any compliance date. If counts also has passed or due items, the card shows the eyebrow "Renewals", a title such as "1 date passed", and a sub line "Next: <new job> · Starts …". That presents the job start as the next renewal. The aria-label still says "New job starts", so screen-reader users get a name that doesn't match what is on screen. A simple fix is to compute the answer only for compliance items, e.g. const answer = counts && item.kind === "compliance" ? renewalsAnswer(counts) : null;.

Review coverage

🤖 Auto-approval Approved

📋 Rules No rules evaluated

🧪 Functional validation Not enabled · Set up

Options

Auto-apply is off → Gitar will not commit updates to this branch.
Display: compact → Counting what did not apply, without listing it.

Comment with these commands to change the behavior for this request:

Auto-apply	Compact
gitar auto-apply:on	gitar display:verbose

_{Was this helpful? React with 👍 / 👎 | Gitar}

[qodo-code-review]

Code review by qodo was updated up to the latest commit 4a48892

[BigSimmo]

On Qodo's "test pins exact source whitespace" point: I'm leaving this one as it is. This test pinned the source text before this PR too (it used toContain). The regex is actually looser than that: \s* tolerates reindenting, and Prettier is enforced on the file, so layout drift can't reach main unnoticed. What this contract protects is the pending arm and the removal of the old "Tap to open" arm. The wording of the count arm isn't its subject, which is why that arm is left open. Tightening it would restart the full CI run on a ready PR and wouldn't change what the test guards.

---

Generated by Claude Code