githubocto / flat-ui

MIT License
373 stars 23 forks source link

Provide options to reduce data row height #30

Closed RandomFractals closed 1 year ago

RandomFractals commented 2 years ago

Flat UI only displays 9 and a half rows in a fixed 560px table view and each data cell sets 40px height via inline styles.

It would be more aesthetically pleasing to have shorter table data rows in applications with limited viewports, such as VSCode notebooks and their cell outputs.

I was able to overwrite some of those CSS rules, but I can't find how to remove the extra spaces between data rows:

flat-data-grid-ui-shorter-rows

See more info in our data table renderers: https://github.com/RandomFractals/vscode-data-table/issues/138

In general, I think it would be best to remove some of those inline div styles and add more custom classes for the table rows and cells.

RandomFractals commented 1 year ago

@Wattenberger closing this since I've decided to fork your fine flat UI grid with column header summaries and make adjustments to it on our end. I still think it would be nice to provide rowHeight param option for other folks embedding your tsx grid in other apps and IDE extensions.

Feel free to review our quick and dirty changes in our fork and try them out in the updated VS Code Data Table ext.:

https://github.com/RandomFractals/vscode-data-table/issues/138#issuecomment-1742975207

Thanks for all the hard work on providing this slick react grid for our ext. and other web apps and VS Code data-oriented extensions to use!