Skip to content

fix: improve readability of force totals and event timestamps#331

Merged
fank merged 4 commits intomainfrom
fix/improve-text-readability
Mar 7, 2026
Merged

fix: improve readability of force totals and event timestamps#331
fank merged 4 commits intomainfrom
fix/improve-text-readability

Conversation

@fank
Copy link
Member

@fank fank commented Mar 7, 2026

Summary

  • Bump text color from --text-dimmest (#4c6174) to --text-dimmer (#5b6f82) for:
    • Force total counts (/4) in the top bar
    • Event timestamps in the side panel events tab

Test plan

  • Verify top bar force indicators show readable totals (e.g. 1 /4)
  • Verify event timestamps in the events tab are readable

Bump color from --text-dimmest to --text-dimmer for the force total
counts in the top bar and event timestamps in the side panel, as they
were too dark to read comfortably.
@gemini-code-assist
Copy link
Contributor

Summary of Changes

Hello, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request focuses on enhancing the user interface's readability by adjusting the text color of two specific elements: the force total counts displayed in the top bar and the event timestamps found in the side panel's events tab. By transitioning from a dimmer text color variable to a slightly brighter one, the changes aim to provide better contrast and ensure these important pieces of information are more easily discernible to the user.

Highlights

  • Improved Readability for Force Totals: The text color for force total counts in the top bar has been updated from --text-dimmest to --text-dimmer to enhance visibility and readability.
  • Improved Readability for Event Timestamps: The text color for event timestamps in the side panel's events tab has been updated from --text-dimmest to --text-dimmer to improve their legibility.
Changelog
  • ui/src/pages/recording-playback/components/SidePanel.module.css
    • Updated the color property for the .eventTime class from var(--text-dimmest) to var(--text-dimmer).
  • ui/src/pages/recording-playback/components/TopBar.module.css
    • Updated the color property for the .forceTotal class from var(--text-dimmest) to var(--text-dimmer).
Activity
  • No activity has been recorded on this pull request yet.
Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature Command Description
Code Review /gemini review Performs a code review for the current pull request in its current state.
Pull Request Summary /gemini summary Provides a summary of the current pull request in its current state.
Comment @gemini-code-assist Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help /gemini help Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

  1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution.

Copy link
Contributor

@gemini-code-assist gemini-code-assist bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code Review

This pull request improves the readability of force totals and event timestamps by using a lighter text color. The changes are straightforward and achieve the stated goal. I have one suggestion for improving UI consistency in the side panel.

@github-actions
Copy link

github-actions bot commented Mar 7, 2026

Coverage Report for ui

Status Category Percentage Covered / Total
🔵 Lines 99.07%
🟰 ±0%
4825 / 4870
🔵 Statements 98.5%
🟰 ±0%
6711 / 6813
🔵 Functions 97.83%
🟰 ±0%
1894 / 1936
🔵 Branches 89.37%
🟰 ±0%
2221 / 2485
File CoverageNo changed files found.
Generated in workflow #421 for commit d2d1916 by the Vitest Coverage Report Action

fank and others added 3 commits March 7, 2026 19:26
* fix: add distinct icons and colors for capture/contested/terminal events

- Add FlagIcon for captured/capturedFlag events (blue)
- Use AlertTriangleIcon for contested events (orange)
- Use TerminalIcon for terminal hack events (orange)
- Remove invisible em dash separator from EndMissionEvent rows

* fix: use DoorExitIcon for EndMissionEvent events

Replace TargetIcon with a door/exit icon for mission end events,
better conveying that the mission has ended.

* refactor: merge eventIcon and eventColor into single eventStyle function
@fank fank merged commit e05bdb8 into main Mar 7, 2026
3 checks passed
@fank fank deleted the fix/improve-text-readability branch March 7, 2026 19:34
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant