Repository navigation
[6.x] Pad flush tables' outer cells instead of their container - #19936
Merged
Merged
Conversation
Padded admin tables and element index tables now span their container's inline padding, and `cp-table--flush` pads each row's first and last cells by `--cp-container-padding` instead of removing that padding. Nested element indexes opt out via ElementIndex's new `flushTable` prop, since their container padding is 0. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
📚 Storybook previews@craftcms/ui — open Storybook No changed components detected in this Storybook. resources/js — open Storybook No changed components detected in this Storybook. |
brianjhanson
approved these changes
Oct 10, 2026
brianjhanson
left a comment
brianjhanson
left a comment
Contributor
There was a problem hiding this comment.
I'm good with this but I wonder if it would be simpler to have a display or mode property instead. The goal being to make it easier to keep track of the various display states.display="full" → Element index pages
display="padded" → padding everywhere
display="flush" → nothing padded
Very possible I'm not thinking about all the use cases though.
The test from #19935 expected the body to be inset by the container padding, which this PR replaces with padding on each row's outer cells. It also applied the `admin-table--padded` class rather than the `padded` prop, which never made the table flush. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Tables now take one `appearance`: `plain`, `flush` or `raised`, matching how `appearance` sets surface treatment on `<craft-pane>` and other components. - `AdminTable`'s `padded` prop is now `appearance`, and a `raised` table is set in a pane by `AdminTable` itself, rather than by `AdminTableNode`. - `DataTable`'s and `ElementTable`'s `flush` props are now `appearance`, and `ElementIndex`'s `flushTable` is now `tableAppearance`. - `CraftCms\Cms\Ui\Nodes\Table::bordered()` is now `appearance()`, backed by the new `CraftCms\Cms\Cp\Enums\TableAppearance`. Unset, a table that's all its page has is `flush`; otherwise it's `plain`. - The values are exported as `TableAppearance` from `@craftcms/cp`. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Member
Author
|
@brianjhanson 👍🏻 with with |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
Flush admin tables and element index tables now span their container's inline padding, rather than sitting inside it.
cp-table--flushpads each row's first and last cells by--cp-container-paddingto match, so the table's rules and row hovers reach the container's edges while cell content still lines up with the header and footer.This replaces the approach from #19906, which removed the padding from the outer cells.
Tables now take a single
appearanceoption, matching howappearancesets surface treatment on<craft-pane>and other components:plainflushraisedAdminTable'spaddedprop is nowappearance. Aflushtable pads only its header and footer, and araisedone is set in a pane byAdminTableitself.DataTable's andElementTable'sflushprops are nowappearance(plainorflush).ElementIndextakes atableAppearance(flushby default), and drops its body's inline padding while a flush table view is showing. Cards and thumbnails keep it. Nested element indexes, whose--cp-container-paddingis0, useplain.CraftCms\Cms\Ui\Nodes\Table::bordered()is nowappearance(), backed by a newCraftCms\Cms\Cp\Enums\TableAppearanceenum. Unset, a table that's all its page has isflush; otherwise it'splain.TableAppearancefrom@craftcms/cp.🤖 Generated with Claude Code