Skip to content

Fix (DataTable): padding issues datatable#688

Merged
paanSinghCoder merged 4 commits intomainfrom
fix/padding-issues-datatable
Mar 12, 2026
Merged

Fix (DataTable): padding issues datatable#688
paanSinghCoder merged 4 commits intomainfrom
fix/padding-issues-datatable

Conversation

@paanSinghCoder
Copy link
Contributor

@paanSinghCoder paanSinghCoder commented Mar 10, 2026

Description

  • fix: Navbar, Filters and table alignment is not proper.
    • padding: var(--rs-space-3) var(--rs-space-7) var(--rs-space-3) var(--rs-space-5); change this to padding: var(--rs-space-3) 0;
  • fix: Table grouping section header title alignment is not there.
    • Unified the padding in Table and DatatTable both - padding: var(--rs-space-3);

Before:
Screenshot 2026-03-10 at 5 55 50 PM

After:
Screenshot 2026-03-10 at 5 56 42 PM

Type of Change

  • Bug fix (non-breaking change that fixes an issue)
  • New feature (non-breaking change that adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to not work as expected)
  • Documentation update
  • Refactor (no functional changes, no bug fixes just code improvements)
  • Chore (changes to the build process or auxiliary tools and libraries such as documentation generation)
  • Style (changes that do not affect the meaning of the code (white-space, formatting, etc))
  • Test (adding missing tests or correcting existing tests)
  • Improvement (Improvements to existing code)
  • Other (please specify)

How Has This Been Tested?

[Describe the tests that you ran to verify your changes]

Checklist:

  • My code follows the style guidelines of this project
  • I have performed a self-review of my own code
  • I have commented my code, particularly in hard-to-understand areas
  • I have made corresponding changes to the documentation (.mdx files)
  • My changes generate no new warnings
  • I have added tests that prove my fix is effective or that my feature works

Screenshots (if appropriate):

[Add screenshots here]

Related Issues

[Link any related issues here using #issue-number]

Summary by CodeRabbit

  • Documentation

    • Added guidance on configuring stable column references to optimize filter, grouping, and sort performance
  • Style

    • Refined spacing in data table and table component layouts

@vercel
Copy link

vercel bot commented Mar 10, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
apsara Ready Ready Preview, Comment Mar 12, 2026 6:18am

@paanSinghCoder paanSinghCoder changed the title Fix/padding issues datatable Fix (DataTable): padding issues datatable Mar 10, 2026
@coderabbitai
Copy link
Contributor

coderabbitai bot commented Mar 10, 2026

📝 Walkthrough

Walkthrough

Documentation update adds guidance on maintaining stable column references to prevent unnecessary recomputation. CSS styling refinements reduce padding values and adjust width calculations across data-table and table components for consistency.

Changes

Cohort / File(s) Summary
Documentation
apps/www/src/content/docs/components/datatable/index.mdx
Added guidance under "Column Configuration" to use stable columns references (module scope or useMemo) to prevent recomputation of filters, grouping, and sort state.
CSS Styling
packages/raystack/components/data-table/data-table.module.css, packages/raystack/components/table/table.module.css
Simplified padding values in toolbar and section headers from multi-value to single-value padding; adjusted display-popover width calculation by removing fixed space subtraction; minor selector spacing normalization.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Suggested reviewers

  • rohanchkrabrty

Poem

🐰 A bunny hops through CSS with glee,
Padding simplified, clean as can be!
Columns grow stable, no jitter or sway,
The table looks neater—hooray, hooray!

🚥 Pre-merge checks | ✅ 3
✅ Passed checks (3 passed)
Check name Status Explanation
Title check ✅ Passed The title directly addresses the main change - fixing padding issues in the DataTable component, which aligns with the CSS modifications and alignment improvements shown in the PR.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
  • 📝 Generate docstrings (stacked PR)
  • 📝 Generate docstrings (commit on current branch)
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branch fix/padding-issues-datatable

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@paanSinghCoder paanSinghCoder merged commit 3f5a03f into main Mar 12, 2026
4 of 5 checks passed
@paanSinghCoder paanSinghCoder deleted the fix/padding-issues-datatable branch March 12, 2026 06:16
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