fix: fill the bordered container for read-only filled fields#1061
Draft
lmjabreu wants to merge 1 commit into
Draft
fix: fill the bordered container for read-only filled fields#1061lmjabreu wants to merge 1 commit into
lmjabreu wants to merge 1 commit into
Conversation
In the bordered variant the container owns the border and padding, so a filled read-only field's grey sat on the inner field as an inset band that didn't reach the border. Move the fill to the container for the bordered variant so it reads as one cohesive read-only box. The default variant is unchanged (its field already fills edge to edge). BaseField gains an internal readOnlyFilled signal for this; the field components pass it when readOnly and readOnlyVariant is 'filled'. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
3 tasks
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
1 participant
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.
No linked issue. Follow-up to #1060, stacked on
feat/readonly-field-subdued-border(base of this PR). Review #1059 and #1060 first; this targets #1060's branch and will retargetmainonce those merge.Short description
In the
borderedvariant, the container owns the border and padding while the field sits inside it. A read-onlyfilledfield put its grey on the inner field, so the fill showed up as an inset band that did not reach the border:Before: grey band floating inside a white padded box.
After: the whole bordered box is filled, so a read-only field reads as one cohesive grey card.
The fill now lives on the container for the bordered variant. The default variant is unchanged, since its field already fills edge to edge.
Implementation notes
BaseFieldgains an internalreadOnlyFilledsignal (not part of the public field props). The field components passreadOnly && readOnlyVariant === 'filled'..container.bordered.readOnlyFilled, so the default variant's container is never filled (only its inner field is, as before).plainbordered read-only fields are unaffected: subdued border, no fill.Scope
Separate from #1060 on purpose. #1060 refines the read-only border and hover for every field; this is a narrow appearance fix for one variant combination (bordered + filled + read-only).
PR Checklist