Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Reintroduce container component as a utility #14993

Merged
merged 7 commits into from
Nov 13, 2024

Conversation

philipp-spiess
Copy link
Member

@philipp-spiess philipp-spiess commented Nov 13, 2024

Closes #13129

We're adding back the v3 container component, this time as a utility. The idea is that we support the default container behavior but we will not have an API to configure this similar to what v3 offered. Instead, the recommended approach is to configure it by creating a custom utility like so:

@import "tailwindcss";

@utility container {
  margin-left: auto;
  margin-right: auto;
  padding-left: 2rem;
  padding-right: 2rem;
}

We do have an idea of how to migrate existing JS configuration files to the new @utility as part of the interop layer and the codemod. This is going to be a follow-up PR though.

Test Plan

We added a unit test but we've also played around with it in the Vite playground. Yep, looks like a container:

Screen.Recording.2024-11-13.at.17.43.08.mov

@philipp-spiess philipp-spiess marked this pull request as ready for review November 13, 2024 16:50
@philipp-spiess philipp-spiess requested a review from a team as a code owner November 13, 2024 16:50
CHANGELOG.md Outdated Show resolved Hide resolved
Co-authored-by: Adam Wathan <adam.wathan@gmail.com>
@philipp-spiess philipp-spiess changed the title Add container utility that mimics the v3 container component Reintroduce container component as a utility Nov 13, 2024
@adamwathan adamwathan merged commit dd85aad into next Nov 13, 2024
1 check passed
@adamwathan adamwathan deleted the feat/container-component-compat branch November 13, 2024 18:39
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.

[v4] Styles are not applied to the "container" class
3 participants