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

feat: bar charts #39

Merged
merged 4 commits into from Feb 8, 2024
Merged

feat: bar charts #39

merged 4 commits into from Feb 8, 2024

Conversation

chiubaca
Copy link
Contributor

@chiubaca chiubaca commented Feb 5, 2024

Resolves: #28

Notes:
Was slightly trickier than anticipated because because absolute positioning elements in a css table is much harder than with plain divs in a css grid. Down the line I do wonder if if its worth refactoring the table component be plain divs and css grid if the component gets more complex, would give a bit more css flexiblity but at the cost of good html semantics.

Demo: https://counterscale.chiubaca.workers.dev/dashboard

@chiubaca chiubaca changed the title Feat/bar chart for feat: bar charts Feb 5, 2024
@chiubaca chiubaca marked this pull request as ready for review February 5, 2024 11:27
@benvinegar
Copy link
Owner

benvinegar commented Feb 5, 2024

Man that looks so much better (with some tiny style issues to be resolved). I'll poke at this sometime this week.

🙏

@benvinegar
Copy link
Owner

So I took a peek at this: I'd like to figure out how to achieve the result without adding empty table cells. Mostly for a11y; the markup should reflect the content.

I'm playing around with it now. We're also free to edit TableCell (these are copy/pasted components from shadcdn/ui).

@benvinegar benvinegar merged commit ca533fb into benvinegar:main Feb 8, 2024
1 check failed
@benvinegar
Copy link
Owner

I merged your PR then re-did how the colors were applied to drop the extra <td> and instead use linear-gradienton the` element.

8af3767

@benvinegar
Copy link
Owner

Also added #42

@chiubaca
Copy link
Contributor Author

chiubaca commented Feb 8, 2024

So I took a peek at this: I'd like to figure out how to achieve the result without adding empty table cells. Mostly for a11y; the markup should reflect the content.

I'm playing around with it now. We're also free to edit TableCell (these are copy/pasted components from shadcdn/ui).

Aha, that was confusing me lots!

Nice, thanks for fixing and merging🎉

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.

Add horizontal bar chart / visual indicator to card rows
2 participants