fix(grid): Fix the table css in saas mode #3532
Conversation
WalkthroughThe changes refine the grid component's styling by reducing horizontal padding and element widths in multiple LESS files. Table columns and ellipsis text now use narrower padding, and certain header elements have their widths halved. These updates impact the visual spacing and layout of grid tables without altering any exported entities or control flow. Changes
Poem
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. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
♻️ Duplicate comments (5)
packages/theme-saas/src/grid/table.less (2)
95-98: Same change for size-small – duplication of preceding commentNothing further to add.
133-135: Same change for size-mini – duplication of preceding commentNothing further to add.
packages/theme-saas/src/grid/table-global.less (3)
93-94: Global size-small padding reduced – duplicationNothing further to add.
127-128: Global size-mini padding reduced – duplicationNothing further to add.
964-968: Editable branch updated – duplicationKeeps visual parity between editable/non-editable. All good.
🧹 Nitpick comments (1)
packages/theme-saas/src/grid/header.less (1)
87-96: Resizable grab-area width cut in half – double-check usabilityShrinking the handles from
w-8tow-4halves the clickable/touchable area.
For mouse users this is usually still OK, but 4 px may be frustrating on Hi-DPI screens and almost unusable on touch devices.- @apply w-4; + /* consider keeping ≥6 px for usability, or make it theme-token driven */ + @apply w-4;Please verify the UX in SaaS mode and, if possible, gate the value behind a variable so consumers can tune it.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (4)
packages/theme-saas/src/grid/header.less(1 hunks)packages/theme-saas/src/grid/mixins/table.less(1 hunks)packages/theme-saas/src/grid/table-global.less(1 hunks)packages/theme-saas/src/grid/table.less(1 hunks)
🧰 Additional context used
📓 Path-based instructions (1)
`**/*`: 用于写产品需求和开发文档的文件，需求应尽量写得简单清晰易懂。 在需求设计阶段应遵从逐步迭代的原则，早期版本可以尽量简洁。
**/*: 用于写产品需求和开发文档的文件，需求应尽量写得简单清晰易懂。
在需求设计阶段应遵从逐步迭代的原则，早期版本可以尽量简洁。
packages/theme-saas/src/grid/header.lesspackages/theme-saas/src/grid/table-global.lesspackages/theme-saas/src/grid/mixins/table.lesspackages/theme-saas/src/grid/table.less
⏰ Context from checks skipped due to timeout of 90000ms (1)
- GitHub Check: PR Unit Test
🔇 Additional comments (6)
packages/theme-saas/src/grid/mixins/table.less (1)
7-13: Left padding reduced – ensure icon/text alignment still looks correct
.TextEllipsis()is reused everywhere a cell shows truncated text. Moving frompl-4topl-2changes the visual alignment relative to check-boxes, tree-indents and icons.No functional issue in LESS, but please eyeball a few complex header/body rows (sortable + checkbox + tree) to confirm nothing collides.
packages/theme-saas/src/grid/table.less (3)
61-64: Horizontal padding tightened for size-mediumLooks consistent with the SaaS compacting initiative and keeps
py-0.5untouched.
No issues. ✅
561-563: Default column padding tightenedNo problems; aligns with the three size-specific blocks above.
1040-1044: Editable grid branch updated – keep internal consistencyGood that the editable variation received the same
px-2treatment; prevents visual jumps when switching edit mode.packages/theme-saas/src/grid/table-global.less (2)
59-60: Global size-medium padding reducedChange mirrors
table.less; looks correct.
479-481: Default padding tightened in global sheetSyncs with mixin changes. No issues spotted.
PR
fix:修复saas模式表格css
PR Checklist
Please check if your PR fulfills the following requirements:
PR Type
What kind of change does this PR introduce?
What is the current behavior?
Issue Number: N/A
What is the new behavior?
Does this PR introduce a breaking change?
Other information
Summary by CodeRabbit