fix: repair responsive container contracts - #11
Merged
Conversation
Contributor
There was a problem hiding this comment.
Pull request overview
This PR delivers a 2.1.1 behavioral patch to ensure personality/container-query-driven responsive layouts react to the nearest inline-size container (fixing nested allocation breakpoints), while preserving established two-track thresholds and differentiating Docs vs Dashboard wide shells.
Changes:
- Re-scopes personality container queries from
@container ly-personality …to unnamed@container (min-width: …)queries, and gates 3-/4-track app-shell signatures behind a safe64remlocal allocation. - Updates the Docs recipe to a distinct wide (64rem) two-column navigation + stacked content shell (Dashboard remains three-column).
- Bumps release surface to 2.1.1 (package versions, docs, workflows, changelog) and extends static + Playwright smoke contracts for the new responsive behavior.
Reviewed changes
Copilot reviewed 35 out of 56 changed files in this pull request and generated no comments.
Show a summary per file
| File | Description |
|---|---|
| test/release-docs-contract.test.mjs | Updates release-contract assertions to 2.1.1 references. |
| test/pages-artifact.test.mjs | Updates Pages artifact expectations for version/date metadata. |
| test/layout-css-contract.test.mjs | Strengthens static CSS contracts for nearest-container queries and safe shell thresholds; validates Docs wide geometry. |
| test/demo-smoke.test.mjs | Adds Playwright coverage for wide-root + local-container behavior across personalities and thresholds. |
| styles/recipes.css | Gives Docs a distinct wide (64rem) two-column shell; Dashboard remains three-column. |
| styles/personalities/z-pattern.css | Switches to nearest-container queries; defers 3-track shell to 64rem local allocation. |
| styles/personalities/y2k.css | Switches to nearest-container queries; defers 3-track shell to 64rem local allocation. |
| styles/personalities/tactile.css | Switches to nearest-container query while preserving safe 2-track threshold. |
| styles/personalities/synthwave.css | Switches to nearest-container queries while preserving 64rem shell behavior. |
| styles/personalities/split-screen.css | Switches to nearest-container query while preserving safe 2-track threshold. |
| styles/personalities/retrofuturism.css | Switches to nearest-container queries; defers 3-track shell to 64rem local allocation. |
| styles/personalities/retro-glass.css | Switches to nearest-container queries; defers 3-track shell to 64rem local allocation. |
| styles/personalities/neumorphism.css | Switches to nearest-container queries while preserving safe 2-track threshold. |
| styles/personalities/mondrian.css | Switches to nearest-container queries; defers 3-track shell to 64rem local allocation. |
| styles/personalities/minimal-saas.css | Switches to nearest-container queries; defers 3-track shell to 64rem local allocation. |
| styles/personalities/maximalist.css | Switches to nearest-container queries; defers 4-track shell to 64rem local allocation. |
| styles/personalities/f-pattern.css | Switches to nearest-container queries; defers 3-track shell to 64rem local allocation. |
| styles/personalities/cyberpunk.css | Switches to nearest-container queries; defers 3-track shell to 64rem local allocation. |
| styles/personalities/brutalism.css | Switches to nearest-container queries; defers 3-track shell to 64rem local allocation. |
| styles/personalities/bento.css | Switches to nearest-container queries; defers 3-track shell to 64rem local allocation. |
| styles/personalities/bauhaus.css | Switches to nearest-container queries; defers 4-track shell to 64rem local allocation. |
| README.md | Updates version pinning and clarifies nearest-container + safe-shell threshold behavior. |
| package.json | Bumps package version to 2.1.1. |
| package-lock.json | Bumps lockfile package version and refreshes patched dev dependencies. |
| docs/wiki/UI-Style-Kit-Compatibility.md | Updates documented Layout Style CSS fixture version to 2.1.1. |
| docs/wiki/Release-And-Publishing.md | Updates release checklist/version contract to 2.1.1. |
| docs/wiki/Migrating-To-2.0.md | Updates install example to 2.1.1. |
| docs/wiki/Layout-Styles.md | Documents nearest-container personality behavior and 64rem feasibility gates. |
| docs/wiki/Layout-Recipes.md | Documents Docs vs Dashboard wide-shell differences at 64rem. |
| docs/wiki/Installation-And-CDN.md | Updates npm/CDN examples to 2.1.1. |
| docs/wiki/Home.md | Updates wiki home version and summary bullets for nearest-container behavior. |
| docs/wiki/Getting-Started.md | Updates install example to 2.1.1. |
| dist/recipes.css | Regenerates distribution with Docs wide-shell geometry change. |
| dist/personalities/z-pattern.css | Regenerates distribution with nearest-container queries + 64rem shell gate. |
| dist/personalities/y2k.css | Regenerates distribution with nearest-container queries + 64rem shell gate. |
| dist/personalities/tactile.css | Regenerates distribution with nearest-container query. |
| dist/personalities/synthwave.css | Regenerates distribution with nearest-container queries. |
| dist/personalities/split-screen.css | Regenerates distribution with nearest-container query. |
| dist/personalities/retrofuturism.css | Regenerates distribution with nearest-container queries + 64rem shell gate. |
| dist/personalities/retro-glass.css | Regenerates distribution with nearest-container queries + 64rem shell gate. |
| dist/personalities/neumorphism.css | Regenerates distribution with nearest-container queries. |
| dist/personalities/mondrian.css | Regenerates distribution with nearest-container queries + 64rem shell gate. |
| dist/personalities/minimal-saas.css | Regenerates distribution with nearest-container queries + 64rem shell gate. |
| dist/personalities/maximalist.css | Regenerates distribution with nearest-container queries + 64rem shell gate. |
| dist/personalities/f-pattern.css | Regenerates distribution with nearest-container queries + 64rem shell gate. |
| dist/personalities/cyberpunk.css | Regenerates distribution with nearest-container queries + 64rem shell gate. |
| dist/personalities/brutalism.css | Regenerates distribution with nearest-container queries + 64rem shell gate. |
| dist/personalities/bento.css | Regenerates distribution with nearest-container queries + 64rem shell gate. |
| dist/personalities/bauhaus.css | Regenerates distribution with nearest-container queries + 64rem shell gate. |
| dist/legacy.css | Regenerates legacy distribution to match new nearest-container + 64rem gating behavior. |
| dist/layout-style-css.min.css | Regenerates minified bundle for 2.1.1 behavior and recipe/personality changes. |
| dist/layout-style-css.css | Regenerates flattened bundle for 2.1.1 behavior and recipe/personality changes. |
| demo/sitemap.xml | Updates demo sitemap lastmod for the 2.1.1 release date. |
| demo/index.html | Updates demo structured metadata version to 2.1.1. |
| CHANGELOG.md | Adds 2.1.1 release entry describing fixes, tests, and lockfile security refresh. |
| .github/workflows/npm-publish.yml | Updates workflow dispatch help text to v2.1.1 example tag. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
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
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.
What changed
Root cause
Personality queries were bound to the full
ly-personalityroot, so narrow nested allocations activated wide shell tracks. Dashboard and Docs also shared their wide geometry, making the two recipes visually indistinguishable.Compatibility
This is a behavioral patch. It removes no selectors, tokens, data hooks, or structural APIs, and preserves DOM and keyboard order.
Verification
npm.cmd run release:verify