Skip to content

fix(presets): center list editor row content and button within the row card#1095

Closed
Transmigration-zhou wants to merge 2 commits into
mainfrom
fix/list-editor-content-center
Closed

fix(presets): center list editor row content and button within the row card#1095
Transmigration-zhou wants to merge 2 commits into
mainfrom
fix/list-editor-content-center

Conversation

@Transmigration-zhou

@Transmigration-zhou Transmigration-zhou commented Jul 7, 2026

Copy link
Copy Markdown
Contributor

Problem

Follow-up to #1094. Two remaining alignment defects in the list editor row cards (reported downstream in KGM-4586):

  1. When a row's content is shorter than the 48px delete button (e.g. a single compact input), the flex row's height is driven by the button, the content column stretches to that height (default align-items: stretch) and sticks to its top — the button sits (48 − content)/2 px below the input's centerline.
  2. The card's pt-4 pb-0 padding relied on the row content ending with a v-input details placeholder to supply the bottom gap. Content without one (hide-details inputs, plain components) gets pinned against the card's bottom border, visibly off the card's vertical centerline.

Fix

  • align-self-center on the content column: a short content block centers against the button instead of stretching; rows taller than the button define the row height themselves and are unaffected.
  • pa-4 on the row card: symmetric vertical padding, so the card's spacing no longer depends on the content's internal structure. Rows whose content ends with a details placeholder gain 16px of bottom padding (16/36 total) — slightly roomier, but the card no longer collapses onto content that doesn't carry one.

Testing

  • go test ./presets/... passes.
  • Verified in the kakuyasu seller portal via a local go.mod replace: with hide-details inputs, both a single-input row and a two-field row measure a 0.0px offset between the delete button center and the card centerline.

🤖 Generated with Claude Code

…tton

When the row content is shorter than the 48px delete button (e.g. a
single input), the flex row stretches the content column to the button's
height and the content sticks to the top, leaving the button visibly
below the input's centerline. Center the content column instead of
stretching it; rows taller than the button are unaffected.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_0195isT8XZBhZ3wwcWTYKtgV
@deepsource-io

deepsource-io Bot commented Jul 7, 2026

Copy link
Copy Markdown

DeepSource Code Review

We reviewed changes in b896822...2b69640 on this pull request. Below is the summary for the review, and you can see the individual issues we found as inline review comments.

See full review on DeepSource ↗

PR Report Card

Overall Grade   Security  

Reliability  

Complexity  

Hygiene  

Code Review Summary

Analyzer Status Updated (UTC) Details
Go Jul 7, 2026 3:43a.m. Review ↗

Important

AI Review is run only on demand for your team. We're only showing results of static analysis review right now. To trigger AI Review, comment @deepsourcebot review on this thread.

@codecov

codecov Bot commented Jul 7, 2026

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.

Files with missing lines Coverage Δ
presets/listeditor.go 78.08% <100.00%> (ø)
🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.

The pt-4 pb-0 padding relied on the row content ending with a
v-input details placeholder to supply the bottom gap; content without
one (hide-details inputs, plain components) got pinned against the
card's bottom border, off the card's centerline. Use pa-4 so the card's
spacing no longer depends on the content's internal structure.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_0195isT8XZBhZ3wwcWTYKtgV
@Transmigration-zhou Transmigration-zhou changed the title fix(presets): center list editor row content against taller delete button fix(presets): center list editor row content and button within the row card Jul 7, 2026
@Transmigration-zhou

Copy link
Copy Markdown
Contributor Author

Superseded by #1096 — same goal (center the delete button), but strictly scoped to the button via absolute positioning against the card; row content layout stays byte-for-byte unchanged, unlike the padding change here.

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.

1 participant