Skip to content

[Bug]: Appointment list view uses outdated and inconsistent font sizes #1944

Description

Label: bug

Affected area

Web app (apps/frontend)

What is wrong

The Appointment module’s List view still uses typography from the previous UI. Table content appears larger than text used throughout the updated interface, creating inconsistent visual hierarchy and reducing table density.

This affects patient names, appointment reasons, services, rooms, date and time, assigned staff, and other row content in both light and dark modes.

Steps to reproduce

  1. Sign in to the PIMS.
  2. Open the Appointment module.
  3. Switch to List view.
  4. Compare the table typography with the current UI typography used elsewhere in the PIMS.
  5. Repeat the comparison in light and dark modes.

Expected behavior

  • Table headers should use the current table-label typography token.
  • Row content should use the smaller table-body typography defined for the new UI.
  • Font size, weight, line height, and letter spacing should remain consistent across columns.
  • Status pills should use the shared status-pill typography.
  • Row density and text wrapping should follow the new UI specifications.
  • Typography should remain readable in light and dark modes.

Actual behavior

The table uses larger legacy font sizes. Typography varies between table headers, row content, status pills, and surrounding controls, making the List view visually inconsistent with the updated PIMS interface.

How often does it reproduce

Always

Did this work before

No, it never worked

Impact

Low — the issue creates visual inconsistency, reduces information density, and makes the appointment table harder to scan efficiently.

Environment

  • Branch or commit SHA: Not provided
  • Node version: Not provided
  • pnpm version: Not provided
  • OS: macOS
  • Web browser and version: Safari 26.5
  • Mobile device and OS version: Not applicable
  • Desktop app version:
  • Running against: Not provided

Logs, console output, or stack trace

No error message or console output observed. This appears to be a legacy typography and design-token issue.

Screenshots and additional context

Image Image

See the attached light-mode and dark-mode screenshots. Replace legacy table styles with the current typography tokens used across the new PIMS UI.

Contribution

  • I am willing to open a PR to fix this.

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions