Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

refactor(tui): Use color instead of bars to distinguish sections of task list. #9365

Merged
merged 7 commits into from
Nov 1, 2024

Conversation

anthonyshew
Copy link
Contributor

@anthonyshew anthonyshew commented Nov 1, 2024

Description

Screen real estate is valuable.

We were using horizontal bars to distinguish the header and footer from the task list itself. Instead, let's use color, and get rid of the bars.

Testing Instructions

👀

I checked light mode for color contrast, as well, and did the best I could. I don't know if there's a way to tell Ratatui to use different foreground colors for light vs. dark backgrounds? I at least couldn't find any documentation on it or example in our codebase.

Before:
CleanShot 2024-10-31 at 22 09 27@2x

After:
CleanShot 2024-10-31 at 22 10 08@2x

Copy link

vercel bot commented Nov 1, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
examples-nonmonorepo ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 1, 2024 4:45pm
8 Skipped Deployments
Name Status Preview Comments Updated (UTC)
examples-basic-web ⬜️ Ignored (Inspect) Visit Preview Nov 1, 2024 4:45pm
examples-designsystem-docs ⬜️ Ignored (Inspect) Visit Preview Nov 1, 2024 4:45pm
examples-gatsby-web ⬜️ Ignored (Inspect) Visit Preview Nov 1, 2024 4:45pm
examples-kitchensink-blog ⬜️ Ignored (Inspect) Visit Preview Nov 1, 2024 4:45pm
examples-native-web ⬜️ Ignored (Inspect) Visit Preview Nov 1, 2024 4:45pm
examples-svelte-web ⬜️ Ignored (Inspect) Visit Preview Nov 1, 2024 4:45pm
examples-tailwind-web ⬜️ Ignored (Inspect) Visit Preview Nov 1, 2024 4:45pm
examples-vite-web ⬜️ Ignored (Inspect) Visit Preview Nov 1, 2024 4:45pm

@anthonyshew anthonyshew changed the title wip refactor(tui): Use color instead of bars to distinguish sections of task list. Nov 1, 2024
@chris-olszewski
Copy link
Member

I don't know if there's a way to tell Ratatui to use different foreground colors for light vs. dark backgrounds?

Not to my knowledge. I think we would need to query the terminal for the default fg/bg colors (I do not know how to do this in a terminal agnostic way), some heuristic for deciding if bg was dark/light, and just have two sets of colors.

Copy link
Member

@chris-olszewski chris-olszewski left a comment

Choose a reason for hiding this comment

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

I think this looks good, we could look at just using DIM instead of a different color. This is a screenshot of using DIM:
Screenshot 2024-11-01 at 12 23 04 PM

@anthonyshew anthonyshew enabled auto-merge (squash) November 1, 2024 17:05
@anthonyshew anthonyshew merged commit 5f7e80a into main Nov 1, 2024
40 checks passed
@anthonyshew anthonyshew deleted the shew-6e3d1 branch November 1, 2024 17:28
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.

2 participants