Single value layout fix #4720
Single value layout fix #4720
Conversation
🦋 Changeset detectedLatest commit: 3de0504 The changes in this PR will be included in the next version bump. This PR includes changesets to release 1 package
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
|
This pull request is automatically built and testable in CodeSandbox. To see build info of the built libraries, click here or the icon next to each commit SHA. Latest deployment of this branch, based on commit 3de0504:
|
seancurtis
force-pushed
the
singleValue-layout-fix
branch
3 times, most recently
from
2c69f1d
to
ad9c88f
Compare
… which results in much better sizing when used as a flex child.
seancurtis
force-pushed
the
singleValue-layout-fix
branch
from
c55cef0
to
1022529
Compare
|
@Rall3n thanks for the catch in the layout when expanded. I was working on it using a fixture to test the flex content and as such it was constantly squashed. I just reverted it before pushing. I did some more fixes to the layout/alignment as I noticed another issue too. It's much more solid now. |
| @@ -29,11 +29,9 @@ export const placeholderCSS = < | |||
| }: PlaceholderProps<Option, IsMulti, Group>): CSSObjectWithLabel => ({ | |||
| label: 'placeholder', | |||
| color: colors.neutral50, | |||
| gridArea: '1 / 2', | |||
There was a problem hiding this comment.
Forgot to provide the Placehholder component with the latest fix :)
|
D'oh! Not sure how I missed that one tbh. Should be good now. |
There was a problem hiding this comment.
Nice! Ha, love css grids, this is so neat now. Thanks @seancurtis
The absolute positioning pulls both the value and the placeholder out of the flow, and thus the component itself collapses down when used as a flex child. This can be solved by wrapping the component in another div, but we can solve it better by using CSS Grid instead.